Skip to main content
affpapa.org
RU EN
plugin official · GitHub

frontend-web-dev — GitHub Copilot plugin: what it does, how to install

Adds Playwright MCP testing commands and specialized agents to GitHub Copilot. It helps developers test web interfaces and build React 19.2 components.

Install into GitHub Copilot · Command from the source All methods and platforms ↓ 
copilot plugin install frontend-web-dev@awesome-copilot
Open on GitHub

What frontend-web-dev does

This plugin introduces testing slash commands and specialized agents for frontend projects. It includes /frontend-web-dev:playwright-explore-website to inspect live pages and /frontend-web-dev:playwright-generate-test to build test files from user flows. Both commands rely on Playwright MCP.

Coding tasks run through two custom agents. The expert-react-frontend-engineer agent targets React 19.2, focusing on Server Components and Actions in TypeScript. The second agent, electron-angular-native, handles code reviews for Electron applications paired with Node.js and Angular. It deliberately skips services hosted in separate repositories.

Install this plugin if you test interfaces through Playwright MCP or maintain Electron apps with Angular frontends. If you work with a different stack, these assistants add little value.

What it helps with

  • explore web pages using Playwright MCP
  • generate Playwright tests from user scenarios
  • build React 19.2 components with Server Components and Actions
  • review Electron and Angular desktop applications

Example prompts for the agent

  • /frontend-web-dev:playwright-generate-test create a test for user login
  • /frontend-web-dev:playwright-explore-website inspect the checkout page
  • @expert-react-frontend-engineer migrate this form to React 19.2 Actions

How to install frontend-web-dev

Command from the source

copilot plugin install frontend-web-dev@awesome-copilot

Step by step, with commands for each platform: Claude Code plugins: marketplaces, installing, and building your own

From the same set674

The whole set →
github-security Adds an interactive Security canvas to GitHub Copilot App for investigating GHAS code scanning alerts and local security findings. ★ 40,418repo stars git-worktree-explorer This plugin visualizes an active Git repository through worktrees, branches, and commits. Use it when you need a clear view of repository structure and pull request context. ★ 40,418repo stars gesture-review The plugin lets you review pull requests through a live camera feed, approving or rejecting changes with thumbs-up or thumbs-down gestures. ★ 40,418repo stars gem-team gem-team gives AI coding tasks a workflow with planning, TDD, and verification. Use it when you want to resume larger tasks from a saved plan. ★ 40,418repo stars foundry-hosted-agent-copilotkit Guides the setup of a CopilotKit React frontend connected to a Microsoft Foundry hosted agent over AG-UI. Use it to add human approvals or deploy with azd. ★ 40,418repo stars fluentui-blazor A skill with the right Fluent UI Blazor patterns plus an MCP server for looking up components, icons and docs at the version you use. ★ 40,418repo stars flight-map-canvas A GitHub Copilot canvas that opens Google Maps with 3D controls, like a flight simulator. The agent can send the flight anywhere and report what it is working on. ★ 40,418repo stars fastah-ip-geo-tools A skill and MCP server for validating and tuning IP geolocation feeds in RFC 8805 format. Built for network engineers who publish address geolocation. ★ 40,418repo stars

Similar

electron-best-practices agent-skills A skill that steers an AI agent through Electron apps with React: security defaults, typed IPC, packaging and signing. Useful whenever the agent writes main, preload or renderer code. CX Codex +1 820installs frontend-app-builder official OpenAI This skill designs and builds frontend apps, websites, and games, then checks the result in a browser. Use it for a new interface or an explicit redesign request. CX Codex GP ChatGPT 252installs frontend-developer VoltAgent Community Subagent for building complete frontend applications with React 18+, Vue 3+, and Angular 15+. Handles component architecture, state management, testing, and accessibility. 40,905installs playwright-core testdino-hq Provides battle-tested Playwright patterns for E2E, API, and component tests in TypeScript and JavaScript. Helps debug flaky runs, configure fixtures, and structure test suites. CX Codex +1 778installs frontend-testing-debugging official OpenAI Guides coding agents through structured frontend testing, UI checks, and bug investigations. Runs validation loops using Browser tools or local Playwright. CX Codex GP ChatGPT 159installs e2e-tests-studio mastra-ai A skill that automatically generates Playwright E2E tests when you modify playground components. Tests product behavior—data persistence, feature workflows, action side effects—not just UI states. CX Codex +1 2,500installs

Nearby in Frontend and UI

All plugins for Frontend and UI →

Questions about frontend-web-dev

How to install frontend-web-dev in GitHub Copilot?

Run copilot plugin install frontend-web-dev@awesome-copilot in your terminal.

What does the frontend-web-dev plugin include?

It adds two Playwright MCP slash commands and two agents. You get dedicated assistance for React 19.2 and Electron apps running Angular.

What do the Playwright commands require?

They require a configured Playwright MCP server to explore pages and output test code.

Source text

frontend-web-dev · MIT 
# Frontend Web Development Plugin

Essential prompts, instructions, and chat modes for modern frontend web development including React, Angular, Vue, TypeScript, and CSS frameworks.

## Installation

```bash
# Using Copilot CLI
copilot plugin install frontend-web-dev@awesome-copilot
```

## What's Included

### Commands (Slash Commands)

| Command | Description |
|---------|-------------|
| `/frontend-web-dev:playwright-explore-website` | Website exploration for testing using Playwright MCP |
| `/frontend-web-dev:playwright-generate-test` | Generate a Playwright test based on a scenario using Playwright MCP |

### Agents

| Agent | Description |
|-------|-------------|
| `expert-react-frontend-engineer` | Expert React 19.2 frontend engineer specializing in modern hooks, Server Components, Actions, TypeScript, and performance optimization |
| `electron-angular-native` | Code Review Mode tailored for Electron app with Node.js backend (main), Angular frontend (render), and native integration layer (e.g., AppleScript, shell, or native tooling). Services in other repos are not reviewed here. |

## Source

This plugin is part of [Awesome Copilot](https://github.com/github/awesome-copilot), a community-driven collection of GitHub Copilot extensions.

## License

MIT

© Awesome Copilot Community · MIT · github/awesome-copilot

See also

Project sponsors

Companies that keep this analytics open
Gold sponsor
Nutra.Club

Impressions, clicks and code copies — open statistics. We keep the numbers public for the same reason NeBlask itself is public. Become a sponsor