Case Study pt.2: Implementing Redux on Angular

Introduction

This is the second part of a series of articles about a case study for a web app implemented using Redux and Angular. The project follows the architecture depicted on a previous article, but reading that article before this one is not necessary.

For easy referencing, here are the articles in the series :

This project’s web app is an online test (or quiz) which, although functional, is simplified as it only serves as subject for this case study. The project is complete on my repository and these articles focus on the implementation of the business logic using Redux on an Angular web app.

A snapshot of the web app implemented for this series of articles.
Source code on my GitHub repository.
[…]


Read the full article.

Case Study pt.1: Planning business logic using Redux

Introduction

This is the first part of a series of articles about a case study for a web app implemented using Redux and Angular. In this article, there is no dependency on Angular, it applies wherever you find Redux. The project follows the architecture depicted on a previous article, but reading that article before this one is not necessary.

For easy referencing, here are the other articles in the series :

This project’s web app is an online test (or quiz) which, although functional, is simplified as it only serves as subject for this case study:

  • Read the exam data from a server
  • Allow single and multi-option answers, no open/text answers
  • Time the examination using a server side timer
  • Allow the user to finish the exam earlier
  • Evaluate answers at the end and give result
  • Mock the server on the client side, including exam data.

[…]


Read the full article.

Testing observable’s values when using Angular fakeAsync

The problem

I’ve found two main approaches when unit testing observables behavior in javascript:

  • the marbles testing framework for comparing an observable to a mocked observable
  • checking the observable directly controlling time with the Zone.js fakeAsync(). Check this great article from Victor Savkin about fakeAsync().

The Zone.js fakeAsync() intercepts the asynchronous javascript features allowing for control of time. So, observables need no modification and, by default, they use the default scheduler and not the TestScheduler required by the marbles testing framework. While it is possible to make observables to use a provided scheduler, it is somewhat cumbersome and I had a lot of problemas with that route. So I decided to test the observables directly.

Also, there were this problem with the marbles testing framework. For testing an operator is awesome and very simple, but it is not adequate to test a real observable with its timely value emissions because the comparison to a mocked observable also takes into account the time when values are emitted.
[…]


Read the full article.