Skip to content

Latest commit

 

History

8 Commits

Folders and files

NameName
Last commit message
Last commit date
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

mobile-chrome

License: MIT Claude Code plugin Built on Playwright MCP

Mobile browsing for Claude Code. The plugin drives the Google Chrome already installed on your computer as a phone, so Claude can read and act on websites that refuse desktop browsers, and can check and fix how your own site renders on a phone.

What it is for

Sites that accept only phones. Some websites accept only phones. On a laptop the page answers 403, shows an "open this in the app" wall, or stays blank; on a phone it loads; and the phone browser's "desktop site" switch brings the block straight back. Claude's fetch tools and an ordinary desktop browser are all turned away, because the site decides on the browser's identity: the User-Agent header, the Sec-CH-UA-* client hints, the viewport, touch support.

mobile-chrome gives Claude a browser the site takes for a phone. Chrome runs on your machine with a phone's identity, Claude browses through it with Playwright MCP's tools, and your sign-ins persist between sessions.

Your own site, on a phone. The layout at 360 pixels wide, the menu button, the forms, the console errors: Claude loads localhost or the staging URL in the phone profile, screenshots it, reads console and network, taps and types, then edits the code and reloads. A bug that only shows on phones becomes something Claude can reproduce and fix in one session. The emulation is Chrome's device mode, the same as DevTools: faithful for layout, viewport, touch and user-agent behaviour, not a substitute for Safari on an iPhone.

Features

  • Phone identity, end to end. Mobile user agent, matching client hints (Sec-CH-UA-Mobile: ?1, Sec-CH-UA-Platform), phone viewport and pixel density, touch events.
  • Your own Chrome. Drives the Google Chrome installed on Linux, macOS or Windows. No browser download, no second browser to maintain.
  • Sign in once. A persistent profile keeps logins across sessions, one profile per project folder.
  • Automatic. Claude reaches for it when a page blocks, or when you ask for a site's mobile version; /mobile-chrome <url> opens a page directly.
  • Any phone. One environment variable selects any device from Playwright's registry; the default is a Pixel 10.
  • Mobile QA of your own site. Screenshots, console and network from the phone viewport, other widths on request, and the code right there to fix.
  • Full browsing toolset. Navigate, read the page as an accessibility snapshot, click, type, fill forms, take screenshots, handle dialogs and tabs, inspect console and network: Playwright MCP's browser_* tools.

Requirements

Component Version Notes
Claude Code with plugin support claude --version
Google Chrome stable the installed browser is driven in place
Node.js 20 or newer npx fetches Playwright MCP on first start
Operating system Linux, macOS, Windows verified on Linux

Installation

claude plugin marketplace add mill-master/mobile-chrome
claude plugin install mobile-chrome@mobile-chrome

claude plugin list shows the plugin enabled; inside a session, /mcp lists the mobile-chrome server. The first session start fetches Playwright MCP through npx, which takes a few seconds once and about a second afterwards.

To try a checkout without installing: claude --plugin-dir /path/to/mobile-chrome.

Usage

Ask in plain words:

  • "https://example.com/deals gives me 403 on my laptop but opens on my phone. Read it and list the deals."
  • "Open the mobile version of https://example.com and tell me what the account menu shows."
  • /mobile-chrome https://example.com/deals
  • "Open http://localhost:3000 as a phone, screenshot the home page and tell me what breaks in the layout."
  • "On staging the menu button does nothing on phones. Reproduce it and fix the code."

A Chrome window opens at phone size (the default preset is 360×732 CSS pixels, so the window is roughly 470×860 screen pixels), Claude navigates, reads the page snapshot, and continues with clicks and typing as the task needs. If the site wants a login, sign in in that window; the profile keeps the session for later runs from the same project folder.

Configuration

Choosing the phone

The default device is a Pixel 10: Chrome on Android, the faithful choice since the browser really is Chrome, and the preset Playwright MCP itself uses for a generic phone. Set MOBILE_CHROME_DEVICE to another name from Playwright's device registry, then restart Claude Code:

export MOBILE_CHROME_DEVICE="Pixel 7"       # in your shell profile

or in Claude Code's settings.json:

{ "env": { "MOBILE_CHROME_DEVICE": "Galaxy S24" } }

