Skip to main content

Jest Automated Testing With Selenium Jest Integration


Developed by Facebook, Jest is a JavaScript testing library for React web-applications. With Jest automated testing framework, you can perform snapshot testing to help you comprehend the state of your react trees which are transforming over time. It provides an excellent combination of a test runner & an assertion library. You can make use of built-in code coverage reports for figuring out the areas the files that aren’t a part of your test code. There is also a built-in mocking library. Jest automated testing also works with TypeScript.

LambdaTest now integrates with Jest automated testing framework to boost your go-to-market delivery. Perform automated cross browser testing with LambdaTest to ensure your development code renders seamlessly through an on-cloud Selenium Grid providing 2000+ real browsers running through machines. Perform automation testing in parallel using LambdaTest’s Selenium Grid to drastically trim down your test cycles.

Prerequisites For Automated Testing Using Selenium Jest Integration#


All the code samples in this documentation can be found in the LambdaTest Jest Repository on Image GitHub. You can either download or clone the repository to quickly run your tests.

  1. Global Dependencies
  • Make sure to use the latest version of JavaScript.
  • A Git or GitHub repository
  • Download and install node.js and node package manager or npm.
  • To install node.js with homebrew use the below command.

$ brew install node

  • If you have npm already installed, you may want to upgrade it to latest version. Here the code you can run in your terminal to upgrade npm.

npm install [email protected] -g

  1. LambdaTest Authentication Credentials

Be aware of your LambdaTest authentication credentials i.e. your LambdaTest username, access key and HubURL. You need to set them up as your environment variables. You can retrieve them from your LambdaTest automation dashboard by clicking on the key icon near the help button.

  • For Linux/Mac:
$ export LT_USERNAME=<YOUR_LAMBDATEST_USERNAME> $ export LT_ACCESS_KEY=<YOUR_LAMBDATEST_ACCESS_KEY>
  • For Windows
$ set LT_ACCESS_KEY=<YOUR_LAMBDATEST_ACCESS_KEY>$ set LT_ACCESS_KEY=<YOUR_LAMBDATEST_ACCESS_KEY>

Setup The Running Selenium Jest Integration#


Check our GitHub repository for Jest and Selenium WebDriver Code Sample.

Step 1: Navigate to the cloned directory.

Step 2: Install dependencies using npm install.

Step 3: In your command prompt/ terminal, route the pointer to the folder test.

Run Jest Automated Testing On LambdaTest Selenium Grid#


Execute the below command to run a single test:

npm test .\single.test.js

Sample Code:

const webdriver = require('selenium-webdriver');const {until} = require('selenium-webdriver');const {By} = require('selenium-webdriver');
username= process.env.LT_USERNAME || "<your username>",accessKey=  process.env.LT_ACCESS_KEY || "<your accessKey>"
const capabilities = {  'build': 'jest-LambdaTest-Single',  'browserName': 'chrome',  'version':'72.0',  'platform': 'WIN10',  'video': true,};
const getElementById = async (driver, id, timeout = 2000) => {  const el = await driver.wait(until.elementLocated(By.id(id)), timeout);  return await driver.wait(until.elementIsVisible(el), timeout);};
const getElementByName = async (driver, name, timeout = 2000) => {  const el = await driver.wait(until.elementLocated(By.name(name)), timeout);  return await driver.wait(until.elementIsVisible(el), timeout);};
const getElementByXpath = async (driver, xpath, timeout = 2000) => {  const el = await driver.wait(until.elementLocated(By.xpath(xpath)), timeout);  return await driver.wait(until.elementIsVisible(el), timeout);};
describe('webdriver', () => {  let driver;
  beforeAll(async () => {    driver = new webdriver.Builder()      .usingServer('https://'+ username +':'+ accessKey  +'@hub.lambdatest.com/wd/hub')      .withCapabilities(capabilities)      .build();
    // eslint-disable-next-line no-undef    await driver.get(      `https://lambdatest.github.io/sample-todo-app/`,    );  }, 10000);
  afterAll(async () => {    await driver.quit();  }, 15000);
  test(      'test',      async () => {            const lnk = await getElementByName(driver, 'li1');      await lnk.click();            const lnk1 = await getElementByName(driver, 'li2');      await lnk1.click();
      const inpf = await getElementById(driver, 'sampletodotext');      await inpf.clear();      await inpf.sendKeys("Yey, Let's add it to list");
      const btn = await getElementById(driver, 'addbutton');      await btn.click();
      const output = await getElementByXpath(driver, '//html/body/div/div/div/ul/li[6]/span');      const outputVal = await output.getText();      console.log(outputVal);
      expect(outputVal).toEqual("Yey, Let's add it to list");          },    10000,  );});

Test Your Locally Hosted Jest Automated Testing Scripts With LambdaTest#


To help you perform cross browser testing of your locally stored web pages, LambdaTest provides an SSH(Secure Shell) tunnel connection with the name LambdaTest tunnel. With LambdaTest tunnel, you can execute a test of your locally hosted Jest automated testing scripts on cloud to perform automated cross browser testing on 2000+ browsers offered by Selenium Grid on LambdaTest. So you make sure how well your changes look, even before your customers. Curious to know more about LambdaTest tunnel?

Follow our documentation on LambdaTest tunnel to know it all. OS specific instructions to download and setup tunnel binary can be found at the following links.

Download the binary file for LambdaTest tunnel:

Once the tunnel is successfully set up, set the tunnel value to true in test capabilities.

Execute the below command for running your locally hosted test cases:

npm test .\local.test.js

Sample Code For Local Testing:

//local.test.jsconst webdriver = require('selenium-webdriver');const {until} = require('selenium-webdriver');const {By} = require('selenium-webdriver');const {chrome} = require('selenium-webdriver/chrome')
const getElementById = async (driver, id, timeout = 2000) => {  const el = await driver.wait(until.elementLocated(By.id(id)), timeout);  return await driver.wait(until.elementIsVisible(el), timeout);};
const getElementByName = async (driver, name, timeout = 2000) => {  const el = await driver.wait(until.elementLocated(By.name(name)), timeout);  return await driver.wait(until.elementIsVisible(el), timeout);};
const getElementByXpath = async (driver, xpath, timeout = 2000) => {  const el = await driver.wait(until.elementLocated(By.xpath(xpath)), timeout);  return await driver.wait(until.elementIsVisible(el), timeout);};
describe('webdriver', () => {  let driver;
  beforeAll(async () => {
    driver = new webdriver.Builder()      .forBrowser('chrome')      .build();
    // eslint-disable-next-line no-undef    await driver.get(      `https://lambdatest.github.io/sample-todo-app/`,    );  }, 10000);
  afterAll(async () => {    await driver.quit();  }, 15000);
  test(      'test',      async () => {            const lnk = await getElementByName(driver, 'li1');      await lnk.click();            const lnk1 = await getElementByName(driver, 'li2');      await lnk1.click();
      const inpf = await getElementById(driver, 'sampletodotext');      await inpf.clear();      await inpf.sendKeys("Yey, Let's add it to list");
      const btn = await getElementById(driver, 'addbutton');      await btn.click();
      const output = await getElementByXpath(driver, '//html/body/div/div/div/ul/li[6]/span');      const outputVal = await output.getText();      console.log(outputVal);
      expect(outputVal).toEqual("Yey, Let's add it to list");          },    10000,  );});

Important Note: Some Safari & IE browsers don’t support automatic resolution of the URL string “localhost”. Therefore, if you test on URLs like “http://localhost/” or “http://localhost:8080” etc, you would get an error in these browsers. A possible solution is to use “localhost.lambdatest.com” or replace the string “localhost” with machine IP address. For example, if you wanted to test “http://localhost/dashboard” or, and your machine IP is 192.168.2.6 you can instead test on “http://192.168.2.6/dashboard” or “http://localhost.lambdatest.com/dashboard”.

Fast track your automated cross browser testing process by executing your test cases using Jest testing framework on LambdaTest Selenium Grid. Happy testing!

Last updated on