Triggering Synthetic Event in React App

Question

Я пишу расширение Chrome для Facebook и хочу программным образом инициировать отправку сфокусированного комментария на пост. Поведение по умолчанию заключается в том, чтобы отправить, когда пользователь нажимает клавишу Enter, поэтому я пытаюсь обмануть пользовательский интерфейс Facebook, думая, что пользователь сделал это.

Facebook использует React и contenteditable div для комментариев.

Вот набор вещей, которые я пробовал:

1) JQuery событие запуска $('<the contenteditable div>').trigger($.Event('keydown', {which: 13}))

• Я попытался это как из среды контент-сценариев и реальной среде страницы (с помощью как вложенный сценарий, реагирующий на postMessage, так и на консоль Chrome)
• Я также попытался запустить событие на document из каждого контекста.
• Ничего похожего не происходит.

2) То же самое, но с запуском события VanillaJS. relevant StackOverflow question

• также с обеих средах
• Ничего не происходит

3) В этот момент я понял, что это React, и он использует свой собственный SyntheticEvents, поэтому я в основном копировать/вставить в Simulate function from ReactTestUtils, который предположительно чтобы помочь тестировать, моделируя события и запуская их в среде страницы (захватывая ссылки на объекты required через интерфейс Facebook require).

• Также не работает. Функция выполняется полностью и без ошибок, но ответа от приложения нет.

Я пробовал это в основном с keydown событиями, потому что к нему прислушивается большинство слушателей.

Я в курсе этих вопросов, но они не помогли моему пониманию: Force React to fire event through injected JavaScript

Answer 1

Неясно основано на описании того или нет, это вопрос, но SyntheticEvent вызвала у меня боль, прежде чем из-за факт, что объект повторно используется. Там записка в React docs об этом:

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

Если вы не используете данное событие в данный момент, или если вы пытаетесь передать его в новую область действия, вам нужно будет persist().