Add an Assertion

In the tutorial, we'll add an assertion to check "Clear completed" appears.

Then we'll check it works without re-running the whole test!

First let's get our test to the place we want to add an assertion.

Select the lines before the await page.click(".clear-completed");.

Now press "Run 7 Lines".

Since we just ran the part of our test that creates and completes a todo, the "Clear completed" text should be visible in the browser.

Add the line await assertText(page, "Clear completed"); after the code we selected. This will assert that "Clear completed" is visible on the page.

Note: You can also use the Node.js assert module to write assertions.

Our test code now looks like this:

const { context } = await launch();
const page = await context.newPage();
await page.goto("http://todomvc.com/examples/react", {
  waitUntil: "domcontentloaded",
});
await page.click(".new-todo");
await page.fill(".new-todo", "create test!");
await page.press(".new-todo", "Enter");
await page.click(".toggle");
await assertText(page, "Clear completed"); // added this line
await page.click(".clear-completed");
// 🐺 QA Wolf will create code here

To check that our assertion works, highlight it in the code editor. Now click "Run 1 line".

🐺 In this tutorial we ran part of our test, created an assertion, and tested it without re-running the whole test.

Now let's schedule our tests to run.