Testing

End To End Testing

We want to provide automated end-to-end tests which simulate a user going through all common system workflows, and ensuring that the system shows the correct results.

Why?

To have a focus on usability and to make sure that the overall flow of our application makes sense.

Actual recording of our automated tests

Going through each and every workflow of the application not only ensures the correctness of our application but also allows us to focus on optimising user experience.

Examples

e2e A list of all the many end to end tests we carried out

An example of a workflow is that a user may log in and attempt to upload a file which isn’t in the required .vf format. We have a test to simulate that behaviour and make sure if a user follows that workflow, they are shown an unsupported diagram error message.

Implementation

To create these end to end tests, we made use of an Electron framework called Spectron. Spectron allows us to run our tests natively within the Electron environment and bridges the test suite to our application.

Within Spectron we used WebdriverIO as our automation engine that interacts with the elements in our application, sending inputs such as clicks and keystrokes. With this, we could test our application in the same way a user would interact with it. For our testing framework, we used mocha to describe our test suites and make assertions for what we expected on each page after certain inputs/events.

it('Attempt to upload unsupported format', async function() {
    await app.client.$('[type="file"]').then(fileInp => fileInp.setValue(CONFIG.unsupported_filePath))
    await app.client.$('button=UPLOAD').then(btn => btn.click())
    await app.client.pause(500)
    errorIsDisplayed = (await app.client.$('Unexpected Error')).isDisplayed()
    await app.client.$('button=DISMISS').then(btn => btn.click())

    return errorIsDisplayed
})

In the example above, you can see how we simulate a user by automating a file upload which is achieved via WebdriverIO.