Включить статический HTML-файл с приложением Angular CLI только в тесты e2e - PullRequest
Новая
       33

Включить статический HTML-файл с приложением Angular CLI только в тесты e2e

0 голосов
/ 24 июня 2019

Я хочу иметь один конкретный статический (не Angular) HTML-файл, который создается и обслуживается только при выполнении моих тестов e2e в приложении Angular CLI. В производственном приложении этот статический файл не должен быть доступен.

Я пытаюсь заставить это работать в минимальном воспроизведении, но не вижу, как я могу это сделать. Я начал с создания приложения ng new (Angular CLI 7.3.9) со всеми настройками по умолчанию. Затем я сделал это:

  1. Добавьте "src/production-static-page.html", к "assets" в моем angular.json файле под основной записью projects.
  2. Создал этот файл с <p id="foo">bar</p> в качестве содержимого.

  3. Расширено испытание e2e лесов с помощью этого: 

    it('can navigate to e2e-only html', () => {
  browser.waitForAngularEnabled(false);
  browser.get('/e2e-only-static-page.html');
  const text = element(by.css('#foo')).getText();
  expect(text).toEqual('bar');
  browser.waitForAngularEnabled(true);
});

И это просто работает, потому что этот HTML-файл является обычным рабочим файлом, который, таким образом, также доступен при развертывании моего приложения в рабочей среде.

Я не вижу, как настроить проект "foo-bar-e2e" в файле angular.json таким образом, чтобы другой html-файл (скажем, e2e-only-static-page.html) подавался только для тестов e2e?

1 Ответ

0 голосов
/ 25 июня 2019

Я нашел способ.Это не очень удобно, поскольку , кажется, нет повторного использования конфигов в angular.json , но это работает.

Шаги в angular.json:

  1. Дублируйте раздел "build", назовите его "build-e2e"
  2. Включите в эту сборку только ваш e2e-актив
  3. Дублируйте раздел "serve", назовите его "serve-e2e"
  4. Переконфигурируйте этот раздел, чтобы использовать "browserTarget": "my-project:build-e2e"
  5. Изменить "my-project-e2e"> "architect"> "e2e"> "configurations"> "production"> "devServerTarget" на "my-project:serve-e2e:production" (элемент, который вы создали вшаги 3 и 4.
  6. Измените "my-project-e2e"> "architect"> "e2e"> "options"> "devServerTarget" на "my-project:serve-e2e" (элемент, созданный на шагах 3 и 4.

И готово! Теперь ng e2e имеет доступ к этому html-файлу, тогда как ng serve и производственные сборки - нет.

...