dev-server

Locate and reuse the running Astro dev server for browser-based visual verification.

Updated Sep 6, 2026
One-click install
npx skills add https://github.com/malikkotb/shellpluscore --skill dev-server-malikkotb
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: dev-server
Source: https://github.com/malikkotb/shellpluscore/tree/main/.agents/skills/dev-server
Command: npx skills add https://github.com/malikkotb/shellpluscore --skill dev-server-malikkotb

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Verifying a visual change requires loading the real site, but starting a duplicate dev server or killing a teammate's session breaks shared work. This Skill defines the rules for finding, reusing, and safely driving the local Astro dev server before any preview, screenshot, or DevTools session. ## Core Features & Use Cases - Server discovery and reuse: Check for a running server with npx astro dev status or a curl probe on port 4321, and reuse it instead of starting a new one. - Safe startup and cleanup: Start your own server on a free port only when none is running, and stop only the processes you started. - Browser selection and boot verification: Use Chrome by default, Firefox for engine-specific issues, and confirm the client actually booted (document.readyState, customElements.get('lenis-scroll')) before trusting a screenshot. - Auth-aware previewing: Localhost bypasses Basic Auth in dev, and protected deployments require an Authorization header via a forwarding proxy rather than URL credentials or the Sanity draft cookie. - Use Case: Before taking a screenshot to confirm a layout fix, you check port 4321, find a teammate's server running, drive it with the Chrome MCP, and verify the page's custom elements upgraded before capturing. ## Quick Start Check whether the Astro dev server is already running on port 4321 and open the page in Chrome to verify my visual change.

Frequently Asked Questions about dev-server

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I check if the Astro dev server is already running?▼

Run `npx astro dev status` to see the instance Astro tracks for the project, or probe with `curl -s -o /dev/null -w '%{http_code}' http://localhost:4321/`. If a server answers, reuse it instead of starting a new one.

How do I preview a local Astro site in a headless browser?▼

Point a browser MCP at the running dev server, using Chrome by default and Firefox only for engine-specific layout, scroll, or animation issues. Confirm the client booted with `document.readyState === 'complete'` and a defined custom element before trusting screenshots.

Should I use Chrome or Firefox for visual testing?▼

Chrome is the default for visual checks. Use the Firefox MCP only when the rendering engine itself is in question, such as a Gecko-only layout, scroll, or animation bug. Both drive the same dev server, so switching browsers never requires a second server.

Why does a Basic Auth protected deployment render a broken page?▼

Chrome drops URL credentials from subresource requests, so `http://user:pass@host/` loads the HTML but every module script returns 401 and custom elements never upgrade. Inject an Authorization header through a small local forwarding proxy instead.

Can I stop a dev server that someone else started?▼

No. The server on port 4321 belongs to whoever is working in the repo, and killing it destroys their session. Only stop servers you started yourself, by task id or port.