​
Standalone Mode

Auto-Browse can be used independently of Playwright’s test framework, making it perfect for automation scripts, web scraping, or any browser-based tasks.

​
Overview

In standalone mode, Auto-Browse:

  • Manages the browser lifecycle automatically
  • Creates and configures pages
  • Handles cleanup
  • Provides a simple, natural language interface

​
Basic Usage

Here’s a simple example of using Auto-Browse in standalone mode:

import { auto } from "auto-browse";

async function main() {
	try {
		// Navigate to a website
		await auto("go to https://example.com");

		// Take a snapshot to analyze the page
		await auto("take a snapshot");

		// Perform actions using natural language
		const heading = await auto("get the main heading text");
		console.log("Main heading:", heading);
	} catch (error) {
		console.error("Error:", error);
	}
}

main().catch(console.error);

​
Form Automation Example

A more complex example showing form automation:

import { auto } from "auto-browse";

async function automateForm() {
	try {
		// Navigate to the form
		await auto("go to https://httpbin.org/forms/post");

		// Take a snapshot to analyze the page structure
		await auto("take a snapshot");

		// Fill out form fields
		await auto('type "John Doe" in the customer name field');
		await auto('select "Large" for size');
		await auto('select "Mushroom" for topping');
		await auto('check "cheese" in extras');

		// Submit and verify
		await auto("click the Order button");
		await auto("take a snapshot of the response page");

		// Extract confirmation details
		const confirmation = await auto("get the order confirmation text");
		console.log("Order confirmed:", confirmation);
	} catch (error) {
		console.error("Error:", error);
	}
}

automateForm().catch(console.error);

​
Running Scripts

To run standalone scripts:

# Using ts-node
npx ts-node your-script.ts

# Or using nodemon for development
npx nodemon your-script.ts

​
Best Practices

  1. Error Handling
try {
	await auto("perform action");
} catch (error) {
	// Handle specific error types
	if (error.message.includes("element not found")) {
		// Handle element not found
	} else if (error.message.includes("timeout")) {
		// Handle timeout
	}
	throw error;
}
  1. Taking Snapshots
// Take snapshots to help Auto-Browse understand the page
await auto("take a snapshot");

// Take named snapshots for reference
await auto('take a snapshot named "before-login"');
await auto('take a snapshot named "after-login"');
  1. Descriptive Commands
// Good - clear and specific
await auto('type "user@example.com" in the email field');

// Less clear
await auto('type "user@example.com" in input');

​
Common Use Cases

  1. Web Scraping
async function scrapeData() {
	await auto("go to https://example.com/products");
	await auto("take a snapshot");

	// Get all product titles
	const titles = await auto("get text of all product title elements");

	// Get specific product details
	const price = await auto('get the price for product "Example Item"');
}
  1. Site Testing
async function testSite() {
	await auto("go to https://example.com");

	// Check navigation
	await auto("verify the main navigation menu is visible");
	await auto("click the About link");
	await auto("verify the URL contains /about");

	// Test responsiveness
	await auto("set viewport to mobile size");
	await auto("verify the mobile menu button is visible");
}
  1. Data Entry Automation
async function enterData(records) {
	for (const record of records) {
		await auto("click the Add New button");
		await auto(`type "${record.name}" in the name field`);
		await auto(`type "${record.email}" in the email field`);
		await auto("click Save");
		await auto("verify success message is shown");
	}
}

​
Next Steps