einen Text in ein Textfeld ein, und hier Web Chat

Question

Fiddle des in Bot-Framework auf der Schaltfläche simulieren klicken: https://jsfiddle.net/chpaeeL9/1/

Microsoft Bot-Framework hat ein Webchat-Modul, das Sie Ihren Bot sprechen kann.

Wenn der Benutzer auf die Schaltfläche Say Hi klickt, möchte ich Text in das Textfeld des Webchats einfügen und im Webchat mit JavaScript auf die Schaltfläche Senden klicken.

Klingt nach etwas zu einfach, aber es war nicht. Hier ist der Code, den ich derzeit habe, und es funktioniert nicht: Das Klickereignis wird irgendwie nicht ausgelöst.

$('#sayhibutton').click(function() { 
    $('.wc-console').addClass('has-text'); // works 
    $('.wc-shellinput').val("Hi bot!").change(); // works 
    $('.wc-send').click(); // doesn't work! 
    $('.wc-send svg').click(); // doesn't work either 
}); 

Update: Wenn das hilft, scheint es, dass die Schnittstelle mit React geschrieben wird.

Update: meine Frage unterscheidet sich von meiner vorherigen Frage darüber, wie iframes im Webchat zu vermeiden.

Answer 1

OK, für das Fehlen einer besseren Option war meine Lösung eine ziemlich dreckige und hässliche Lösung.

Speichern Sie den Code in botchat.js in eine Datei und verweisen Sie auf die gespeicherte Datei aus der HTML-Datei, anstatt der CDN-Version.

die Datei in Chrome Pretty-Print und die Zeile finden, der sagt:

e.prototype.sendMessage = function() { 
    this.props.inputText.trim().length > 0 && this.props.sendMessage(this.props.inputText) 
} 

die mittlere Linie mit diesem ersetzen:

this.textInput.value.trim().length > 0 && this.props.sendMessage(this.textInput.value) 

Dies bedeutet im Grunde den Nachrichtentext von this.textInput.value eher zu nehmen als von this.props.inputText, oder mit anderen Worten, nehmen Sie es direkt vom DOM-Knoten Textinput.

Irgendwie löst das Auslösen des change-Ereignisses in einem Textfeld kein tatsächliches -Ereignis in der Textbox aus, weshalb wir dies tun müssen.