How to automate website login using Selenium with Chrome in Node.js

A guide on how to use Selenium in Node.js to automate the login process for a website. The article will show how to set up the environment and write Node.js code to control Chrome.

In this article, you will learn how to use the Selenium WebDriver library in Node.js to automate the login process on a website using Chrome. We will use methods to find login fields, enter data, and submit the form automatically.

Node.js Code

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

// Initialize Chrome browser and set configuration
const service = new chrome.ServiceBuilder(path.resolve('chromedriver')).build();
chrome.setDefaultService(service);

(async function login() {
  let driver = await new Builder().forBrowser('chrome').build();
  try {
    // Open the login page of the website
    await driver.get('https://example.com/login');

    // Find and enter the username
    await driver.findElement(By.name('username')).sendKeys('yourUsername');

    // Find and enter the password
    await driver.findElement(By.name('password')).sendKeys('yourPassword');

    // Click the login button
    await driver.findElement(By.css('button[type="submit"]')).click();

    // Wait until the page title changes or confirm login success
    await driver.wait(until.titleIs('Dashboard'), 10000);
  } finally {
    // Close the browser
    await driver.quit();
  }
})();

Detailed explanation:

1. const { Builder, By, Key, until } = require('selenium-webdriver');: Import the necessary Selenium libraries.
2. const chrome = require('selenium-webdriver/chrome');: Import the Chrome control library.
3. const service = new chrome.ServiceBuilder(path.resolve('chromedriver')).build();: Initialize chromedriver to control Chrome.
4. let driver = await new Builder().forBrowser('chrome').build();: Start a new instance of Chrome.
5. await driver.get('https://example.com/login');: Navigate to the website’s login page.
6. await driver.findElement(By.name('username')).sendKeys('yourUsername');: Enter the username in the field with name="username".
7. await driver.findElement(By.name('password')).sendKeys('yourPassword');: Enter the password in the field with name="password".
8. await driver.findElement(By.css('button[type="submit"]')).click();: Click the login button.
9. await driver.wait(until.titleIs('Dashboard'), 10000);: Wait until the page title changes to 'Dashboard' after successful login.

System requirements:

• Node.js: version 12 or higher.
• Selenium WebDriver: Installed via npm using npm install selenium-webdriver.
• ChromeDriver: Download the version compatible with your current Chrome browser and set the correct path in the code.

How to install the libraries needed to run the code:

1. Install Selenium WebDriver:

   npm install selenium-webdriver
   

2. Download ChromeDriver from the official website and ensure compatibility with your current Chrome version.
3. Make sure ChromeDriver is either in your system's PATH or the path is set correctly in the code.

Tips:

• Ensure you are using a ChromeDriver version that matches your current Chrome browser version.
• If you encounter version-related errors, check your Selenium WebDriver and ChromeDriver versions.
• Use a .env file to store login credentials securely in real-world projects.

---