playwright-typescript-enableedge

GitHub repository skill for enableedge/playwright-typescript-enableedge

11 stars

Best use case

playwright-typescript-enableedge is best used when you need a repeatable AI agent workflow instead of a one-off prompt.

GitHub repository skill for enableedge/playwright-typescript-enableedge

Teams using playwright-typescript-enableedge should expect a more consistent output, faster repeated execution, less prompt rewriting.

When to use this skill

  • You want a reusable workflow that can be run more than once with consistent structure.

When not to use this skill

  • You only need a quick one-off answer and do not need a reusable workflow.
  • You cannot install or maintain the underlying files, dependencies, or repository context.

Installation

Claude Code / Cursor / Codex

$curl -o ~/.claude/skills/playwright-typescript-enableedge/SKILL.md --create-dirs "https://raw.githubusercontent.com/enuno/claude-command-and-control/main/skills-templates/testing/playwright-typescript-enableedge/SKILL.md"

Manual Installation

  1. Download SKILL.md from GitHub
  2. Place it in .claude/skills/playwright-typescript-enableedge/SKILL.md inside your project
  3. Restart your AI agent — it will auto-discover the skill

How playwright-typescript-enableedge Compares

Feature / Agentplaywright-typescript-enableedgeStandard Approach
Platform SupportNot specifiedLimited / Varies
Context Awareness High Baseline
Installation ComplexityUnknownN/A

Frequently Asked Questions

What does this skill do?

GitHub repository skill for enableedge/playwright-typescript-enableedge

Where can I find the source code?

You can find the source code on GitHub using the link provided at the top of the page.

SKILL.md Source

# playwright-typescript-enableedge

GitHub repository skill for enableedge/playwright-typescript-enableedge

## Description

A comprehensive test automation framework combining TypeScript and Playwright for UI and API testing, with AI-assisted test generation through Playwright MCP integration with VS Code and GitHub Copilot.

