Chrome DevTools getEventlisteners не работает внутри iFrame - PullRequest
0 голосов
/ 11 декабря 2018

Я хотел бы получить доступ / отладить функции, связанные с конкретными событиями.Например, я могу сделать

$> getEventListeners(window)

, чтобы увидеть все события, связанные с объектом window, а затем

$> debug(getEventListeners(window).focus[0].listener)

, чтобы начать отладку.

Однако в моем случае у меня есть iframe

<body>
   ...
   <iframe id="test" name="test" src="./inner.html"></iframe>
   ...
</body>

Теперь предположим, что inner.html содержит следующее:

<body>
    <div class="abc">Click me</div>
    <script>
        window.addEventListener('keydown', e => console.log('keydown', e));        
        document.querySelector('.abc').addEventListener('click', e => console.log('clicked', e));
    </script>
</body>

И я хотел бы отладить этидва слушателя, как я описал выше, оказывается, что getEventListeners больше не работает (или я делаю что-то не так!)

iframe = document.querySelector('iframe#game');
doc = iframe.contentDocument || iframe.contentWindow.document;
win = iframe.contentWindow;

getEventListeners(win); // -> {}
getEventListeners(doc.querySelector('.abc')); // -> {}

Я получил {}, слушатели событий не найдены.

Итак, вопрос в том, как я могу получить доступ к прослушивателям событий внутри iframe?

Примечание: поскольку это только для локального тестирования / отладки, я могу переключать любые настройки Chrome, если это необходимо, чтобы сделать этоза работой!Есть предложения?

1 Ответ

0 голосов
/ 12 декабря 2018

Как комментарий @epascarello - вам нужно изменить контекст окна отладки, чтобы он был iframe

Официальная документация

...