It has been a long time since web applications consisted of mainly static HTML. Most modern web applications have huge amounts of JavaScript that modify the DOM on the client (in the browser). Automating such applications requires an additional level of awareness on the part of the developer authoring the tests. JavaScript in the DOM is not synchronous; event handlers are used to alter and modify the page as it loads and as users interact with it, and as such, our tests need to be robust enough to handle this asynchronous behavior.
Thankfully, Capybara was built with this principle at its core, so that makes things pretty easy for us. In this chapter, we will work through examples that demonstrate this.
We will also consider elements on the page that appear at first sight to be impossible to automate, such as flash components or HTML5 elements, for example, the canvas
tag.