OrangeHRM Login Page Object

Login Page UI Screenshot

Use the developer tools to identify the web elements on the page.

Let’s identify the username web element on the login screen.

Launch the Web developer tools from the browser:

Inspect the username text field.

The web element attributes are displayed. To identify an element, we can use the NAME attribute of the username text field.

Login Page Object

Encapsulate the web page in a class.

from selenium.webdriver.common.by import By
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC

class LoginPage:
    """Page Object for the Login page"""
    
    def __init__(self, driver):
        self.driver = driver
        self.username_locator = (By.NAME, 'username')
        self.password_locator = (By.NAME, 'password')
        self.login_button_locator = (By.CLASS_NAME, 'oxd-button')
        
    def load(self):
        # Replace domain with actual
        self.driver.get("https://<domain>/hrm/web/index.php/auth/login")
        WebDriverWait(self.driver, 10).until(EC.presence_of_element_located(self.username_locator))
        
    def set_username(self, username):
        username_field = self.driver.find_element(*self.username_locator)
        username_field.clear()
        username_field.send_keys(username)
        
    def set_password(self, password):
        password_field = self.driver.find_element(*self.password_locator)
        password_field.clear()
        password_field.send_keys(password)
        
    def click_login_button(self):
        login_button = self.driver.find_element(*self.login_button_locator)
        login_button.click()
        
    def login(self, username, password):
        self.load()
        self.set_username(username)
        self.set_password(password)
        self.click_login_button()

Screenshot