Page Object Design Pattern
Explore how to use the Page Object Model design pattern to write maintainable and clear WebdriverIO test scripts for React applications. Understand the roles of base, home, feedback, and thank you page objects, and learn how to run automated tests that simulate real user interactions in UI workflows.
What is the Page Object Model?
The Page Object Model (POM) is a design pattern that helps to keep our tests maintainable and easy to understand. The general idea is that we encapsulate information about a page into an object. We can then use methods on that object to interact with the page rather than writing direct calls to WebdriverIO methods. The diagram below illustrates the pattern:
Let's explain the diagram above:
Base page: This page contains all the standard methods we want to share with any page.
Page object: These pages contain all the WebdriverIO selectors and methods to interact with elements on a particular page. Typically, we use the methods to perform ...