Automating web page interaction with selenium

Key takeaways:

  • Selenium is a powerful tool for automating web interactions, allowing developers to simulate user behavior on web pages.

  • Installation of selenium webdriver and chromedriver, typically done via npm.

  • Webdriver is used to create a chrome webdriver instance to navigate pages, interact with elements, and retrieve text (e.g., from <h1> tags).

  • Supports user actions (clicks, form submissions), alert handling, and content verification to streamline testing processes.

Selenium is a powerful tool for automating web interactions, allowing developers and testers to simulate user behavior on web pages. In this Answer, we’ll walk through the process of automating web page interactions using selenium with chrome webdriver.

Setting up selenium with chrome webdriver

To get started, you’ll need to install selenium webdriver and chromedriver. Here’s how to do it:

  1. Install selenium webdriver: You can install selenium Webdriver using npm (node package manager) by running the following command:

npm install selenium-webdriver

  1. Install chromedriver: Chromedriver is a webdriver implementation for chrome. You can download the appropriate chromedriver version for your chrome browser from the official websitehttps://sites.google.com/a/chromium.org/chromedriver/downloads or install it using npm:

npm install chromedriver

Creating a chrome webdriver instance

Once you have selenium webdriver and chromeDriver installed, you can create a webdriver instance for chrome.

const {By,Key,Builder} = require("selenium-webdriver");
const chrome = require('selenium-webdriver/chrome');
require("chromedriver");

async function example(){

       const options = new chrome.Options();
        options.addArguments('--no-sandbox');

        const driver = new Builder()
        .forBrowser('chrome')
        .setChromeOptions(options)
        .build();
 
        await driver.get("https://educative.io");
            
        const element = await driver.findElement(By.tagName("h1"));
        const text = await element.getText();
        console.log("Element text:", text);

        await driver.quit();
 
}
 
example()
Running a basic test written in JavaScript

  • Line 8: This line creates a chrome options object, which will be used to configure how the chrome browser behaves.

  • Lines 11–14: We initialize a new instance of the selenium webdriver, configuring it to use chrome with the specified options.

  • Line 20: We navigate the webdriver to the "https://educative.io" url.

  • Line 23: We find the HTML element with the name tag "h1".

  • Line 27: We retrieve the text of the h1 element present on web page using the function getText and store it in the text variable.

  • Line 30: We safely quit the webdriver, closing the browser session.

After running the above code, the chrome browser will be launched in the background and display the h1 text in the terminal.

Interacting with web elements

With the webdriver instance set up, you can interact with various web elements on the page using selenium’s methods.

Performing actions

Selenium webdriver allows you to perform common user actions such as clicking buttons and submitting forms:

await driver.findElement(By.className("icon-default")).click();

Handling alerts and pop-ups

You can handle JavaScript alerts and other pop-ups using selenium’s switchTo().alert() method:

const alert = await driver.switchTo().alert();
await alert.accept(); // To accept the alert

Verifying page content

You can verify page content by asserting the text of specific elements or checking for the presence of certain elements:

const element = await driver.findElement(By.id("elementId"));
const text = await element.getText();
console.log("Element text:", text);

Conclusion

By following these steps, we can automate web page interactions using selenium with chrome webdriver. This allows us to streamline testing processes and simulate user behavior efficiently.

Ready to elevate your testing skills?

Join our mastering selenium path today! Dive deep into browser automation and functional testing across modern web browsers. With hands-on experience in react, node.js, and java, you’ll design your own testing framework and tackle multiple test cases.

Frequently asked questions

Haven’t found what you were looking for? Contact Us

Is selenium a tool or framework?

Selenium is a tool that can be used as part of a testing framework for automating web interactions.

Which is the fastest browser for selenium?

The fastest browser for selenium often depends on various factors, including the specific use case, system configuration, and the version of the browser and webdriver. However, chrome is generally considered one of the fastest browsers for selenium automation due to its speed and extensive support for webdriver.

Can a non coder learn selenium?

Yes, a non coder can learn selenium, but it may take some extra effort. Many resources and tools are designed to help beginners understand the basics of automation and programming concepts.

Free Resources

Copyright ©2025 Educative, Inc. All rights reserved