Rayrun

How do I use Playwright's test generator to create tests without manually writing .spec files?

Answer

To dynamically generate and run tests without creating .spec files, use Playwright's test generator feature. It's an excellent way to start testing quickly and efficiently.

Getting Started with Test Generator

  1. Run the codegen command with the URL of the website you want to test (optional). If you don't provide the URL, you can add it directly in the browser window later.

    npx playwright codegen https://ray.run/
  2. Interact with the website in the browser window that opens.

  3. Playwright Inspector will record your actions and generate test code.

The test generator prioritizes role, text, and test id locators when examining rendered pages. If multiple elements match a locator, Playwright improves the locator to uniquely identify the target element(s). This reduces test failures due to locator issues.

Example

Here's a TypeScript example of a generated test using @playwright/test:

import { test, expect } from '@playwright/test';

test('Generated test example', async ({ page }) => {
  await page.goto('https://ray.run/');
  await page.click('text=Sign in');
  await page.fill('input[name="email"]', 'user@example.com');
  await page.fill('input[name="password"]', 'password123');
  await page.click('button:has-text("Sign in")');
  const welcomeText = await page.innerText('h1');
  expect(welcomeText).toBe('Welcome, User!');
});

In summary, Playwright's test generator allows you to dynamically create automated UI tests without manually writing .spec files.

Thank you!
Was this helpful?
Still have questions?

If you still have questions, please ask a question and I will try to answer it.

TwitterGitHubLinkedIn
AboutQuestionsDiscord ForumBrowser ExtensionTagsQA Jobs

Rayrun is a community for QA engineers. I am constantly looking for new ways to add value to people learning Playwright and other browser automation frameworks. If you have feedback, email luc@ray.run.