Skip to main content

​
🧭 Browser Config

Browser Config controls the browser state both agents rely on:
  • Coverage agent: uses Browser Config plus the Coverage-only Prompt formatting settings described below.
  • Browser agent: uses the same Browser Config (environment, locale, session state, highlighting).
The result: every run starts in the right environment with the right session, and Coverage runs hand off a prompt that matches your format. Settings workspace with Environments tab selected

​
Config tab (Coverage + Browser agents)

Use the Config tab to set the shared browser defaults both agents consume. Browser Config tab showing environment, options, locale, and uploads
  • Environment selector — pick which environment this config belongs to (e.g., todo dev).
  • Browser Options
    • Highlight Elements toggles visual cues for the agent when you provide labeled selectors.
    • Headless Mode (currently disabled) controls whether runs show a visible browser.
  • Browser Locale — choose the language/region so copy and formatting stay consistent.
  • Session State uploads
    • Cookies — upload a JSON export of authenticated cookies.
    • Storage State — upload JSON with the origins block (localStorage/sessionStorage).
  • Save the page to lock in the config for this environment.
✨ Result: Both agents start with the right session, locale, and highlighted elements—no brittle logins or locale drift.

​
Prompt formatting (Coverage only)

Coverage runs include a Prompt formatting tab to shape the Browser Prompt Coverage sends to the Browser agent after generating workflows. Prompt formatting tab for Coverage agents What prompt_config means: it defines the exact sections and labels the end user sees in the Browser Prompt produced by the Coverage agent (for example: Description, Preconditions, Steps, Validation). Only customized values are saved; leaving a field blank keeps the Nota defaults.
  • Section Labels: Rename headings like description, preconditions, steps, expected_result to match your team’s voice. Default fields stay required, but you can add/remove custom ones.
  • Rules Block: Set shared rules that will be appended to every Browser Prompt (e.g., accessibility notes, data handling, element naming guidance).
  • Reset to defaults: Clears your overrides and returns to Nota defaults.
These settings never affect standalone Browser agent runs; they only apply when Coverage generates a prompt and hands it to the Browser agent.

​
Capture cookies and storage with Playwright

Playwright can export both cookies and local storage in a single storageState file. Here’s a quick workflow to produce it: 
npx playwright codegen https://app.trynota.ai/login \
  --save-storage=team-env-storage-state.json
During codegen:
  1. Log in and reach the screen your workflow should begin on.
  2. Close the codegen session—Playwright saves team-env-storage-state.json with cookies and localStorage embedded.
That export bundles cookies and storage together; duplicate it and trim one section out so you end up with separate files for each Nota upload slot. Prefer scripting? Use Playwright to capture both files in one pass: 
// save-session-state.ts
import { chromium } from '@playwright/test';
import { promises as fs } from 'fs';

(async () => {
  const browser = await chromium.launch({ headless: false });
  const context = await browser.newContext();
  const page = await context.newPage();

  await page.goto('https://app.trynota.ai/login');
  await page.fill('input[type="email"]', process.env.NOTA_EMAIL ?? '');
  await page.fill('input[type="password"]', process.env.NOTA_PASSWORD ?? '');
  await page.click('button:has-text("Log in")');
  await page.waitForURL('**/dashboard');

  const storageState = await context.storageState();
  await fs.writeFile(
    'team-env-storage-state.json',
    JSON.stringify({ origins: storageState.origins }, null, 2),
    'utf-8'
  );
  await fs.writeFile(
    'team-env-cookies.json',
    JSON.stringify(storageState.cookies, null, 2),
    'utf-8'
  );

  await browser.close();
})();
Run it with: 
NOTA_EMAIL=[email protected] NOTA_PASSWORD=secret npx ts-node save-session-state.ts
The script saves two files in your working directory: team-env-storage-state.json (storage state) and team-env-cookies.json (cookies). The storage file keeps only the origins block so it aligns with Nota’s storage upload expectations. Keep both under source control alongside the environment they belong to. If you start with a --save-storage export from codegen, duplicate it and remove either the cookies or origins section so each upload uses a dedicated file.

​
Playwright JSON formats

Playwright expects the saved files to match the shapes it produces via context.storageState() and context.cookies(). The script above writes them in this form: cookies.json 
[
  {
    "name": "session_token",
    "value": "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9...",
    "domain": ".trynota.ai",
    "path": "/",
    "expires": 1725148800,
    "httpOnly": true,
    "secure": true,
    "sameSite": "Lax"
  },
  {
    "name": "abTestGroup",
    "value": "checkout_variant_b",
    "domain": "app.trynota.ai",
    "path": "/",
    "expires": -1,
    "httpOnly": false,
    "secure": true,
    "sameSite": "None"
  }
]
storage-state.json 
{
  "origins": [
    {
      "origin": "https://app.trynota.ai",
      "localStorage": [
        {
          "name": "nota:userPreferences",
          "value": "{\"theme\":\"dark\",\"locale\":\"en-US\"}"
        },
        {
          "name": "nota:featureFlags",
          "value": "{\"workflowPreview\":true,\"aiHints\":true}"
        }
      ],
      "sessionStorage": [
        {
          "name": "nota:lastVisited",
          "value": "\"/workflows/1234\""
        }
      ]
    }
  ]
}
  • Cookies upload: Provide an array of cookie objects with the Playwright keys (name, value, domain, etc.). Generate it with context.cookies() if you prefer an automated export.
  • Storage upload: Provide an object with an origins array. Each origin lists the URL plus the localStorage and optional sessionStorage entries to restore.
  • Multiple domains: Add another object to either array for every domain you need to restore state for (https://admin.trynota.ai, https://analytics.trynota.ai, etc.).

​
Upload to Nota

  1. Open Settings → Browser Config → Config.
  2. Select the environment this state belongs to.
  3. Toggle Highlight Elements if you want on-screen hints for labeled selectors.
  4. Set the Browser Locale you expect in runs.
  5. Upload team-env-storage-state.json into Storage State.
  6. Upload team-env-cookies.json into Cookies.
  7. Add highlighted element mappings (selector + friendly name) for critical UI.
  8. Save the config. Both Coverage and Browser agents now start with this state.
  9. (Coverage only) Switch to Prompt formatting to adjust section labels/rules before Coverage hands prompts to the Browser agent.

​
Use cases & benefits

  • Skip repetitive logins: Start every workflow already authenticated inside the dashboard.
  • Protect gated features: Preserve feature-flag states or onboarding checkpoints stored in localStorage.
  • Regional testing: Lock the locale to evaluate translations, currency formats, or EU-specific flows.
  • Agent guidance: Highlight critical selectors (Add to cart, Submit order) so the AI focuses on the right actions.
  • Parallel reliability: Every run gets the same frozen session state, reducing flakiness from rate limits or session throttles.

​
Keep It Fresh

  • Re-export after password or SSO changes to avoid expired sessions.
  • Version your JSON files alongside environment docs so teammates know which state is current.
  • Pair with Rotation Rules if session tokens expire; regenerate the storage-state JSON after each rotation window.