惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

博客园 - Franky
云风的 BLOG
云风的 BLOG
人人都是产品经理
人人都是产品经理
博客园 - 叶小钗
Engineering at Meta
Engineering at Meta
Vercel News
Vercel News
Y
Y Combinator Blog
B
Blog
Microsoft Azure Blog
Microsoft Azure Blog
C
Check Point Blog
M
MIT News - Artificial intelligence
Jina AI
Jina AI
Cyber Security Advisories - MS-ISAC
Cyber Security Advisories - MS-ISAC
Apple Machine Learning Research
Apple Machine Learning Research
Hugging Face - Blog
Hugging Face - Blog
阮一峰的网络日志
阮一峰的网络日志
罗磊的独立博客
Stack Overflow Blog
Stack Overflow Blog
F
Fortinet All Blogs
博客园 - 司徒正美
I
InfoQ
Google DeepMind News
Google DeepMind News
GbyAI
GbyAI
U
Unit 42

DEV Community

Authentication Security Deep Dive: From Brute Force to Salted Hashing (With Java Examples) Why AI Systems Don’t Fail — They Drift Spilling beans for how i learn for exam😁"Reinforcement Learning Cheat Sheet" I Replaced Chrome with Safari for AI Browser Automation. Here's What Broke (and What Finally Worked) How Python Borrows Other People's Work The $40 Architecture: Processing 1 Billion API Requests with 99.99% Uptime Vibe Coding: A Workflow Guide (From Zero to SaaS) Most webhook security guides protect the wrong side. The scary part is delivery. Headless CMS for TanStack Start: Build a Blog with Cosmic EU Age Verification App "Hacked in 2 Minutes" — What Actually Happened Comfy Cloud’s delete function does not actually remove files Running AI Models on GPU Cloud Servers: A Beginner Guide Event-driven media intelligence with AWS Step Functions and Bedrock I scored 500 AI prompts across 8 quality dimensions — here's what broke How to Call Google Gemini API from Next.js (Free Tier, No Backend Needed) The Portal Protocol: Reclaiming Human Connection in the Age of AI How to Fix Your Team's Scattered Knowledge Problem With a Self-Hosted Forum Intro to tc Cloud Functors: A Graph-First Mental Model for the Modern Cloud Designing Multi-Tenant Backends With Both Ownership and Team Access I Built a Neumorphic CSS Library with 77+ Components — Here's What I Learned PostgreSQL Performance Optimization: Why Connection Pooling Is Critical at Scale Cómo construí un SaaS multi-rubro para gestionar expensas en Argentina con FastAPI + Vue 3 🚀 I Built an Ethical Hacking Scanner Tool – Open Source Project I Replaced /usage and /context in Claude Code With a Single Statusline A Pythonic Way to Handle Emails (IMAP/SMTP) with Auto-Discovery and AI-Ready Design I Collected 8.9 Million Polymarket Price Points — Here's What I Found About How Markets Really Move EcoTrack AI — Carbon Footprint Tracker & Dashboard Everyone's Using AI. No One Agrees How. 5 self-hosted ebook managers worth trying in 2026 Building Your First AI Agent with LangChain: From Chatbot to Autonomous Assistant
Introducing the UCP Playground Extension: An AI Shopping ...
Benji Fisher · 2026-05-28 · via DEV Community

Our first extension answered one question while you browse: is this store agent-ready? A green dot in your toolbar, fired by a single probe to /.well-known/ucp. It quietly became our biggest discovery engine.

Today we're shipping our second extension — and it answers the obvious follow-up: okay, so what actually happens when an agent shops here? — without making you leave the page.

Meet the UCP Playground — AI Shopping Agent extension. Open Chrome's side panel on any UCP-enabled store, pick a model, and an AI agent shops it live — right beside the page. It searches, compares, builds a cart, and reaches checkout, driving the store through its own published UCP tools. No screen-scraping, no separate tab.

Install it free from the Chrome Web Store →

From a green dot to a live agent

We've been building toward this in three steps.

The first extension is passive detection: one HTTP request per domain, a badge that tells you whether a store speaks the protocol. UCP Playground on the web is the runtime layer: it runs live agent shopping sessions against real stores and shows every JSON-RPC message flowing between agent and merchant — now across 16 frontier models and dozens of real stores.

The gap was the hop between them. You'd spot a UCP store while browsing, then go to a separate site to watch an agent try it. We even teased closing that gap in the first extension's write-up — "see the green dot, click Open in Playground, and you're watching Claude shop."

