Multiple assertions (Test Automation)

Why This Matters

In test automation, multiple assertions are crucial for ensuring the robustness and reliability of your tests. This lesson will delve into handling multiple assertions using JavaScript with popular test automation frameworks like Selenium, Cypress, and Playwright.

Test automation is an essential part of modern software development, helping developers ensure code quality and maintain a steady pace of delivery. Multiple assertions are key to effective testing as they allow for thorough verification of application behavior under various scenarios. By understanding how to handle multiple assertions in JavaScript with popular test automation frameworks, you'll be better equipped to write reliable tests that catch errors early on and reduce the risk of regressions.

Prerequisites

To follow this lesson, you should have a basic understanding of:

1. JavaScript programming language: Familiarity with the core features of JavaScript, including variables, functions, loops, conditionals, and object-oriented programming concepts.
2. HTML/CSS web technologies: A good understanding of the structure and styling of web pages is essential for writing effective test automation scripts.
3. One or more test automation frameworks (Selenium, Cypress, Playwright): Familiarity with the basic concepts and usage of these popular test automation tools will help you navigate the examples in this lesson.
4. Familiarity with the test automation process and writing tests: A basic understanding of the test automation lifecycle, including setting up a testing environment, writing tests, running tests, and analyzing results, is necessary for following along.

Core Concept

Assertions in Test Automation

Assertions are used to verify that the actual outcome of a test matches the expected outcome. In JavaScript, multiple assertions can be made using various libraries such as Chai, Jest, or Mocha. These libraries provide methods for checking equality, truthiness, and other conditions.

Handling Multiple Assertions in Selenium (Expanded)

Selenium WebDriver provides the assert function to make assertions about the state of a web page. To make multiple assertions, simply call the assert function multiple times within your test method.

it('performs multiple assertions', function() {
// ...

const expectedText1 = 'Expected Text 1';
const expectedText2 = 'Expected Text 2';
const expectedClass1 = 'expected-class1';
const expectedClass2 = 'expected-class2';

const element1 = driver.findElement(By.id('element1'));
const text1 = element1.getText();
expect(text1).toEqual(expectedText1);
expect(element1).toHaveClass(expectedClass1);

const element2 = driver.findElement(By.id('element2'));
const text2 = element2.getText();
expect(text2).toEqual(expectedText2);
expect(element2).toHaveClass(expectedClass2);
});

Handling Multiple Assertions in Cypress (Expanded)

Cypress offers a built-in assertion library, making it easy to write multiple assertions within your tests. You can chain multiple assertions together using the should keyword.

it('performs multiple assertions', function() {
// ...

cy.get(element1).should('contain', 'Expected Text 1').and('have.class', expectedClass1);
cy.get(element2).should('contain', 'Expected Text 2').and('have.class', expectedClass2);
});

Handling Multiple Assertions in Playwright (Expanded)

Playwright also provides a built-in assertion library, allowing you to write multiple assertions within your tests. You can chain multiple assertions together using the expect function.

test('performs multiple assertions', async function() {
// ...

const text1 = await page.$eval(element1, el => el.textContent);
expect(text1).toEqual('Expected Text 1');
expect(element1).toHaveClass(expectedClass1);

const text2 = await page.$eval(element2, el => el.textContent);
expect(text2).toEqual('Expected Text 2');
expect(element2).toHaveCSS('class', expectedClass2);
});

Worked Example

In this example, we will write a test using Selenium that verifies the correctness of two elements on a webpage and their associated classes. We'll also use an explicit wait to ensure that the elements are fully loaded before making assertions about them.

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

describe('Multiple assertions with explicit wait', function() {
let driver;

beforeEach(async function() {
driver = await new Builder().forBrowser('chrome').build();
});

afterEach(async function() {
await driver.quit();
});

it('performs multiple assertions with explicit wait', async function() {
await driver.get('http://example.com');

const wait = driver.manage().timeouts().implicitlyWait(1000); // Set an implicit wait for 1 second

const element1 = await driver.findElement(By.id('element1'));
await driver.wait(until.elementIsVisible(element1), 5000); // Wait up to 5 seconds for the element to be visible
const text1 = await element1.getText();
expect(text1).toEqual('Expected Text 1');
expect(element1).toHaveClass('expected-class1');

const element2 = await driver.findElement(By.id('element2'));
await driver.wait(until.elementIsVisible(element2), 5000); // Wait up to 5 seconds for the element to be visible
const text2 = await element2.getText();
expect(text2).toEqual('Expected Text 2');
expect(element2).toHaveClass('expected-class2');

wait.apply(driver); // Reset the implicit wait after the test is done
});
});

Practice Questions

1. Write a test using Cypress that verifies the correctness of two elements on a webpage and their associated classes. Use an explicit wait to ensure that the elements are fully loaded before making assertions about them.
2. Write a test using Playwright that checks if a specific element contains a certain text and has a specific class. Use an explicit wait to ensure that the element is fully loaded before making assertions about it.
3. In Selenium, explain how you would handle multiple assertions when dealing with dynamic content or slow-loading pages.
4. In Cypress, what is the purpose of using the as keyword when assigning an alias to an element or a command?
5. In Playwright, how can you handle network errors that might cause tests to fail unexpectedly?

Common Mistakes

1. Not using an assertion library: Make sure to use a JavaScript assertion library like Chai, Jest, or Mocha when writing your tests.
2. Incorrect handling of multiple assertions: Be aware of the syntax for making multiple assertions in each test automation framework.
3. Ignoring error messages: When tests fail due to incorrect assertions, carefully review the error messages provided by the test automation framework to understand what went wrong.
4. Not using explicit waits: When dealing with dynamic content or slow-loading pages, use explicit waits to ensure that elements are fully loaded before making assertions about them.
5. Not handling timeouts properly: If tests take too long to complete, consider setting appropriate timeouts for each test and individual assertions to prevent flaky tests.
6. ### Mistakes in Selenium:

• Using implicit waits instead of explicit waits: Implicit waits can lead to unpredictable results and should be avoided in favor of explicit waits.
• Not handling stale elements: When an element is no longer attached to the DOM, it becomes a stale element. To handle stale elements, use the WebElement.isDisplayed() method before making assertions.

1. ### Mistakes in Cypress:

• Ignoring the as keyword: The as keyword is used to assign an alias to an element or a command, making it easier to reference later in your test.
• Not using the wait() function: The wait() function can be used to pause test execution for a specified duration, which can help when dealing with dynamic content or slow-loading pages.

1. ### Mistakes in Playwright:

• Not handling network errors: Network errors can cause tests to fail unexpectedly. To handle network errors, use the page.on('requestfailed') event and perform appropriate actions based on the error.
• Not using the waitForSelector() function: The waitForSelector() function can be used to wait for a specific element to appear on the page before making assertions about it.

FAQ

What is the purpose of multiple assertions in test automation?

Multiple assertions allow for thorough verification of application behavior under various scenarios, ensuring the robustness and reliability of tests.

How do I handle multiple assertions in Selenium WebDriver?

To make multiple assertions in Selenium WebDriver, simply call the assert function multiple times within your test method.

How do I handle multiple assertions in Cypress?

In Cypress, you can chain multiple assertions together using the should keyword.

How do I handle multiple assertions in Playwright?

In Playwright, you can chain multiple assertions together using the expect function.

What is an explicit wait and why should I use it when dealing with dynamic content or slow-loading pages?

An explicit wait allows you to pause test execution for a specified duration, ensuring that elements are fully loaded before making assertions about them. This helps prevent tests from failing due to dynamic content or slow-loading pages.