Тестируйте асинхронные наблюдаемые объекты, как если бы они были синхронными!

Если вы работали с Angular (2+), вы, должно быть, использовали Observables. Фактически, реализация Angular использует - RxJs плотно встроен в основы самого фреймворка для таких вещей, как Routing и Http.

Если вы хотите узнать больше о Observables и о том, как их использовать, вы можете обратиться к классному посту Джерарда Санса о RxJ ниже.



Angular - Введение в реактивные расширения (RxJS)
Как использовать наблюдаемые последовательности в AngularJS medium.com



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

Например, у нас может быть такой метод:

Здесь мы возвращаем плоский массив и намеренно задерживаем его на 500 мс.

Как мы собираемся это проверить?

Это сработает? Очевидно, что этого не произойдет, поскольку наш исполнитель тестов не будет знать, когда выполнять свои утверждения, и просто выйдет, до того, как пройдет задержка в 500 мс.

Чтобы решить эту проблему, мы можем просто использовать обратный вызов done и проинструктировать средство выполнения тестов, когда выполнять его утверждения, например:

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

Можем ли мы сделать это лучше?

Конечно можем, это Javascript, вы можете делать все, что угодно!

Я представляю вам простую вспомогательную функцию, которая получит поток (Observable) и skipTime. Он подписывается на наблюдаемый объект, присваивает его значение локальной переменной, пропускает время и возвращает значение.

Подождите, что? Вы не можете этого сделать!
Как jasmine.clock.tick() работает?



Он в основном имитирует основанные на времени API с помощью пользовательских функций, которые делают эти вызовы синхронными, а также позволяют «продвигаться» во времени на ticking.

Вам также нужно будет установить часы Jasmine перед каждым тестом и удалить их после, например:

Хорошо, но как мне это использовать?

Круто, да? Синхронный, линейный, легкий!

Вы можете увидеть больше вариантов использования в тестах ngx-cacheable здесь. Также, если вы не читали мою предыдущую статью о простом декораторе кеша, сделайте следующее:



P.S В последних версиях Angular вы также можете использовать fakeAsync + tick NgZone и получить тот же эффект. Однако, если вы используете Observables в проекте, отличном от Angular, вам не потребуются накладные расходы на zone.js в ваших тестах, но если вы тестируете приложение angular, возможно, это будет лучшим выбором.

Ищете удаленную работу во внешнем интерфейсе?
Получайте уведомления, когда она появится! Подпишитесь сейчас https://www.remotefrontendjobs.com/