Chapter 7: Testing

Automatically testing code is important when working on a codebase. It helps ensure we don’t introduce (too many) bugs or regressions. Let us see how to test our code.

The solutions for each exercise of the chapter are hosted on the official Flectra tutorials repository.

1. Integration testing

To make sure our application works as expected, we can perform integration testing by creating a tour: this is a sequence of steps that we can execute. Each step wait until some desired DOM state is reached, then performs an action. If, at some point, it is unable to go to the next step for a long time, the tour fails.

Let’s write a tour to ensure that it is possible to perform an tshirt order from our public route


  1. In the awesome_tshirt addon, add a /static/tests/tours folder.

  2. Add a /static/tests/tours/order_flow.js file.

  3. Add a tour that performs the following steps:

    1. Open the /awesome_tshirt/order route.

    2. Fill the order form.

    3. Validate it.

    4. Navigate to our webclient.

    5. Open the list view for the the t-shirt order.

    6. Check that our order can be found in the list.

  4. Run the tour manually.

  5. Add a Python test to run it programmatically.

  6. Run the tour from the terminal.

2. Unit testing a Component

It is also useful to test independently a component or a piece of code. QUnit tests are useful to quickly locate an issue.


  1. In the awesome_tshirt addon, add a static/tests/counter_tests.js file.

  2. Add a QUnit test that instantiates a counter, clicks on it, and makes sure it is incremented.