Сбой углового теста из-за вызова query () в анимации

Question

У меня есть компонент ввода, который содержит как форму входа, так и форму регистрации (каждый из них является собственным компонентом).Компонент entry содержит переменную, указывающую, показывать ли компонент входа или регистрации, и это переключается с использованием элемента в шаблоне.

Когда эта переменная переключается, контейнер, который оборачивает дочерние компоненты, анимируется при его изменении.from login => register (или наоборот).

Когда я щелкаю этот элемент, чтобы переключиться на форму регистра в модульном тесте, тест не проходит, так как мне нужно вызвать fixture.detectChanges() после нажатия на переключательДля того, чтобы затем взаимодействовать с экземпляром формы регистра.Этот вызов fixture.detectChanges() приводит к следующей ошибке.

Error: Unable to process animations due to the following failed trigger transitions @entryModeTransition has failed due to: 

- `query("app-login-form > form")` returned zero elements. (Use `query("app-login-form > form", { optional: true })` if you wish to allow this.)

Существует также вызов fixture.detectChanges() в блоке beforeEach ().

Я удостоверился, что включил NoopAnimationsModule в тестовую настройку, однако это, похоже, не препятствует запуску анимации (что, как я думал, NoopAnimationsModule подойдет).

Я мог бы просто добавить опцию { optional: true } к вызовам query() в определении анимации, однако мне не нравится идея добавлять это в анимации, когда они присутствуют только для предотвращения неудачи тестов.

Если это уместно, компоненты формы входа в систему и регистрации смоделированы с использованием ng-mocks.

Можно ли как-то предотвратить анимацию, запущенную в модульных тестах?

Answer 1

В случае, если кто-то еще столкнется с этой проблемой, я в итоге обошел ее, переопределив анимацию при сборке компонента в настройках спецификации.

Таким образом, я все еще могу высмеивать дочерние компоненты, как это было на протяжении всего существующеготесты, и не нужно корректировать определение анимации.

Переопределение было сделано путем установки мета-опции animations для массива, содержащего пустое определение триггера с тем же именем, что и анимация, вызывающая ошибку.

beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [EntryComponent, MockComponents(LoginFormComponent, RegisterFormComponent)],
      imports: [NoopAnimationsModule, ...other imports omitted],
      providers: [...providers omitted]
    })
      .overrideComponent(EntryComponent, {
        set: {
          animations: [trigger('entryModeTransition', [])]
        }
      })
      .compileComponents();
  }));

Создание пустого триггера может быть даже перемещено в служебную функцию, если этот обходной путь необходим для многих тестов, которые могут привести в порядок переопределения:

.overrideComponent(EntryComponent, {
  set: {
    animations: mockAnimations(['entryFormTransition, 'someOtherTransition'])
  }
})