Page Object Models using WebDriverIO is fully supported by the Vitaq AI Test Automation Tool. Whether you are creating your Page Object Models from scratch in Vitaq or simply copying them from an already created Mocha (or other) Test Framework is quite simple.

Before diving into implementing Page Object Models, let’s discuss about their benefits in brief :-

Page Object Model, short hand POM, is a design pattern which nowadays has become very popular with QA and dev testers skilled in the art of test automation because of its characteristics which help in reducing code duplication over and over again and also helps in test maintainability.

Advantages of using Page Object Model (POM) :-

1) Actionable Code becomes much cleaner and readable as operational code i.e., Locators, Functions, and Methods is all present in one place which is the page object files.

2) Less Optimization of Code is needed because of reusable functions/methods present in page object files.

3) Functions or methods can be written in a more sensible way through which the meaning of that function i.e. what action it is going to perform can be understood. E.g. If we want to add an item on our shopping cart we can do so by creating a function/method named as clickOnAddToCart();

Let’s find out how we can implement the Page Object Model using WebDriverIO in the Vitaq AI Test Automation Tool and compare this to what you probably already know, which how you use them in Mocha:-

We will demonstrate a scenario where we will be searching an item say T-shirt on the sample e-commerce website i.e.,http://www.automationpractice.com/, and then carry out the checkout process for the guest user.

1) To Navigate to www.AutomationPractice.com. we keep our base url in the config file while using traditional webdriverio Mocha setup.

We can simply copy this Navigation or Base URL in Const Variable Config of Mocha, over to our JavaScript Functions File in Vitaq.

2) Now what we need is locators and functions before performing our desired test operations. For that, we create pages where we keep them separately. In the example below we are performing a search for an item in the e-commerce site and adding it to the shopping cart. So intuitively we name our page as AutomationPracticeSearch_Page.js

Likewise, we can pick relative locators and functions/methods and put them in JavaScript Functions present in VitaqAI Test Automation Tool as shown below:-

3) Now we have all the locators and creation of function/methods which are using all these locators completed we need to write the code to perform our required test actions. In Mocha (and other conventional test Frameworks) we create our test files by write our test code in the way as shown below :-

To re-use this Mocha code we can simply copy this code into our Vitaq Test Action scripts. As an example, here we perform the above actionable functions/methods from Mocha by copying itinto our VitaqAI Test Automation Tool through Test Actions present in Test Activity Diagram shown below:-

So you can see that it is very simple to re-use your Mocha (or other conventaional Test Framework) code by copying it across or if working on a new project implement your page object model (POM) using WebDriverIO in VitaqAI Test Automation Tool directly? You get the benefits of quickly making your test Automation framework AI-driven, data-driven and highly variable to reach 100% QA test coverage in the shortest possible time by letting the power of your computer auto-generate continuous exploratory tests and find defects that other a