Как использовать element.dispatchEvent в консоли Chrome

Question

Я создал фрагмент в Chrome Devtools, но он выдает эту ошибку при запуске:

Uncaught TypeError: element.dispatchEvent не является функцией
при изменении значения (:12:11)
в:15:1

Это мой код:

var script = document.createElement("script");
  script.setAttribute("src", "//code.jquery.com/jquery-latest.min.js");
  script.addEventListener('load', function() {
    var script = document.createElement("script");
    document.body.appendChild(script);
  }, false);
  document.body.appendChild(script);

const changeValue = (element, value) => {
  const event = new Event('input', { bubbles: true })
  element.value = value
  element.dispatchEvent(event)
}

changeValue($('#typeahead-input-to'), 'Syd');

Есть ли способ заставить этот код работать, запустив его в консоли Chrome?

Answer 1

const changeValue = (element, value) => {
  const event = new Event('input', { bubbles: true })
  element.value = value
  element.dispatchEvent(event)
}
debugger;
changeValue($("#typeahead-input-to")[0], 'Syd');

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" id="typeahead-input-to"></input>