How to use Selenium Web Driver and JavaScript to Login any website ?

This article shows the method to sign in on any website using automation with the help of Selenium Web Driver and JavaScript. The concept of promises would be used in this method. This will be demonstrated by logging in to the GeeksforGeeks website. The below steps have to be followed.

Step 1: Install the latest Node.js runtime by following the steps for Windows or Linux.

Step 2: Create a package.json file for creating the Node application. This can be done by running the below command and following the required steps.

npm init

Step 3: Install the Selenium webdriver package. This can be done by opening terminal/command prompt in the same directory where the node is installed and running the below command.

npm install selenium-webdriver

Step 4: Install drivers for browser that will be used for automating the browser. The browser used in this article is Chrome, hence the chromedriver package needs to be installed. This can be done using the below command.



npm install chromedriver

Step 5: Create a JSON file (eg. credentials.json) to store the username/email and password. The following format can be used for saving the credentials.

{
  "email": "your-username",
  "pass": "your-password"
}

Step 6: Create a JavaScript file in the same directory as the credentials file. This file would contain the code for controlling the browser and automatically sign in. The steps below are followed to login to the GeeksforGeeks page. This is written in this main JavaScript file.

  1. Get to the login page.
  2. Find the text box on the page for entering the username. 
  3. Enter the given username. 
  4. Find the text box on the page for entering the password. 
  5. Enter the given password. 
  6. Find the button for login.
  7. Click the login button.

Step 7: Start the JavaScript file containing the script using the below command.

node scriptfile.js

Complete Code:

Javascript

filter_none

edit
close

play_arrow

link
brightness_4
code

// Include the chrome driver
require("chromedriver");
  
// Include selenium webdriver
let swd = require("selenium-webdriver");
let browser = new swd.Builder();
let tab = browser.forBrowser("chrome").build();
  
// Get the credentials from the JSON file
let { email, pass } = require("./credentials.json");
  
// Step 1 - Opening the geeksforgeeks sign in page
let tabToOpen =
    tab.get("https://auth.geeksforgeeks.org/");
tabToOpen
    .then(function () {
  
        // Timeout to wait if connection is slow
        let findTimeOutP =
            tab.manage().setTimeouts({
                implicit: 10000, // 10 seconds
            });
        return findTimeOutP;
    })
    .then(function () {
  
        // Step 2 - Finding the username input
        let promiseUsernameBox =
            tab.findElement(swd.By.css("#luser"));
        return promiseUsernameBox;
    })
    .then(function (usernameBox) {
  
        // Step 3 - Entering the username
        let promiseFillUsername =
            usernameBox.sendKeys(email);
        return promiseFillUsername;
    })
    .then(function () {
        console.log(
            "Username entered successfully in" +
            "'login demonstration' for GEEKSFORGEEKS"
        );
  
        // Step 4 - Finding the password input
        let promisePasswordBox =
            tab.findElement(swd.By.css("#password"));
        return promisePasswordBox;
    })
    .then(function (passwordBox) {
  
        // Step 5 - Entering the password
        let promiseFillPassword =
            passwordBox.sendKeys(pass);
        return promiseFillPassword;
    })
    .then(function () {
        console.log(
            "Password entered successfully in" +
            " 'login demonstration' for GEEKSFORGEEKS"
        );
  
        // Step 6 - Finding the Sign In button
        let promiseSignInBtn = tab.findElement(
            swd.By.css(".btn.btn-green.signin-button")
        );
        return promiseSignInBtn;
    })
    .then(function (signInBtn) {
  
        // Step 7 - Clicking the Sign In button
        let promiseClickSignIn = signInBtn.click();
        return promiseClickSignIn;
    })
    .then(function () {
        console.log("Successfully signed in GEEKSFORGEEKS!");
    })
    .catch(function (err) {
        console.log("Error ", err, " occurred!");
    });

chevron_right


Output:

full-stack-img




My Personal Notes arrow_drop_up

Check out this Author's contributed articles.

If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to contribute@geeksforgeeks.org. See your article appearing on the GeeksforGeeks main page and help other Geeks.

Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.


Article Tags :

Be the First to upvote.


Please write to us at contribute@geeksforgeeks.org to report any issue with the above content.