Тестирование

Тестирование гарантирует, что ваш код работает так, как задумано, и избавляет от утомительной отладки.

См. документацию «Стартовые наборы»: в ней описана простая настройка с полностью предварительно настроенной средой тестирования, которая отлично подходит для тестирования компонентов Lit.

Lit — это стандартная современная библиотека JavaScript, и для тестирования кода Lit можно использовать практически любую платформу тестирования JavaScript. Среди популярных вариантов — Jest, Karma, Mocha, Jasmine и Web Test Runner.

Чтобы эффективно тестировать код Lit, необходимо убедиться, что ваша среда тестирования поддерживает несколько возможностей.

Компоненты Lit предназначены для работы в браузере, поэтому тестирование следует проводить в браузерной среде. Инструменты, ориентированные на тестирование кода Node, могут не подойти.

Используемая вами среда тестирования должна поддерживать современный JavaScript, в том числе модули с bare-спецификаторами модулей, либо соответствующим образом преобразовывать современный JavaScript в более старый синтаксис. Подробнее см. в документации «Требования для устаревших браузеров».

Для тестирования в старых браузерах среде тестирования потребуется загрузить несколько полифилов, включая полифилы веб-компонентов и модуль polyfill-support из Lit. Подробнее см. в документации «Полифилы».

Мы рекомендуем использовать Web Test Runner, поскольку он специально разработан для тестирования современных веб-библиотек, таких как Lit, с использованием современных веб-возможностей, например пользовательских элементов и shadow DOM. См. документацию «Начало работы» с Web Test Runner.

Чтобы поддерживать старые браузеры, настройте Web Test Runner следующим образом:

Установите @web/dev-server-legacy:

npm i @web/dev-server-legacy --save-dev

Настройте web-test-runner.config.js:

import { legacyPlugin } from '@web/dev-server-legacy';

export default {
  /* ... */
  plugins: [
    // make sure this plugin is always last
    legacyPlugin({
      polyfills: {
        webcomponents: true,
        // Inject lit's polyfill-support module into test files, which is required
        // for interfacing with the webcomponents polyfills
        custom: [
          {
            name: 'lit-polyfill-support',
            path: 'node_modules/lit/polyfill-support.js',
            test: "!('attachShadow' in Element.prototype)",
            module: false,
          },
        ],
      },
    }),
  ],
};

Изменить эту страницу