**Repository:** [enableedge/playwright-typescript-enableedge](https://github.com/enableedge/playwright-typescript-enableedge)
**Language:** TypeScript
**Stars:** 2
**License:** MIT License

## When to Use This Skill

Use this skill when you need to:
- Set up Playwright test automation with TypeScript
- Implement AI-assisted test generation using Playwright MCP
- Create UI and API automated tests
- Understand Page Object Model (POM) patterns in Playwright
- Integrate Allure reporting with Playwright tests
- Use natural language to generate Playwright test code

## Quick Reference

### Repository Info
- **Homepage:** https://github.com/enableedge/playwright-typescript-enableedge
- **Topics:** playwright, typescript, test-automation, ai-assisted, mcp, page-object-model, allure-report
- **Open Issues:** 0
- **Last Updated:** Recent (active development)
- **Commits:** 11 on main branch

### Languages
- **TypeScript:** Primary language
- **HTML:** Supporting files

### Key Features
- 🎭 UI and API test automation with Playwright
- 🤖 AI-assisted test generation via Playwright MCP
- 📦 Page Object Model (POM) design pattern
- 📊 Allure Report integration
- 🔧 VS Code extension integration
- 🤝 GitHub Copilot compatibility
- 🌐 Multi-browser support

## Architecture

**Design Pattern:** Page Object Model (POM)
**Tech Stack:** TypeScript + Playwright + Node.js
**AI Integration:** Playwright MCP (Model Context Protocol)
**Reporting:** Allure Report
**Requirements:** Node.js v14+, Java v11+ (for Allure)

## Installation

```bash
# Clone repository
git clone https://github.com/enableedge/playwright-typescript-enableedge.git
cd playwright-typescript-enableedge

# Install dependencies
npm install

# Install Playwright browsers
npx playwright install
```

## Usage

### Running Tests

```bash
# Run UI tests
npm run test:ui

# Run API tests
npm run test:api

# Run specific test file
npm run test -- <path-to-test-file>
```

### Playwright MCP Setup

**Enable AI-Assisted Test Generation:**

1. Install Playwright VS Code extension
2. Enable MCP in VS Code settings:
   ```json
   {
     "playwright.mcp.enabled": true
   }
   ```
3. Start MCP server via Command Palette
4. Describe test scenarios in natural language
5. MCP generates corresponding Playwright test code

**Key Capability:** Convert natural language test descriptions into executable Playwright test code with proper browser interaction automation.

## AI-Assisted Test Generation

The framework demonstrates how to:
- Use natural language to describe test scenarios
- Generate Playwright test code automatically
- Follow modern testing best practices
- Create maintainable test suites with AI assistance
- Integrate with GitHub Copilot for code suggestions

## Page Object Model (POM)

The framework implements POM for:
- Reusable page components
- Better test maintainability
- Separation of test logic from page structure
- Scalable test architecture

## Allure Reporting

Integrated Allure Report provides:
- Comprehensive test execution reports
- Visual test results
- Historical trend analysis
- Test categorization and tagging

## Available References

- `references/README.md` - Complete README documentation
- `references/file_structure.md` - Repository structure
- `references/setup.md` - Installation and configuration guide

## Use Cases

1. **UI Test Automation:** Automate web application testing with Playwright
2. **API Testing:** Create API test suites using Playwright's built-in capabilities
3. **AI-Assisted Development:** Generate test code from natural language descriptions
4. **Page Object Pattern:** Implement maintainable test architecture
5. **CI/CD Integration:** Integrate automated tests into deployment pipelines
6. **Test Reporting:** Generate comprehensive Allure reports

---

**Generated by Skill Seeker** | GitHub Repository Scraper (Manual Creation)

Related Skills

web-artifacts-builder

11
from enuno/claude-command-and-control

Suite of tools for creating elaborate, multi-component claude.ai HTML artifacts using modern frontend web technologies (React, Tailwind CSS, shadcn/ui). Use for complex artifacts requiring state management, routing, or shadcn/ui components - not for simple single-file HTML/JSX artifacts.

ui-ux-pro-max

11
from enuno/claude-command-and-control

UI/UX design intelligence. 50 styles, 21 palettes, 50 font pairings, 20 charts, 8 stacks (React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind). Actions: plan, build, create, design, implement, review, fix, improve, optimize, enhance, refactor, check UI/UX code. Projects: website, landing page, dashboard, admin panel, e-commerce, SaaS, portfolio, blog, mobile app, .html, .tsx, .vue, .svelte. Elements: button, modal, navbar, sidebar, card, table, form, chart. Styles: glassmorphism, claymorphism, minimalism, brutalism, neumorphism, bento grid, dark mode, responsive, skeuomorphism, flat design. Topics: color palette, accessibility, animation, layout, typography, font pairing, spacing, hover, shadow, gradient.

turbo-sdk

11
from enuno/claude-command-and-control

Complete Arweave Turbo ecosystem including client SDKs, core upload infrastructure, payment service backend, and CLI tools for permanent decentralized storage

terraform-best-practices

11
from enuno/claude-command-and-control

Comprehensive best practices for Terraform infrastructure as code from Anton Babenko's community guide

sveltekit-svelte5-tailwind-skill

11
from enuno/claude-command-and-control

Comprehensive integration skill for building sites with SvelteKit 2, Svelte 5, and Tailwind CSS v4

workflow-ship-faster

11
from enuno/claude-command-and-control

Ship Faster end-to-end workflow for small web apps (default: Next.js 16.1.1): idea/prototype → foundation gate → design-system.md → lightweight guardrails + docs → feature iteration → optional Supabase + Stripe → optional GitHub + Vercel deploy → optional AI-era SEO (sitemap/robots/llms.txt). Resumable, artifact-first under runs/ship-faster/ (or OpenSpec changes/). Trigger: ship/launch/deploy/production-ready MVP.

workflow-project-intake

11
from enuno/claude-command-and-control

Use when you need to clarify requirements and route to the right workflow (idea → executable input). Project intake + routing: help the user brainstorm and clarify intent, persist goal/context artifacts, then dispatch to the right workflow or step skill. Default route is workflow-ship-faster (Next.js 16.1.1) for idea/prototype→launch. Triggers: project kickoff, requirements clarification, brainstorm, ideas, discovery, intake.

workflow-feature-shipper

11
from enuno/claude-command-and-control

Use when you need to ship a single PR-sized feature end-to-end (plan -> implement -> verify) with artifacts. Ship core product features quickly in a Next.js codebase: turn a feature idea into an executable plan, implement in PR-sized slices, and keep artifacts under runs/ (or OpenSpec changes/ when available). Supports plan-only mode for early scoping. For prototype UI work, include a demo-ready wow moment (animation/micro-interaction) by default unless user opts out.

workflow-creator

11
from enuno/claude-command-and-control

Create workflow-* skills by composing existing skills into end-to-end chains. Turns a user idea into a workflow_spec.md SSOT (via workflow-brainstorm), discovers available skills locally + from skills.sh, and generates a new workflow-<slug>/ skill package. Use when you want to design a new workflow, chain multiple skills into a flow, or turn scattered atomic skills into a resumable plan-then-confirm workflow.

workflow-brainstorm

11
from enuno/claude-command-and-control

Use when you need to turn a vague idea into a confirmed design spec before implementation (new feature/component/behavior change). First check project context, then ask one question at a time, provide 2-3 options with trade-offs, finally output design in segments (~200-300 words each) with confirmation after each. Triggers: brainstorm, clarify idea, design spec, refine concept, requirement clarification.

tool-x-article-publisher

11
from enuno/claude-command-and-control

Publish Markdown to X (Twitter) Articles as a draft (never auto-publish). Use when the user asks to publish/post an article to X Articles, convert Markdown to X Articles rich text, or mentions "X article", "publish to X", "post to Twitter articles". Converts Markdown → HTML, pastes rich text, and inserts images deterministically.

tool-ui-ux-pro-max

11
from enuno/claude-command-and-control

Use when you need concrete UI/UX inputs (palette, typography, landing patterns, UX/a11y constraints) to drive design or review. Searchable UI/UX design intelligence (styles, palettes, typography, landing patterns, charts, UX/a11y guidelines + stack best practices) backed by CSV + a Python search script. Triggers: UIUX/uiux, UI/UX, UX design, UI design, design system, design spec, color palette, typography, layout, animation, accessibility/a11y, component styling. Actions: search, recommend, review, improve UI.