RxJs / Ngrx TestSheduler с имитацией пользовательского ввода (Жасмин) - PullRequest
0 голосов
/ 30 мая 2018

Я тестирую эффекты магазина Ngrx в угловом приложении.Одним из моих эффектов, в качестве побочного эффекта, является модал, который всплывает с использованием материального компонента MatDialog.

Я хочу запустить тест, в котором эффект запускается действием, которое вызываетдиалог мата, чтобы появиться.Затем я хочу проверить, нажимая «да» или «нет», а затем приступить к проверке конечного действия (или его отсутствия).

Мы используем rxjs-marbles для тестирования нашего магазина.

RxJs не делаетПохоже, что у меня огромное количество примеров, но я понял, что мне нужно использовать TestScheduler для этого типа сценария.Я не уверен, как это работает, хотя.Я провожу много исследований и не достиг тонны прогресса.

По сути, как мрамор, это выглядит так:

-a-b-c

гдеa - это начальное действие, b - это щелчок пользователя в диалоговом окне, а c - это результат (c необязательно, если пользователь нажимает «нет», результирующее действие не будет)..

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

В принципе, как можно написать такой тест, где есть наблюдаемые потоки в сочетании с моделируемым пользовательским вводом с использованием шариков?

1 Ответ

0 голосов
/ 30 мая 2018

Итак, я понял, что поступил неправильно.Это юнит-тест, а не e2e-тест, поэтому мне не нужно тестировать определенные функции пользовательского интерфейса.Поэтому я пришел к следующему тесту:

it('should show a dialog, and do nothing if the user does not confirm',
      () => {
        const dialogRef = jasmine.createSpyObj('dialogRef', {
          afterClosed: of(false),
        });
        const action = new AppActions.PromptUserAction();
        matDialog.open.and.returnValue(dialogRef);

        actions = hot('a', { a: action });
        const expected = cold('', {});

        expect(effects.promptUserAction$).toBeObservable(expected);
        expect(matDialog.open).toHaveBeenCalled();
        expect(dialogRef.afterClosed).toHaveBeenCalled();
      });

В Объяснение:

  • Создать dialogRef, который будет возвращен поддельной службой MatDialog (выполняется в beforeEach).Установка Angular TestBed, созданная путем предоставления шпионского объекта следующим образом:

    {
      provide: MatDialog,
      useValue: jasmine.createSpyObj(
        'MatDialog',
        ['open'],
      ),
    },
    
  • Это заглушает метод open, и вы заметите, что вызов open выполняется для returnValue dialogRef, которыйзатем мы можем использовать его в качестве шпиона, чтобы вернуть желаемое наблюдаемое. Довольно просто, на самом деле.

Остальная часть теста была простой. Надеюсь, это кому-то поможет - вам не обязательно нуженимитировать щелчок, поскольку он неявный в потоке!

...