Testing with a headless browser

So far we learned how to test our code. We can write a module, class, or library, and if it has an API, we can test it. However, if we need to test a user interface, it gets a little bit complex. Frameworks such as Jasmine and Mocha can run the code we write but can't visit a page, click a button, or send a form; at least, not alone. For such testing, we need to use a headless browser. A headless browser is a web browser without a user interface. There is a way to control it programmatically and perform actions such as accessing DOM elements, clicking on links, and filling forms. We are able to do the same things as we use a real browser. This gives us a really nice instrument to test the user interface. In the next few pages, we will see how to use a headless browser.

Writing the subject of our test

In order to explore the possibilities of such testing, we need a simple site. Let's create two pages. The first one will contain an input field and a button. The...