Table of Contents

Web QA Guide — Search + Browser Together

You speak naturally. pi handles the syntax.
Prerequisites
Scenario 1: Verify a Public Page Matches Documentation
Scenario 2: Competitor Research — Find and Walk Through a Flow
Scenario 3: Reproduce a Bug Reported by a User
Scenario 4: Accessibility Audit Across Multiple Pages
Quick Reference — The Flow
Troubleshooting

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

Web QA Guide — Search + Browser Together

Chain web search and Cloak Browser for end-to-end QA workflows. Find live pages, open them, interact, capture evidence, and audit accessibility — all in one pi session.

You speak naturally. pi handles the syntax.

You never type function calls. Just say what you want in plain language — pi figures out which tools to use and how.

You say	pi does
"search the web for..."	`web_search`
"open this page..."	`cloak_browser_open`
"type this in the field..."	`cloak_browser_action`
"click the button..."	`cloak_browser_action`
"show me what's on the page"	`cloak_browser_snapshot`
"check accessibility"	`cloak_browser_a11y_scan`

Prerequisites

Web Search installed
Cloak Browser installed

Scenario 1: Verify a Public Page Matches Documentation

You:   Our docs say the login is at portal.his-example.com/login.
       Open it, check the form fields, and try a wrong password to
       see if the error message appears.

pi:    Searching the web to confirm the URL...
       → Found: https://portal.his-example.com/login
       Opening the page...

       Page loaded. Visible elements:
         "Patient Portal"
         Username field
         Password field
         "Forgot Password?" link
         Login button

       Typing "testpatient" into username...
       Typing "wrongpassword" into password...
       Clicking Login...

       After submit, page shows: "Invalid username or password"
       Screenshot saved.

       Running accessibility scan...
       1 violation found: "Forgot Password?" link contrast is 3.2:1
       (needs 4.5:1 minimum for WCAG AA)

       Summary:
       [+] Login page exists at the documented URL
       [+] Form fields present: username, password, submit button
       [+] Error handling works with clear message
       [-] Accessibility: link contrast too low

Scenario 2: Competitor Research — Find and Walk Through a Flow

You:   I heard HospitalKu lets patients book appointments online.
       Find their booking page, open it as mobile, and walk through
       the flow. Capture screenshots of each step.

pi:    Searching for HospitalKu appointment booking...
       → Found: https://hospitalku.id/appointment
       Snippet: "Select specialty, choose doctor, pick time slot."

       Opening in mobile view (375×812)...
       Page shows a 4-step wizard:
         1. Pilih Spesialis → 2. Pilih Dokter → 3. Pilih Jadwal → 4. Konfirmasi
       Screenshot: evidence/01-landing.png

       Clicking "Penyakit Dalam"...
       Doctor list appears: dr. Andi (08:00-12:00), dr. Budi (13:00-17:00)
       Screenshot: evidence/02-doctors.png

       Clicking "dr. Andi"...
       Available slots: 08:00, 08:30, 09:00, 09:30
       Screenshot: evidence/03-slots.png

       Closing browser.

       Key observation: time slots are visible before login required —
       guest users can browse availability before signing in.

Scenario 3: Reproduce a Bug Reported by a User

You:   A user says searching "obat generik" on apotek.example.com
       shows a 500 error. Reproduce it and capture evidence.

pi:    Searching the web for this bug...
       → No public reports found.

       Opening https://apotek.example.com...
       Typing "obat generik" into the search field...
       Pressing Enter...

       500 Internal Server Error — bug confirmed.
         <h1>500</h1>
         <p>Terjadi kesalahan. Silakan coba lagi.</p>
       Screenshot: error-500.png

       Checking if this is a known issue...
       → No search results for this error on apotek.example.com.

       Summary:
       Bug reproduced — "obat generik" consistently triggers 500
       Evidence: screenshot + HTML excerpt captured
       Not publicly reported — appears to be a new issue
       Suggest: check backend logs for the failing search query

Scenario 4: Accessibility Audit Across Multiple Pages

You:   Audit our public site for accessibility. I don't know the exact
       URLs — search for pages under his-example.com and check each one.

pi:    Searching for his-example.com pages...
       → https://his-example.com
       → https://his-example.com/tentang-kami
       → https://his-example.com/kontak

       Auditing homepage...
       5 violations found:
         critical — search input has no label
         serious  — 3 images missing alt text
         minor    — 1 low-contrast text element
       The unlabeled input: <input type="text" placeholder="Cari...">
       Missing <label> or aria-label.

       Auditing /tentang-kami...
       1 violation: heading structure skips from h1 to h3 (no h2)

       Auditing /kontak...
       No violations.

       Total: 6 violations across 3 pages
       Critical: 1 | Serious: 3 | Minor: 2
       Screenshots and HTML excerpts saved in evidence/

Quick Reference — The Flow

You say...                         pi does...

"search for..."                    web_search → find URLs
"open the page"                    cloak_browser_open → load it
"what's on the page?"              cloak_browser_snapshot → text + screenshot
"click the login button"           cloak_browser_action → click
"type 'test' in the search box"    cloak_browser_action → type
"scroll down"                      cloak_browser_action → scroll
"check accessibility"              cloak_browser_a11y_scan → violations report
"that's enough, close it"          cloak_browser_close → clean up

Troubleshooting

Symptom	What to say
Search returns nothing	"try a broader search for..."
Page won't load	"increase the timeout and try again"
Can't find the right button	"show me the page HTML so I can find the selector"
Accessibility scan empty	"wait for the page to finish loading and try again"
Too many tabs open	"close all browser sessions"