End-to-end testing with Playwright in Remix - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to launch a browser in Playwright.

Remix

const { chromium } = require('playwright');
(async () => {
  const browser = await chromium.[1]();
  await browser.close();
})();

Drag options to blanks, or click blank then click option'

Alaunch

Bstart

Copen

Dinit

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'start' or 'open' instead of 'launch' causes errors.

The launch() method starts a new browser instance in Playwright.

2fill in blank

medium

Complete the code to navigate to a URL in Playwright.

Remix

const page = await browser.newPage();
await page.[1]('https://example.com');

Drag options to blanks, or click blank then click option'

Anavigate

BgoTo

Cgoto

Dvisit

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'goTo' or 'navigate' causes method not found errors.

The correct method to navigate to a URL is goto() in Playwright.

3fill in blank

hard

Fix the error in the assertion to check page title.

Remix

const title = await page.title();
expect(title).[1]('Welcome');

Drag options to blanks, or click blank then click option'

Aequals

BtoBe

Cis

DequalTo

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'equals' or 'equalTo' causes assertion errors.

The Playwright test assertion uses toBe() to check equality.

4fill in blank

hard

Fill both blanks to wait for a button and click it.

Remix

await page.[1]('button#submit');
await page.[2]('button#submit');

Drag options to blanks, or click blank then click option'

AwaitForSelector

Bclick

CwaitForLoadState

Dpress

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'press' instead of 'click' causes wrong action.

First, waitForSelector() waits for the button to appear, then click() clicks it.

5fill in blank

hard

Fill all three blanks to create a test that opens a page, fills a form, and submits it.

Remix

test('submit form', async ({ page }) => {
  await page.[1]('https://example.com/form');
  await page.fill('[2]', 'John Doe');
  await page.[3]('button[type=submit]');
});

Drag options to blanks, or click blank then click option'

Agoto

B#name

Cclick

DwaitForSelector

Attempts:

3 left

💡 Hint

Common Mistakes

Using wrong selectors or methods causes test failures.

The test navigates with goto, fills the input with selector #name, then clicks the submit button with click.