Статьи

Отладка юнит-тестов с использованием js-test-driver

Январь 19, 2019

Модульное тестирование и разработка через тестирование (TDD) являются в настоящее время распространенными парадигмами. Если вы являетесь разработчиком JavaScript, Google создал и открыл отличный инструмент под названием js-test-driver для помощи в модульном тестировании. js-test-driver — это модуль модульных тестов JavaScript в духе JUnit , который переносит TDD в JavaScript.

Обзор модульного тестирования

Если вы никогда ранее не проводили модульное тестирование и не входили в мир TDD, вы можете спросить себя, в чем выгода. Есть много подробных обсуждений по этому вопросу, но я коснусь нескольких наиболее важных моментов.

  • Модульные тесты полезны в регрессионном тестировании. Вы можете запустить модульные тесты после внесения изменений в код и убедиться, что все работает так, как раньше. Это особенно важно в динамических языках, таких как JavaScript, которые не дают ошибок компиляции.
  • Чем сложнее / масштабнее проект, тем больше юнит-тестов обеспечат вам возврат инвестиций.
  • Комплексный набор модульных тестов почти так же хорош, как и документация. Имея хороший набор модульных тестов, разработчик может открыть проект и запустить запуск / отладку модульных тестов, чтобы лучше понять систему. Это очень полезно при наборе нового члена команды.
  • JUnit — это популярная среда тестирования Java, которая имела решающее значение при разработке Test Driven Development. Многие из существующих сред тестирования соответствуют соглашениям об именах и идиомам JUnit.

Конфигурирование вашей системы

Из этого туториала вы узнаете, как устанавливать точки останова и отлаживать юнит-тесты в интегрированной среде разработки (IDE). Мы сосредоточимся на IntelliJ IDE. В этом руководстве используется среда Microsoft Windows, но она должна работать в большинстве операционных систем путем изменения переменных среды. Вам также нужно будет следовать этим инструкциям:

  1. Скачайте и установите IntelliJ. Вы можете скачать IntelliJ с сайта JetBrains .
  2. Если вы еще этого не сделали, загрузите и установите Java Development Kit (JDK) .
  3. В IntelliJ убедитесь, что вы установили плагин js-test-driver. Если вы не знаете, как это сделать, обратитесь к инструкции JetBrains для установки плагинов .
  4. Загрузите последнюю версию js-test-driver.jar . На момент написания статьи последняя версия 1.3.5. Для целей данного руководства сохраните C:devtoolswebjsjs-test-driver1.3.5js-test-driver-1.3.5.jar jar в C:devtoolswebjsjs-test-driver1.3.5js-test-driver-1.3.5.jar .
  5. Добавьте следующие переменные среды, чтобы среда выполнения Java могла быть вызвана из командной строки. 
     JAVA_HOME = C: Program FilesJavajdk1.7.0_7 (или местоположение вашей установки Java)
 PATH =% JAVA_HOME% бен;% PATH%

    Вы можете проверить установку, открыв командную строку и введя java . Если Java установлена ​​правильно, вы должны увидеть вывод, аналогичный показанному на скриншоте ниже.

  6. Создайте новый проект в IntelliJ, перейдя в верхнее меню и нажав File | New Project File | New Project . Я создал проект IntelliJ с веб-модулем в C:projectsjs-test-driver . Настройки IntelliJ показаны на рисунке ниже.

  7. В TDD и модульном тестировании всегда полезно иметь четкое и четкое разделение между вашим рабочим кодом и тестовым кодом. Создайте каталоги src и test в корне проекта IntelliJ. После создания этих каталогов ваш проект должен выглядеть следующим образом.

Начиная

  1. Мы собираемся добавить примеры «greeter», которые являются частью проекта js-test-driver. Создайте новый файл JavaScript с именем greeter.js в каталоге src и добавьте следующий код. 
     myapp = {}; myapp.Greeter = function() {}; myapp.Greeter.prototype.greet = function(name) { return "Hello " + name + "!"; };
  2. Теперь мы создадим юнит-тест. Создайте соответствующий тестовый файл JavaScript greetertest.js в каталоге test и добавьте следующий код. 
     TestCase("GreeterTest", { setUp:function () { }, "test greet": function() { var greeter = new myapp.Greeter(); assertEquals("Hello World!", greeter.greet("World")); }, "test greet null": function() { var greeter = new myapp.Greeter(); assertNull(greeter.greet(null)); } });
  3. В greetertest.js IntelliJ не поймет класс TestCase и выделит его красным. Нажмите TestCase и вам будет предложено указать предполагаемое намерение JetBrains. Затем нажмите кнопку Add JsTestDriver assertion framework support , как показано на следующем рисунке. Это добавит поддержку IntelliJ IDE для js-test-driver.

  4. Создайте файл с именем js-test-driver.conf в корневом каталоге вашего проекта. Для целей данного руководства полный путь будет C:projectsjs-test-driverjs-test-driver.conf . Добавьте информацию, показанную на следующем рисунке, в js-test-driver.conf .

  5. Теперь давайте настроим наш проект для отладки с точкой останова. Установите greetertest.js останова в файле greetertest.js в функции testgreet() . Вы можете установить точку останова в IntelliJ, нажав на левом поле.
  6. Создайте новую конфигурацию IntelliJ Run / Debug типа JavaScript Debug | JavaScript JavaScript Debug | JavaScript как показано ниже.

  7. Измените следующие значения:
    • URL для открытия: http://localhost:9876/capture
    • Разверните каталог test и введите http://localhost:9876/test/test для удаленного URL.
  8. Как мы уже видели, IntelliJ обеспечивает отличную интеграцию с драйвером js-test. Чтобы запустить сервер js-test-driver непосредственно из IntelliJ, разверните JsTestDriver Server меню JsTestDriver Server и нажмите зеленую кнопку воспроизведения, как показано ниже.

  9. Теперь давайте отладим наш JavaScript из IntelliJ! Запустите конфигурацию отладки, которую мы создали ранее, под названием JavascriptRemote . Вы можете сделать это, выбрав Run | Debug Run | Debug из меню. Откроется новое окно браузера с загрузчиком удаленной консоли js-test-driver, как показано ниже.

  10. Далее откройте новую командную строку. cd в корень проекта IntelliJ. Для целей этого проекта этот каталог — C:projectsjs-test-driver . Введите следующую команду: 
      java -jar C: devtoolswebjsjs-test-driver1.3.5js-test-driver-1.3.5.jar - проверяет все
  11. Через несколько секунд IntelliJ должен быть приостановлен в точке останова, которую мы установили ранее. Теперь нам будут доступны локальные переменные, выражения для просмотра и другие полезные свойства отладки. Примечание: в IntelliJ интеллектуальное завершение кода доступно в выражениях часов!

Вывод

Эта статья научила вас отлаживать модульные тесты JavaScript с помощью js-test-driver. Теперь вы должны иметь возможность устанавливать точки останова из среды разработки IntelliJ. В конечном счете, я надеюсь, что это поможет вам создать хорошо протестированное программное обеспечение для ваших текущих и будущих проектов.

40
Share: