Использование транспортира с ng-upgrade

Я работаю над переносом моего приложения AngularJS (1.6) на Angular (4), и теперь у меня есть гибридное приложение, загружаемое с помощью NgUpgrade.

Однако это, похоже, полностью нарушило мои тесты транспортира.

Ошибка: время ожидания завершения асинхронных задач Angular истекло через 11 секунд. Это может быть связано с тем, что текущая страница не является приложением Angular. Дополнительные сведения см. В разделе часто задаваемых вопросов: https://github.com/angular/protractor/blob/master/docs/timeouts.md#waiting-for-angular

В ожидании элемента с локатором - Локатор: По (селектор css, .toggle-summary-button)

Изменения в гибридном приложении

Приложение работает нормально, и компоненты AngularJS и Angular работают должным образом. В процессе начальной загрузки я внес следующие изменения:

1 Удалено ng-app из тега html:

<html lang="en" *ng-app="myapp">

2 Добавлены модули приложений (@NgModule) и т. Д.

3 Использовал NgUpgrade для начальной загрузки приложения:

import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';

import { UpgradeModule } from '@angular/upgrade/static';
import { AppModule } from './app.module';

platformBrowserDynamic().bootstrapModule(AppModule).then(platformRef => {
  const upgrade = platformRef.injector.get(UpgradeModule) as UpgradeModule;
  upgrade.bootstrap(document.body, ['myapp'], {strictDi: true});
});

Тесты транспортира

Исходя из указанной выше ошибки, проблема, похоже, связана с тем, что делает Protractor, когда ожидает Angular. У меня есть блок beforeEach, который загружает страницу входа, заполняет данные и входит в систему. Как ни странно, он все еще открывает страницу и вводит текст в поле имени пользователя, но затем не может идти дальше.

Я не могу понять, почему здесь все по-другому, и никакие изменения вокруг не помогают, поэтому любое руководство будет очень кстати!

Я безуспешно пробовал:

  • добавление rootElement: 'body' в мой конфигурационный файл транспортира
  • добавление ng12Hybrid: true в мой конфигурационный файл транспортира - я получаю сообщение о том, что он больше не нужен, поскольку он автоматически определяет.
  • увеличив значение параметра allScriptsTimeout с 11000 до 60000, время ожидания по-прежнему истекает.
  • отключение настройки waitForAngularEnabled. Это решает проблему с полями входа в систему, но тогда ни один из моих HTTP-макетов не работает, и тесты терпят неудачу.

person Matt Wilson    schedule 16.05.2017    source источник
comment
Также обсуждаем эту проблему на github.com/angular/protractor/issues/   -  person Matt Wilson    schedule 17.05.2017
comment
Не то чтобы это решение проблемы транспортира, но для тех, кто читает это и имеет возможность переключиться на другой инструмент, я настоятельно рекомендую cypress.io. В итоге я заменил Protractor на Cypress из-за проблем в этом посте, и это здорово!   -  person Matt Wilson    schedule 01.12.2017


Ответы (2)


Что забавно, я задал тот же вопрос (+ github) 15 месяцев назад о angular 1 к angular 2:

Транспортир + гибридное приложение Angular 1 + 2 = сбой

Без какого-либо решения я откатился к angular 1. Сегодня мы решили снова попробовать перейти с angular 1 на 4, как вы, и остановились на вашем вопросе, потому что у нас все еще есть та же проблема ...

Ну, на самом деле не так уж и смешно ... Я не могу понять, почему такая важная функция так отделена. Предполагалось, что AngularJs будет активно поддерживаться из-за критического изменения Angular 2+! Это немного разочаровывает (извините за тех, кто ожидает реального ответа, опубликую, если обновления) ...

Изменить: я перешел на React

person Sebastien Horin    schedule 04.06.2017
comment
Здравствуйте, мы также недавно пытались обновить Angular1 до 5 и столкнулись с той же проблемой. Я искал повсюду в Интернете, и, похоже, никто не нашел эту работу. Есть ли у вас новости по этому поводу? - person Zhenyi Zhang; 26.01.2018
comment
@ZhenyiZhang Мое приложение теперь гибридное Angular.js / React.js вместо Angular 2 - person Sebastien Horin; 26.01.2018
comment
Большое спасибо за ваш ответ. Немного побоюсь с NgUpgrade. Это так неприятно, что он не работает с транспортиром ... - person Zhenyi Zhang; 26.01.2018
comment
Есть такая же проблема в 2019 году, при обновлении с 1.7 до 8.2 и все тесты не работают - person Lunin Roman; 07.08.2019

Я придумал временный прием, чтобы решить эту проблему, переопределив функцию waitForAngular с помощью приведенной ниже логики.

onPrepare: function() {
            
            var script = "var callback = arguments[arguments.length - 1];" +
                "angular.element(document.querySelector(\"body\")).injector()"+
                ".get(\"$browser\").notifyWhenNoOutstandingRequests(callback)");

            browser.waitForAngular = function() {
                return browser.executeAsyncScript(script)
            };
}
person Sudharsan Selvaraj    schedule 06.07.2020