Tabris.js – How to write unit tests

In this blog post, you’ll learn how to write unit tests for your Tabris.js application. To do that, you need a special setup to run your code without a native client because Tabris.js requires an Android or iOS device to run your application, and the native client is not available on your development machine. Fortunately, the native client can be mocked out so that your tests can run in Node.js without a mobile device. The client mock is pre-configured in the test setup of apps generated by tabris-init; you can achieve that either by running tabris init to start a new application (make sure the option Set up unit tests with Mocha is selected currently, available only for TypeScript projects): –

or you can have your setup similar to the sandbox.ts file in the test folder to create a test environment. You need to install the following necessary modules manually:
mocha – unit testing framework for Node.js.
sinon – spies, stubs and mocks for JavaScript.
chai – assertion library.
sinon-chai – Sinon.JS Assertions for Chai.

Now with your test environment set up, Tabris.js provides a submodule called ClientMock. This module creates an environment that lets you interact with all components programmatically without a native client. See the docs for more details.

Let’s say that we have the following MyComponent.tsx file:

That creates a Button and TextView component and changes the text value of the TextView component when the button is tapped. Now we want to test that the correct text will be used when the button is tapped. For that we have the following MyComponent.test.ts file to test the component:

then we can execute the tests with the following command:

If you have already initialized your application with the tabris init command you can instead use the npm run test command. Once the texts are executed, you should get the following result:

So, this means a unit test is successfully executed without a native client! This example application with the unit test is available here. It is a slightly modified one of the Tabris.js template applications.

Let us know your thoughts!