Отладка события onFocus с помощью Chrome Developer Tools? Не удается вернуть фокус после точки останова

Question

Я пытаюсь отладить событие JavaScript onFocus, прикрепленное к группе текстовых полей на странице.Ошибка возникает при выделении текстового поля и последующем переходе к следующему текстовому полю.Я пытаюсь отладить это, поместив точку останова в событие onFocus с помощью Chrome Dev Tools.Проблема, с которой я сталкиваюсь, заключается в том, что когда я выбираю текстовое поле и точка перехвата перехватывается, Chrome Dev Tools крадет фокус и не возвращает его, поэтому я не могу перейти к следующему текстовому полю.У кого-нибудь есть идея для обхода?Я думаю, что могу прибегнуть к предупреждающим заявлениям, чтобы напечатать всю необходимую информацию без использования Chrome Dev Tools ......

Answer 1

Один из вариантов отладки сложных случаев - установить интервал для опроса фокуса в консоли.

setInterval(function() {console.log($(':focus')); }, 1000);

Введите это в консоли (обновите его, включив в него любые интересующие вас сведения), нажмите клавишу ввода, а затем сохраните консоль там, где вы можете ее видеть, пока вы что-то делаете в своем пользовательском интерфейсе.

* MDN документы для setInerval ()

Answer 2

Chrome Dev Tools включает кнопку «Воспроизведение / Пауза» как в Инспекторе, так и в качестве наложения на веб-страницу.Использование наложения предотвращает попадание фокуса на Инспектора.

Кроме того, я обнаружил, что следующий тип решения для ведения журналов легче отследить, чем интервальный метод (благодаря меньшей избыточности и возможности подбора наизменения, которые происходят быстрее, чем интервал):

$('*').on('focus blur', function(event) {console.log(event.type + " to:"); console.log(document.activeElement);});

Answer 3

Вы правы, Chrome DevTools получает фокус и не восстанавливает его, когда вы возвращаетесь на отлаженную страницу.Не стесняйтесь подавать сообщение об ошибке на http://new.crbug.com (убедитесь, что вы начинаете сводку с «DevTools:», чтобы ошибка могла быть назначена соответствующей команде как можно быстрее.)

Напримечание: console.log() - немного лучшая альтернатива alert(), поскольку позволяет форматировать вывод.