We can add .not property to the front of matches like toEqual(), toContainText(), toHaveAttribute(), or any other matcher to expect the opposite. It makes the assertion check for the opposite condition.
Table of Contents
Demo Website
For a demo, visit form6 of the Auto Pract Website. Here you will see a checkbox where the element's state will change on the checkbox selection.
When Checkbox is Selected:
When Checkbox is Not Selected:
Examples
Number and String Match
Assert Number Not Equal
let a = 10;
expect(a).not.toEqual(11);
Assert String Not Equal
let b = "hello";
expect(b).not.toEqual("hello1");
When Checkbox is Not Selected
Assert Checkbox Not Checked
await expect(page.locator("#mycheckbox")).not.toBeChecked();
Assert Button Not Enabled
await expect(page.locator("#mybutton")).not.toBeEnabled();
Assert Link Not Visible
await expect(page.locator("#mylink")).not.toBeVisible();
When Checkbox is Selected
Select Checkbox First
page.locator("#mycheckbox").click();
Assert Button Not Disabled
await expect(page.locator("#mybutton")).not.toBeDisabled()
Assert Link Not Hidden
await expect(page.locator("#mylink")).not.toBeHidden();
Assert Label Not Contain Text
await expect(page.locator("#mylabel")).not.toContainText("Checkbox is not selected.")
Assert Not Have Attribute
await expect(page.locator("#mybutton")).not.toHaveAttribute("disabled","disabled")