Development Book V18: Client-Side Test Cases

In Odoo, client-side test cases may be run straight from the user interface. By running the case through the user interface, you can see how each test case step acts. In this way, you can be sure that your UI test cases work as intended.

The user interface may be used to execute both QUnit and Tours test cases. Python test cases cannot be executed from the user interface; they operate server-side. To view the choices for executing test cases via the user interface, developer mode needs to be activated.

Odoo 18 – What’s Improved in Test Cases

  • Developer Mode with Test Assets: Odoo 18 offers a dedicated debug mode that also loads test suites (?debug=tests), making JS test execution smoother.
  • QUnit Suite at /web/tests: Run all JS tests in a browser-friendly format; includes filtering, rerun, and robust logging.
  • Tour Execution UX: The “Start Tour” dialog continues to work, enhanced with better test asset loading and documentation.
  • Test Infrastructure Improvements:Standard routes, improved asset bundling (web.qunit_suite, web.tests_assets, web.qunit_suite_tests).

Headless Chrome and test execution in CI including videos/screenshots upon failures.

Executing QUnit test cases from the user interface

1. Activating Tests

  • Enable Developer Mode with test assets (?debug=tests) or via Settings → Developer Tools.

2. Running QUnit Tests

  • Navigate to the bug icon → Run JS Tests or directly visit /web/tests to view all browser-side tests.
  • The interface allows filtering, rerunning tests, and viewing results in-browser.
odoo-development

Odoo 18 – What’s Improved in Tour Cases

Odoo 18 introduces a significantly improved system for creating, managing, and executing UI tours. Below is a summary of the key enhancements and how to use them effectively.

  • Tour Recorder: A built-in tool that allows you to record your actions within the Odoo interface to automatically generate tour scripts. Recorded tours are marked as Custom.
  • Improved UI: A redesigned interface for managing onboarding and testing tours, making navigation and tour control more intuitive.
  • Enable/Disable Tours: Users can now toggle onboarding tours directly from the user menu for more control over their UI experience.

Types of Tours

Onboarding Tours:

These tours guide users interactively through Odoo features, waiting for user input at each step. Onboarding tours can be launched sequentially from the user menu.

Testing Tours:

These are automated UI tests that execute a predefined set of actions to validate functionality without manual input.

Creating a Tour

1. Tour Files Structure:

  • XML: your_module/data/your_tour.xml
  • JavaScript: your_module/static/src/js/tours/your_tour.js
  • Update __manifest__.py to include both the XML and JS files under data and assets.

2. Using the Tour Recorder:

  • Navigate to the onboarding tours screen and click “Record” to begin capturing UI interactions.

3. Defining Tour Steps in JavaScript:

  • Each step should include a trigger (the element to act upon) and may include an action (click, text, etc.).
  • Additional options include step messages (content), pause, and breakpoints.

Running Tours

1. Via the UI:

Go to Settings → Technical → User Interface → Tours. You can run tours in:

  • Onboarding Mode: Interactive, waits for user input.
  • Testing Mode: Automatic, simulates user interaction end-to-end.

From Python Tests:

Inherit from HttpCase and use start_tour() to initiate the tour from a server-side test.

From the Browser Console:

  • Enable test mode by appending ?debug=tests to your URL.
  • Run a tour with:
odoo.startTour("your_tour_name");

Debugging Tools for Tours

  • Breakpoints:

    Add break: true to any tour step to halt execution and enter the debugger.

  • Pause:

    Use pause: true to temporarily stop the tour and allow user interaction. Resume it by typing play(); in the console.

  • Manual Debug:

    Add a run() function like so:

                         run() { debugger; }
whatsapp_icon
location

Calicut

Cybrosys Technologies Pvt. Ltd.
Neospace, Kinfra Techno Park
Kakkancherry, Calicut
Kerala, India - 673635

location

Kochi

Cybrosys Technologies Pvt. Ltd.
1st Floor, Thapasya Building,
Infopark, Kakkanad,
Kochi, India - 682030.

location

Bangalore

Cybrosys Techno Solutions
The Estate, 8th Floor,
Dickenson Road,
Bangalore, India - 560042

Send Us A Message