Das Auslösen eines manuellen Klickereignisses auf einer Schaltfläche in ember.js führt nicht zum erforderlichen Ergebnis

Question

TL; DR: Wenn Sie versuchen, ein manuelles JavaScript-Klickereignis auf der Chatschaltfläche von twitch auszulösen, wird die Nachricht nicht gesendet. Verstehe nicht, warum das Ereignis nicht wie ein normaler Klick funktioniert und nicht weiß, wie es funktioniert.

Also ich versuche, einen benutzerdefinierten Bot für twitch.tv zu machen, nur seine Informationen aus dem HTML direkt zu lesen. Ich habe es bis zum Punkt perfektioniert, wo es Befehle erkennen und Text in das Textfeld schreiben kann. Jetzt ist das Problem, das ich habe, sobald ich versuche, ein manuelles Klicken Ereignis auf dem "Chat" Knopf zu schießen, scheint es gerade nicht zu arbeiten. Ich vermute, es hat etwas mit ember.js zu tun, und ich weiß ehrlich gesagt nichts davon. Wie auch immer, hier ist der Teil des Codes, der nicht funktioniert. EDIT: das funktioniert, wenn ich es als Single in der Konsole eingeben, funktioniert nicht im Zusammenhang mit dem Rest meines Codes.

$('.send-chat-button').click(); 

Was hier passiert, ist, dass ich ein Stück HTML erwerben, der Chat-Submit-Button enthält, was das ist:

<button class="button primary float-right send-chat-button" data-bindattr-3945="3945"> 
    <span> 
    Chat 
    </span> 
</button> 

Wenn ich versuche, manuell auf das ein Klick-Ereignis ausgelöst, geschieht nichts . Wenn ich jedoch ein manuelles Klickereignis auf buttonContain.children [0] und buttonContain.children 1 (das sind die Einstellungen bzw. die Liste der Viewer-Schaltflächen) auslöst, funktioniert es. Sie sehen wie folgt aus:

<a data-ember-action="3943" class="button glyph-only float-left" title="Chat Settings"></a> 

Ich vermute, der Unterschied ist in der Daten glut-Aktion und die Daten-bindattr- *, aber ich weiß nicht, wie es funktioniert. Jeder hier weiß, warum das Ereignis click() nicht funktioniert und direktes Klicken funktioniert?

EDIT: Wenn Sie Fragen zu meiner Frage haben, zögern Sie nicht zu fragen.

