When doing testing during the development process, there are three main types of test that we need to ensure.
- Unit Tests – Write small test cases to test small pieces of code without external dependencies.
- Integration Tests – After Unit Tests done to each individual module, this type of test is to test the integration of multiple modules.
- UI Tests / End-To-End (E2E) Tests – A special Integration Test that allows you to test the User Interface of your app through a browser and in this way it can also cover the backend.
Check Google’s recommendations to E2E tests.
Table of Contents
Unit Testing Frameworks
Check this post for more info – Jasmine vs. Mocha, Chai, and Sinon.
In IonicBoilerplate, it uses Mocha, Chai, and Sinon as the base testing framework. On top of that, Karma is used to help test AngularJS.
E2E Testing Frameworks
Reference: Protractor vs. Selenium: Which is Easier?
Test Files Arrangement
In IonicBoilerplate, the app modules are arranged based on functionality. So that, the test files are separated into each individual modules. In the
tests folder of project root, there are only the config files.
The code structure is like this:
│ ├── tests │ ├── karma.conf.js │ └── protractor.conf.js ├── www │ ├── ... │ ├── js │ │ ├── account │ │ │ ├── templates │ │ │ │ └── ... │ │ │ └── ... │ │ ├── chats │ │ │ ├── templates │ │ │ │ └── ... │ │ │ ├── tests │ │ │ │ ├── chats.factory.unit.js │ │ │ │ └── chats.spec.js │ │ │ └── ... │ │ ├── common │ │ │ └── ... │ │ ├── dash │ │ │ └── ... │ │ └── ... │ └── ... └── ...
For unit test file, it has a part
.unit. in the filename and e2e test file has a
.spec. in it.
By now, we already have a quite decent env. to help the development, such as:
- A well structured app code folder for conducting modularization on AngularJS by Browserify. Every time when a new file for Angular elements is added, it will automatically register into the Angular module.
- A folder-based Gulp tasks management system facilitates the Gulp task building and management.
- A Gulp based testing system is for both Unit Test and E2E Test.
However, the whole process that Gulp mainly supports still has some parts that can be improved to make the development process even smoother, such as:
- Simplify Terminal interface (CLI). Do not need to use both
- Enable the project code structure to accommodate different development and building environments, like dev, staging, testing, prod, etc.
- Aim for more streamline product building system, especially for auto-versioning.
- Make the development process CI(Continuous Integration)-friendly and CD(Continuous Deployment)-Driendly.
To tackle these, in the next chapter, we will introduce Gulp Flow – the streamline application development process.