Implement Page Object pattern

Pre-Requisites

So at this point, the context we would have before going with implementation is that we have read and got at least a fair idea on each of the following.

  1. What is page-object
  2. What is base page object
  3. Modeling web pages into page-objects
  4. Page navigation (its dependency on page-object modeling)
  5. Road map and Future State (yes we need to align with this road map)
  6. Data-driven framework
  7. Keyword driven framework

Implement Workflow with page-object:

We will be implementing this workflow on automationpractice website. In a nutshell, we will be automating a shopping cart workflow, from sign in to purchase.

workflow

Generic Base Page:

Since all web pages have some commonalities, lets define that in a Generic Base Page. We create this under ‘lib/pages/generic_base_page.rb’

element:

Instead of declaring a method for every html element in a page-object (as we did before), let’s have a very generic way to define an element. The below method constructs the method once we specify the element and locate it in the page-object. This will be more clearer once we look at the page-objects. The method_missing addresses that part. Scroll below.

initialize:

The __init__ method takes the context object that behave uses for context transfers between scopes and we pass that to every page object. For now, we are using only the object context.browser in the page objects. If need be, we can use other objects that get set in the context

Automation Home Page:

The sign_out link would appear after logging in, however we associate this element to the home page itself. We create this under ‘lib/pages/automation_home_page.rb’

automation_home_page

Login Page:

We create this under ‘lib/pages/login_page.py’

login_page

Let’s write behave scenario

With the above two page-objects i.e. AutomationHomePage and LoginPage, let’s write a very simple cucumber scenario before we start building out the entire workflow. MVP, thin slice, whatever we call in Agile world right 😉

Overall Project structure:

The overall project structure should look like this now:

The files we should be interested in at this point are:

  1. login.feature (the above behave code)
  2. shopping_cart.py (step_definitions)
  3. automation_home_page.py (home page-object)
  4. generic_base_page.py (generic page-object)
  5. login_page.py (login page-object)

page_object_login_feature

 

Let’s Execute:

From PyCharm:

Right click on the page and click Run as shown in the below picture

execute_login_feature

The output should be like this. The scenario should pass

login_scenario_pass

 

From Command line:

login_scenario_pass_cmd

 

Take a Break:

Guys, if you have reached this point and see the same output as is displayed on this page, pat yourself on the back. We have pretty touched all the points on a Hybrid framework here.

It is a thin slice we have built all the way end-end. We will cover more scenarios and build the entire shopping cart experience. Below is a video of the execution

Project Code base:

The entire project code base is on my github: Python Page Object

If you like the code, please follow and star it.

Next:

Lets continue the workflow of selecting a product, checking out and so on, until we purchase it right.

page-object pattern - login scenario