Valid names include Pixel 7, Pixel 10, Galaxy S24, Galaxy Z Fold 7, iPhone 15, iPhone 17. An iPhone name gives the site Safari's user agent while Chrome's client hints are still sent, a combination a careful site can notice; the Android names have no such seam.

Other Playwright MCP options

The plugin runs npx -y @playwright/mcp@latest --browser chrome --device "<device>". For anything beyond the device (headless mode on a machine without a display, a pinned Playwright MCP version, an isolated profile), register Playwright MCP yourself with claude mcp add and the flags you need; the skill in this plugin guides Claude the same way for any server offering the browser_* tools.

How it works

The plugin has two parts and no code of its own:

  • .mcp.json registers Playwright MCP as the mobile-chrome server, launched with --browser chrome (the installed Chrome, not a Playwright-bundled browser) and --device set to the chosen phone. Playwright applies the device descriptor: user agent, viewport, pixel ratio, mobile and touch flags, and the client hints Chrome derives from them.
  • skills/mobile-chrome/SKILL.md tells Claude when to reach for that server (a page that refuses desktop browsers, a request for the mobile layout) and how the profile and the device setting behave.

Measured on Linux against a local server that rejects any request whose user agent lacks Mobile:

Header or property Plain Chrome With the plugin (Pixel 10)
User-Agent Mozilla/5.0 (X11; Linux x86_64) … Chrome/151 … Safari/537.36 Mozilla/5.0 (Linux; Android 16; Pixel 10) AppleWebKit/537.36 … Mobile Safari/537.36
Sec-CH-UA-Mobile ?0 ?1
Sec-CH-UA-Platform "Linux" "Android"
Viewport, pixel ratio 1280×720, 1 360×732, 3
Touch no yes
Server's answer 403 200

The browser server is fetched from npm at session start (@playwright/mcp@latest, published by Microsoft). Where a pinned dependency is required, register Playwright MCP at a fixed version as described above.

Limitations

  • The site still sees your computer's IP address. A block based on the address, a login wall, a JavaScript challenge or deep fingerprinting stays in place; the plugin changes the browser's identity, nothing else. Claude reports such a block rather than cycling through devices.
  • The browser is Chrome presenting as a phone, not a phone: navigator.platform still names your operating system, iPhone presets carry Chrome's client hints, and Safari or iOS-only behaviour is not reproduced.
  • The browser opens a visible window, so the machine needs a display. For headless use, register Playwright MCP yourself with --headless.
  • One browser per profile. Two Claude Code sessions in the same project folder cannot both hold the profile; Playwright MCP refuses the second with "Browser is already in use".

Troubleshooting

Symptom Cause and fix
/mcp shows mobile-chrome failed and the log mentions npx: command not found Node.js is missing, or not on the PATH Claude Code starts with. Install Node.js 20 or newer and restart Claude Code.
The log mentions Chromium distribution 'chrome' is not found Google Chrome is not installed where Playwright looks. Install Chrome, or run npx playwright install chrome.
A page still answers 403 The site checks more than the browser identity; see Limitations.
Changing MOBILE_CHROME_DEVICE has no effect The variable is read when the server starts. Restart Claude Code, and check the spelling against the device registry.
Browser is already in use Another session holds the same profile. Close it, or work from a different project folder.

Try it on a local site

The repo ships a site that refuses desktop browsers:

node test/desktop-only-site.mjs

It prints a URL and a code that only a phone browser gets to see; curl and a desktop browser get 403. In a Claude Code session with the plugin enabled, ask: "http://127.0.0.1:8077/ says it only works on phones. Read me the code on it." Claude opens it through the plugin and answers with the code.

Contributing

Issues and pull requests are welcome at https://github.com/mill-master/mobile-chrome. CLAUDE.md describes the acceptance test for a checkout; claude plugin validate . checks the manifests.

Acknowledgements

Playwright MCP and Playwright by Microsoft do the browsing and the emulation. This plugin packages them for Claude Code with a phone identity and a skill.

License

MIT.

About

Mobile browsing for Claude Code: drives the Google Chrome on your computer as a phone (mobile user agent, client hints, viewport, touch), so Claude can use sites that refuse desktop browsers and check and fix how your own site renders on a phone.

Topics

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages