Testing an application is always a tricky task.
It’s technically difficult, and often means managing some tricky trade-offs:
- Should a testing regime be broad or deep?
- How much resource should be dedicated to testing versus development?
- Should you focus on new feature tests or regression tests?
- When should testing be manual versus automated?
There’s no one ‘best way’ to test a web application. Every project needs its own strategy, based on your priorities, experience and experiments.
In a previous post we talked about the testing tools we use at Cambridge Intelligence. In this post, I’ll try to give some generic tips to help you use them when testing your own web application.
(By the way, we recommend you focus your test resource on your own application, rather than the functionality in our APIs – we do that part for you!)
How to test a simple application
Here’s a simple application interface using KeyLines. It’s a network explorer with a description panel on the right-hand side. You can see that when a user clicks an element of the chart, presses a button, or moves an element, actions occur.
To test this UI, two approaches are needed:
- Integration testing – this tests how the modules in the app work together as a system – how they interact with each other and the surrounding software.
- End-to-end (E2E) testing – this tests software from a user perspective – from the database to the interface and back again – making sure the tool behaves as they would expect.
1. Understand your users
The first step, as with most software design, is to understand your users and their problems. Once you know who uses your software and what questions they will need to answer, you can define the actions they’re likely to take.
In the case of our application, we know our users will want to:
- open the application
- click on a node in the chart
- see node information in the right panel
- click the Layout button
- drag nodes around the chart
So these are some of the interface actions we know to check.
2. Choose your testing modules
No tester wants to check the same things over and over again in every possible browsers. Also, most testing tools are very good with back-end systems, but not great when it comes to UI testing.
Fortunately, a number of tools are available to automate browser testing for UIs. Some of our favorites are:
- Karma – this tool leverages your Mocha test suites to spawn different browsers simultaneously, feeding back reports in real-time.
- Selenium – is a suite of tools for automating browser tasks, including testing, to bring greater efficiency. Part of the project is WebDriver, a tool specifically for cross-browser testing.
- Protractor is an Angular end-to-end testing module for automatically opening an application and clicking through a defined workflow. It’s built on Selenium so it tests against all the popular browsers.
3. Run your tests
This depends on the tools you use and the app you’re testing, but the general workflow will be something like this:
In a word: asynchronicity.