You learned that we can prevent maintainability problems in our UI tests with the Page Object pattern: an object that offers a logic and structured view of our UI and hides details about the specific low-level HTML structure. This way, aesthetic changes in the design of the UI can be easily absorbed by our tests, since we do not need to inspect all the tests to make the corresponding changes, only the page object.

Making a page object is not a difficult task; we just need to be a bit careful with its design. A page object should use meaningful names in its methods and stay at the level of abstraction of the UI logical structure, not the raw DOM. You should also try to hide WebDriver from the tests, but do not overdo it. Good examples of this are the typeText and pressKey methods. Do not couple your page object with the specific framework you are using to implement your passive view, such as React or AngularJS.

Modern web pages are usually composed of several reusable UI building blocks...