This extension closes it. Detection and action now live in the same tab.

What it does

  • A side panel, side by side. Click the toolbar icon and Playground opens in Chrome's native side panel, next to the storefront. You see the human page and the agent's run at the same time.
  • Chat with any UCP store. Type what you'd ask a shop assistant — "find a waterproof jacket under £100" — and the agent executes the store's UCP tools to answer.
  • The full tool-call timeline. Every step is visible: search, product lookup, cart, checkout — with raw responses, timing, product cards, cart state, and the final checkout URL. It's the same observability the web Playground is known for, docked beside the page.
  • Pick your model. Run any model exposed by your Playground account, so you can compare how different agents handle the same store.
  • Structured, not scraped. The extension drives the store through its published MCP tools — the exact path a real agent takes — so what you see is the protocol behaving, not a DOM hack that breaks on the next redesign.

The UCP Playground side panel running a full agent shopping flow on Everlane — product lookup, add-to-cart, and a generated checkout link, beside the live storefront
The side panel drives the store's own UCP tools — get_product_details, update_cart, checkout — beside the page, with timing on every call.

Why a side panel

Side-by-side is the whole point. When you can see the store's own page and the agent's tool calls together, the gaps jump out: a product the agent can't resolve, an option that doesn't map, a checkout that stalls where the website sails through.

For builders, that's a debugging loop measured in seconds — validate product schemas, option resolution, and checkout flows against a live agent without wiring up anything. For merchants, it's the first time you can watch how an agent experiences your store the way a customer's assistant soon will — the same kind of run that produced the first fully autonomous UCP purchase.

The side panel handling a multi-item request on Kylie Cosmetics — two search_catalog calls, product cards and shade selection, next to the storefront
Multi-item search and option resolution on Kylie Cosmetics, side by side with the store.

How it works

The first extension was pure client-side: one fetch() to /.well-known/ucp, a badge, done. This one is a thin client in front of the UCP Playground engine — your browser handles detection and display; the agent itself runs server-side. Four moving parts:

1. Detection. On navigation, the extension probes the current host's /.well-known/ucp — the same one-request check the first extension uses, with the host permission scoped to that exact path. It only ever reads the hostname to know where to look.

2. The side panel. Clicking the toolbar icon opens Chrome's native side panel (sidepanel.html) docked beside the page. The tabs permission lets the panel follow you as you move between stores, so it always knows which store to target — without touching anything on the page itself.

3. The agent runs on the Headless API — not in your browser. The extension doesn't run a model locally or scrape the DOM. It sends your message and the store's hostname to the UCP Playground Headless API, authenticated with your personal access token. Playground orchestrates the chosen model and executes the store's published MCP tools server-side — the same engine behind the web Playground and our evals — then streams the session back to the panel. That's why setup needs a free account and a token.

4. The timeline. Every step renders in order — search_catalog, get_product_details, update_cart, complete_checkout — each with its raw response, latency, product cards, cart state, and the final checkout URL. The same observability the web Playground is known for, docked beside the storefront.

Everything heavy — the model, the tool execution, the session record — lives in Playground. The extension is the lens.

What it reads — and what it doesn't

The first extension made a point of its ultra-narrow permissions; we hold the same line here, with one honest difference — a side panel that follows you across stores needs tabs to know which store you're on.

Here's the full ledger: storage (your token and settings), activeTab + tabs (the current store's hostname), sidePanel (the panel itself), and host access scoped to /.well-known/ucp plus ucpplayground.com. What it never requests: content-script access to store pages, your cookies, your history, or <all_urls>. It reads which store you're looking at, not what's on the page — and that hostname is the only thing about your browsing that ever leaves the browser.

Set up in under a minute

  1. Install from the Chrome Web Store (Chrome, Edge, Brave — any Chromium browser).
  2. Create a free account at ucpplayground.com.
  3. Generate a personal access token in settings and paste it into the extension options.
  4. Browse. It auto-detects UCP-enabled stores; click the icon to open the side panel and start shopping.

Where it fits in the stack

Each of our tools answers a different question, and now they chain cleanly from your toolbar:

The first extension turned passive browsing into a discovery map. This one turns it into a test bench — point an agent at any store on the web and watch the protocol work, live, beside the page.

Sources

About UCP Checker

UCP Checker is the independent validation and monitoring layer for the Universal Commerce Protocol. We crawl, validate and grade every public UCP manifest we can find, run the merchant directory, the UCP Score and live adoption stats, and — through UCP Playground — test how real AI agents behave against real stores.