Проблемы с автоматическим вводом текста в текстовое поле - PullRequest
Новая
       29

Проблемы с автоматическим вводом текста в текстовое поле

0 голосов
/ 19 апреля 2020

Это довольно длинный вопрос, так как я постарался включить как можно больше деталей. Если вы хотите перейти к актуальному вопросу, посмотрите последний абзац.

Я пытаюсь написать бота, который будет принимать команды для показа объявления ie, например /r 1d20+2, оценки и отправив ответ в Javascript в окне чата на веб-сайте streamyard.com (поскольку это мой DM использует для потоковой передачи D & D).

У меня проблемы с «вводом» в текстовое поле. поле. Вот HTML окна чата на странице: 

<div class="Chat__Wrap-eYhJOs AJLtK">
  <ul class="Chat__Comments-dUewnW eqLtEG">
    <li class="Comment_Wrap-lbwIWt klCgOs">
      <div class="Comment_TextWrap-hSuVQ gHYXCH">
          <p class="Text__StyledText-guhEiE bLDoWl" color="default">test</p>
      </div>
    </li>
  </ul>
  <form class="ChatInput__Form-eqBCnG iHgCda">
    <div class="ChatInput__InputWithSmallGutter-fOaQzB dEaxxd Input__Wrap-kXBxwI iUPDqt">
      <label>
        <textarea class="sc-bdVaJa eFZRmf"></textarea>
      </label>
    </div>
    <button class="Button_Wrap-ivpgWU dSirvr ButtonBase__WrapperButton-bsASeg cylsQk" type="submit" color="primary">
      <span class="Button__InnerSpan-iZsIhM jVWFud">Send</span>
    </button>
  </form>
</div>

Я могу получить указатель на текстовую область с помощью следующего: 

var textbox = document.getElementsByClassName("sc-bdVaJa eFZRmf")[1];

И я могу вставьте в него текст следующим образом: 

textbox.value = 'test';
textbox.innerText = 'test';

, что заставляет текстовое поле отображать значение (в данном случае «test») при вводе (в частности, команда textbox.value делает это). Тем не менее, когда я go "отправляю" сообщение, используя следующее: 

var button = document.getElementsByClassName("Button__Wrap-ivpgWU dSirvr ButtonBase__WrapperButton-bsASeg cylsQk");

button[1].click();

Он не отправляет сообщение чата, в которое я "набрал". Он вообще ничего не отправляет и даже не очищает текстовую область, как если бы кнопка была нажата. Кроме того, если я вручную нажимаю кнопку, происходит то же самое. Теперь, если я вручную щелкну текстовую область и введу в нее что-нибудь, например, добавлю пробел после текста, который я программно вставил в него, а затем выполню приведенный выше код, чтобы нажать кнопку, он отправит сообщение.

Итак, это заставляет меня думать, что когда клавиатура нажимает кнопку, которую я не учитываю, что-то обнаруживается, просто устанавливая значение textarea. После некоторого поиска в Google я узнал о запуске события onchange. Итак, я попробовал следующее: 

if ("createEvent" in document) {
    var evt = document.createEvent("HTMLEvents");
    evt.initEvent("change", false, true);
    textbox.dispatchEvent(evt);
}
else {
    textbox.fireEvent("onchange");
}

Однако, это просто приводит к тому же, что и раньше. Я также попытался смоделировать нажатие клавиши в текстовой области с помощью кода, подобного следующему: 

textbox.dispatchEvent(new KeyboardEvent('keypress', {'key': 'a'}));

Однако, это также, похоже, не работает, так как кнопка «Отправить» не работает (и похоже, текстовая область не заполняется указанным ключом «а»). Но еще раз, если бы я должен был что-то ввести вручную в поле, кнопка «Отправить» теперь работает, поскольку он обнаружил что-то вводится. Я также попытался динамически импортировать jQuery и использовать jQuery для имитации нажатия клавиш, как показано ниже: 

var e1 = jQuery.Event("keydown");
e1.which = 97;
$('textarea.sc-bdVaJa').last().trigger(e1);
var e2 = jQuery.Event("keyup");
e2.which = 97;
$('textarea.sc-bdVaJa').last().trigger(e2);

Но это просто привело к тому же, что и выше, «а» (десятичное 97) не не появляются в текстовой области, и кнопка «Отправить» не работает.

То, что я думал, будет одной из самых простых частей этого маленького проекта, отправка строки текста в текстовую область, оказывается быть намного сложнее, чем я думал. Что я ищу, так это как мне go заставить веб-страницу зарегистрировать этот новый текст, введенный в текстовую область, чтобы я мог "нажать" кнопку и отправить ее в чат?

1 Ответ

0 голосов
/ 19 апреля 2020

Хотя это не решает проблему напрямую, это то, что я сделал, чтобы это работало. Вместо того, чтобы использовать текстовую область и кнопку «Отправить» на веб-странице, я решил отключить посредника и просмотреть сетевой трафик c, который отправляется при создании сообщения. Затем я использую JavaScript для отправки аналогичного запроса на сервер, и он успешно отправляет сообщение. Вот как я это сделал. 

var xhttp = new XMLHttpRequest();
xhttp.open("POST", "/api/broadcasts/dug95avkgq/chat", true);
xhttp.setRequestHeader("content-type", "application/json");
xhttp.send('{"text":"<MESSAGE>","name":"<USERNAME>","clientId":"<ID>","color":"#22653f","csrfToken":"<TOKEN>"}');
...