Skip to content
Autowright

Quick Start

Quick Start

Let’s write a simple automation script that searches DuckDuckGo.

  1. Create a script file

    Create search.ts in your project:

    search.ts
    import { Stepwright } from '@korvol/stepwright';
    

    const script = Stepwright.create('DuckDuckGo Search')
      .config({
        headless: false, // Watch it run
        screenshotOnFailure: true,
      })
    

      .checkpoint('Search')
    

      .step('Navigate to DuckDuckGo', async (ctx) => {
        await ctx.page.goto('https://duckduckgo.com');
        ctx.log('Navigated to DuckDuckGo');
      })
    

      .step('Enter search query', async (ctx) => {
        await ctx.page.fill('input[name="q"]', 'Playwright automation');
        await ctx.page.keyboard.press('Enter');
        ctx.log('Submitted search');
      })
    

      .step('Wait for results', async (ctx) => {
        await ctx.page.waitForSelector('[data-testid="result"]');
        ctx.log('Results loaded');
      })
    

      .endCheckpoint();
    

    // Run the script
    script.run().then((result) => {
      console.log('Success:', result.success);
      console.log('Steps completed:', result.stepsCompleted);
    });

  2. Run the script

    Terminal window
    npx tsx search.ts

    You’ll see a browser window open, navigate to DuckDuckGo, and perform a search.

  3. View the results

    The script logs its progress and returns a result object with:

    • success - Whether all steps passed
    • stepsCompleted - Number of steps that ran
    • duration - Total execution time
    • data - Any data you collected

Understanding the Code

Let’s break down what each part does:

Creating a Script

const script = Stepwright.create('DuckDuckGo Search')

Creates a new script with a name for logging and reporting.

Configuration

.config({
  headless: false,
  screenshotOnFailure: true,
})

Sets options for browser behavior and artifact capture.

Checkpoints

.checkpoint('Search')
// ... steps ...
.endCheckpoint()

Groups steps together. If a step fails, the entire checkpoint can retry.

Steps

.step('Navigate to DuckDuckGo', async (ctx) => {
  await ctx.page.goto('https://duckduckgo.com');
  ctx.log('Navigated to DuckDuckGo');
})

Each step has a name and an async function. The ctx object provides:

  • ctx.page - Playwright Page instance
  • ctx.log() - Log messages
  • ctx.data - Shared data object
  • ctx.screenshot() - Capture screenshots

Next Steps