Большинство браузеров поставляются со встроенными инструментами разработчика. Эти инструменты разработчика обычно включают в себя консоль . Консоль предоставляет вам информацию о странице, которая работает в данный момент.
Сообщения, регистрируемые в консоли, исходят либо от веб-разработчиков, создавших страницу, либо от самого браузера. Все сообщения консоли имеют уровень серьезности: Verbose , Info , Warning или Error . Сообщение Error означает, что на вашей странице возникла проблема, которую необходимо устранить.
Как не удается выполнить аудит ошибок браузера Lighthouse
Lighthouse отмечает все ошибки браузера, регистрируемые в консоли:
Как исправить ошибки браузера
Исправьте каждую ошибку браузера, о которой сообщает Lighthouse, чтобы ваша страница работала должным образом для всех ваших пользователей.
Chrome DevTools включает в себя несколько инструментов, которые помогут вам отследить причины ошибок:
- Под текстом каждой ошибки консоль DevTools показывает стек вызовов , вызвавший выполнение проблемного кода.
- Ссылка в правом верхнем углу каждой ошибки показывает код, вызвавший ошибку.
Например, на этом снимке экрана показана страница с двумя ошибками:
В этом примере первая ошибка исходит от веб-разработчика при вызове console.error() . Вторая ошибка исходит от браузера и указывает на то, что переменная, используемая в одном из скриптов страницы, не существует.
Под текстом каждой ошибки консоль DevTools указывает стек вызовов, в котором появляется ошибка. Например, для первой ошибки консоль указывает, что (anonymous) функция вызывает функцию init , которая вызывает функцию doStuff . Щелкнув ссылку pen.js:9 в правом верхнем углу этой ошибки, вы увидите соответствующий код.
Просмотр соответствующего кода для каждой ошибки таким образом может помочь вам выявить и устранить возможные проблемы.
Если вы не можете выяснить причину ошибки, попробуйте ввести текст ошибки в поисковик. Если вы не можете найти решение своей проблемы, попробуйте задать вопрос на Stack Overflow .
Если вы не можете исправить ошибку, подумайте о том, чтобы обернуть ее в оператор try…catch , чтобы явно указать в коде, что вы знаете о проблеме. Вы также можете использовать блок catch для более изящной обработки ошибки.