Verify website compatibility on different browsers

Preconditions (2)

Step 1: Open Chrome browser

Step 2: Navigate to the test website URL

Step 3: Verify the homepage loads without layout issues

Step 4: Open Firefox browser

Step 5: Navigate to the test website URL

Step 6: Verify the homepage loads without layout issues

Step 7: Open Edge browser

Step 8: Navigate to the test website URL

Step 9: Verify the homepage loads without layout issues

✅ Expected Result: The homepage should load correctly on Chrome, Firefox, and Edge without layout or functional issues

Automation Requirements - Selenium WebDriver with Python

Assertions Needed:

Page title contains expected text

Key page elements are visible and correctly displayed

Best Practices:

Use explicit waits to wait for elements

Use browser driver management for different browsers

Use Page Object Model to organize locators and actions

Automated Solution

Testing Fundamentals

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

class HomePage:
    def __init__(self, driver):
        self.driver = driver
        self.logo_locator = (By.ID, 'site-logo')
        self.main_heading_locator = (By.TAG_NAME, 'h1')

    def is_logo_visible(self):
        return WebDriverWait(self.driver, 10).until(
            EC.visibility_of_element_located(self.logo_locator)
        )

    def get_main_heading_text(self):
        heading = WebDriverWait(self.driver, 10).until(
            EC.visibility_of_element_located(self.main_heading_locator)
        )
        return heading.text


def test_website_compatibility():
    url = 'https://example.com'
    browsers = ['chrome', 'firefox', 'edge']
    expected_title_keyword = 'Example Domain'

    for browser_name in browsers:
        if browser_name == 'chrome':
            driver = webdriver.Chrome()
        elif browser_name == 'firefox':
            driver = webdriver.Firefox()
        elif browser_name == 'edge':
            driver = webdriver.Edge()
        else:
            continue

        try:
            driver.get(url)

            # Assert page title contains expected keyword
            assert expected_title_keyword in driver.title, f"Title check failed on {browser_name}"

            home_page = HomePage(driver)

            # Assert logo is visible
            assert home_page.is_logo_visible(), f"Logo not visible on {browser_name}"

            # Assert main heading text is correct
            heading_text = home_page.get_main_heading_text()
            assert heading_text == 'Example Domain', f"Heading text mismatch on {browser_name}"

            print(f"Compatibility test passed on {browser_name}")

        finally:
            driver.quit()

if __name__ == '__main__':
    test_website_compatibility()

This script tests the website on Chrome, Firefox, and Edge browsers.

We use Selenium WebDriver to open each browser and navigate to the URL.

The HomePage class uses the Page Object Model to keep locators and actions organized.

Explicit waits ensure elements like the logo and heading are visible before checking.

Assertions check the page title and key elements to confirm the page loaded correctly.

Finally, the browser closes after each test to keep the environment clean.

Common Mistakes - 4 Pitfalls

Using implicit waits instead of explicit waits

Hardcoding browser driver paths

Not closing the browser after each test

Using brittle locators like absolute XPaths

Bonus Challenge

Now add data-driven testing with 3 different URLs to verify compatibility across multiple sites.

Show Hint