Skip to main content

Configuring Browser Settings

Before using Web Agent, you need to configure the browser settings in PostQode to establish a connection with your browser for automation tasks.

Step-by-Step Setup

Step 1: Access PostQode Settings

  1. Open VS Code with PostQode extension installed
  2. Click on the PostQode icon in the sidebar to open the PostQode panel
  3. Click on the Settings icon (gear icon) in the PostQode panel

Step 2: Navigate to Browser Settings

  1. In the Settings panel, navigate to the Browser tab.

Core Browser Configuration Options

1. Execution Mode & Viewport

  • Disable Browser Tool: Disables browser tool execution across all tasks.
  • Headless Mode: Runs browser in the background without opening a visible UI window (ideal for CI/CD and faster scraping).
  • Viewport Presets: Choose standard screen resolutions:
    • Desktop (1280x800)
    • Desktop Large (1920x1080)
    • Tablet (768x1024)
    • Mobile (375x667)
    • Custom Width & Height: Specify custom pixel bounds.

2. Inspection & Snapshot Options

  • Vision Mode vs DOM Snapshot:
    • DOM Snapshot (Default): Generates numeric element trees using accessibility trees (fast, highly token-efficient, deterministic).
    • Vision Mode: Sends full-resolution visual screenshots to multimodal models.
  • Block Service Workers: Prevents background service worker threads from interfering with page state capture.

3. Session Options & Profile Directories

  • Session Persistence:
    • Isolated (Default): Creates a fresh, isolated temporary browser profile per task. Cache, cookies, and local storage are automatically cleared on task completion.
    • Persistent Session: Reuses a persistent user profile directory, keeping login cookies and authentication tokens intact across multiple tasks.
  • Custom Profile Directory: Set a custom path for browser profile storage to preserve session state between IDE restarts.
  • Storage State Path: Specify a JSON storage state file (storageState.json) containing cookies and local storage tokens for pre-authenticated environments.

4. Network Options & Proxy Settings

  • Custom Proxy Server: Route traffic through an HTTP or SOCKS5 proxy (http://username:[email protected]:8080).
  • Custom User-Agent: Set custom User-Agent strings for responsive testing or bot-detection avoidance.
  • Block External Assets: Optionally block non-essential third-party analytics or ads to speed up task completion.

5. Advanced & Output Options

  • Output Directory: Configure the destination directory where screenshots, execution logs, and Playwright video traces are saved.
  • Action Timeout: Maximum time (in ms) to wait for selectors and navigation before throwing a timeout (Default: 15000ms).
  • Slow-Mo Execution: Introduce an intentional visual delay (e.g. 250ms) between actions to make automation visually inspectable in non-headless mode.
  • Auto-Save Traces: Automatically record full Playwright .zip traces for post-execution failure debugging.

Next Steps

  1. Switch to Web Agent Mode
  2. Start Your First Web Automation Task