EDIT2: Ich habe ein wenig mehr experimentiert, und ich kann alle HTML-Attribute von der Schaltfläche entfernen, und klicken Sie darauf, wird immer noch funktionieren. Ich habe keine Ahnung, was auf :(geht

EDIT3. Okay, so scheint es, es nur nicht mehr funktioniert, wenn ich den Span innerhalb der Schaltfläche entfernen noch keine Ahnung, was los ist (Ja, habe auch versucht. um das Klickereignis auf die Spanne zu feuern)

EDIT4: Wie gewünscht, hier ist der gesamte Code von meiner Seite.Beachten Sie, dass ich versuche, einen Knopf von Twitch selbst zu drücken, von welcher Glutseite ich keine besitze Dieser Code wird verwendet, indem man ihn in die Konsole in einem twitch.tv-Stream einfügt und ihn dann durch Aufruf von initiateMessageProcessing aufruft. Es tut mir leid für die vielen fest codierten Werte, das sind zuckende Felder, die ich brauche. Ich suche nur nach einem Proof of Concept

var frequency = 5000; 
var myInterval = 0; 
var lastMessageId = 0; 

function initiateMessageProcessing() { 
    if (myInterval > 0) { 
     clearInterval(myInterval); 
    } 

    myInterval = setInterval("checkMessages()", frequency); 
} 

function checkMessages() { 
    var chat = document.getElementsByClassName("chat-lines")[0]; 
    processMessages(extractUnprocessedMessages(chat.children)); 
    lastMessageId = parseInt(chat.lastElementChild.getAttribute("id").substring(5, 10)); 
} 

function extractUnprocessedMessages(chat) { 
    var unprocessedMessages = []; 
    var chatId = 0; 
    for (i = 0; i < chat.length; i++) { 
     chatId = parseInt(chat[i].getAttribute("id").substring(5, 10)); 
     if (chatId > lastMessageId) { 
      unprocessedMessages.push(chat[i]); 
     } 
    } 
    return unprocessedMessages; 
} 

function processMessages(unprocessedMessages) { 
    var messageElement; 
    for (i = 0; i < unprocessedMessages.length; i++) { 
     messageElement = unprocessedMessages[i].children[0].getElementsByClassName("message")[0]; 
     if (messageElement != undefined && messageElement != null) { 
      if (messageElement.innerHTML.search("!test") !== -1) { 
       sendMessage('Hello world!'); 
      } 
     } 
    } 
} 

function sendMessage(message) { 
    fillTextArea(message); 
    var button = $('.send-chat-button').get(0); 
    var event = new MouseEvent('click', { 
     bubbles : true 
    }); 
    button.dispatchEvent(event); 
} 

function fillTextArea(message){ 
    var textArea; 
    var chatInterface = document.getElementsByClassName("chat-interface")[0]; 
    var textAreaContain = chatInterface.children[0]; 
    textArea = textAreaContain.children[0].children[0]; 
    textArea.value = message; 
} 

EDIT5: Eventlistener Screenshot:

EDIT6: Edited Code Quelle $ verwenden klicken(); ('send-chat-Taste.'). Ich habe dies versucht, funktioniert nicht im aktuellen Code, es funktioniert, wenn ich manuell diesen einzelnen Befehl in der Konsole auslösen, wenn es Text im Chat gibt. Aber leider funktioniert das nicht in meinem Code.

EDIT7: verwendet Ember.run, funktioniert immer noch nicht.

EDIT8: gebraucht dispatchmouseevent, funktioniert immer noch nicht in Zusammenhang mit dem Code

Answer 1

Es scheint, dass die Zielstelle Ereignis-Listener ohne Hilfe von JQuery beimißt.Wenn dies der Fall ist, können Sie es nicht mit der Methode jquery .click() auslösen.

können Sie versuchen, direkt den Browser Veranstaltung wie dieser spöttischen:

var button = $('.send-chat-button').get(0); 
var event = new MouseEvent('click', {bubbles: true}); 
button.dispatchEvent(event); 

Dieser Code wird in IE8 nicht funktionieren und niedriger, aber ich denke, es ist nicht der Fall ist.

Answer 2

Programmgesteuertes Klicken auf ein DOM-Element, um etwas zu tun, ist etwas falsch.

Sie sollten eine Methode myAction() definieren, die auf zwei Arten aufgerufen wird. Erstens, von Ihrer Ember-Aktion triggerMyAction() und zweitens nach dem Abhören eines benutzerdefinierten Ereignisses "myEvent".

Anstelle von $ ('. Send-chat-button'). Click(); Sie werden $ ('etwas') programmieren. triggern ("myEvent") dann.

Etwas wie:

Em.Controller.extend({ 

    myAction:function(){ 
     //do your stuff 
    }, 

    onMyEvent:function(){ 
     $('something').on('myEvent',this.myAction); 
    }.on('didInsertElement'), 

    actions:{ 
     triggerMyAction:function(){ 
      this.myAction(); 
     } 
    } 
}) 

Answer 3

Ich weiß, dass dieser Beitrag ist ziemlich alt, aber ich hatte eine Antwort auf diese für eine Weile und nichts wirklich funktioniert suchen, nachdem eine Menge Sachen auszuprobieren fand ich es funktioniert Wenn du zuerst die Chatbox fokussierst, dann fokussiere den Button und trigse dann das Click Event !!! uuuhm yeah ...

$('.chat_text_input').focus(); 
$('.send-chat-button').focus().trigger('click'); 

Ich habe keine Ahnung, warum das funktioniert (und warum es auf andere Weise nicht), aber verlassen Sie eine der konzentriert sich heraus macht es aus fehlschlagen oder Fehler.