Отслеживаем ошибки JavaScript с помощью JSerror

Введение

Все знают, что практически ни один современный сайт сейчас не обходится без функционала, реализуемого на JavaScript, и, конечно, там могут быть ошибки, которые возникают по различным причинам - ошибка в коде, особенности браузера (а браузеров сейчас много, да ещё и мобильных). Часто они остаются незамеченными. К тому же как правило отслеживаются ошибки только серверными инструментами (error.log, watchdog и так далее). Так почему бы не делать это и для клиентской части? В данной статье мы рассмотрим модуль JSerror (https://www.drupal.org/project/jserror) для Drupal 7, который позволяет отслеживать и записывать в лог клиентские JavaScript ошибки.

Установка

Что касается установки, то здесь всё как обычно, но есть небольшие нюансы, о которых следует предупредить заранее.

Модуль JSerror для определения браузера использует улучшенную версию стандартной функции get_browser() из модуля Browscap (https://www.drupal.org/project/browscap). Поэтому установку стоит начать с этого модуля (к сожалению на сегодняшний момент в стабильной версии модуля используются некорректные ссылки на сервис browserscap, поэтому стоит использовать dev-версию):

drush dl --destination sites/all/contrib browscap-7.x-2.x-dev

Далее качаем JSerror:

drush dl --destination sites/all/contrib jserror

После чего включаем оба модуля:

drush en browscap jserror

Или делаем всё то же самое, но только одной командой:

drush dl --destination=sites/all/modules/contrib browscap-7.x-2.x-dev jserror && drush en browscap jserror

Естественно, можно это всё сделать и вручную, без использования Drush.

Заходим на страницу настроек модуля Browscap (http://test.host/admin/config/system/browscap) чтобы проверить всё ли в порядке:

Тут всё выглядит хорошо, но всё-таки если установить текущую стабильную версию (7.x-2.1), то вы получите сообщение об ошибке. Дальше посмотрим, что нам предлагает модуль JSerror. Открываем страницу конфигурации и видим:


 

Хочется отметить, что Debug Mode - режим отладки, определяет какую версию (минимизированную или нет) отслеживающего скрипта отдавать клиенту. Здесь речь идёт именно о скрипте модуля JSerror, а не JS-файлах всего сайта.

Остальные опции стоит обязательно пометить в preproduction чеклист и не забыть настроить перед деплоем проекта в боевое окружение.

Испытание

Теперь посмотрим как это работает, ради этого специально напишем код с ошибкой:

(function ($) {
  Drupal.behaviors.jserrorTest = {
    attach: function (context, settings) {
      Drupal.callUndefinedFunction();
    }
  };
})(jQuery);

В консоли Google Chrome получаем такую картину:

Теперь наступает момент истины. Идём смотреть лог JSerror (http://test-host/admin/reports/jserror).

Так выглядит страница с отчётами:

Как видно из скриншота, наша ошибка успешно записана, модуль сработал как положено.