Frontend Release Gate
Curated

Frontend Release Gate

A pre-release workflow for UI-heavy changes that catches broken flows, lint/type regressions, and obvious security issues before shipping.

3 skills 1 installs
frontendtestingquality-assurancesecurityrelease
Updated yesterday

Install

Run this command to install all skills in this plugin:

npx skillstore add @frontend-release-gate

Skills will be installed to .claude/skills/ directory

Overview

Usage Guide

Enhanced by AI

Detailed Guide

## Overview
Frontend Release Gate is a pre-release workflow for UI-heavy changes. It runs three automated quality checkpoints — browser flow verification, lint/type validation, and a security audit — so you can ship with confidence and catch regressions before they reach production.

## Quick Start
1. Install the plugin in your OpenClaw workspace: `npx skillstore add @frontend-release-gate`
2. Before merging a UI branch, trigger **webapp-testing** to run Playwright checks: verify the main user flow, capture screenshots of key screens, and review browser console output for errors.
3. Run **lint-typecheck** to catch ESLint violations and TypeScript type errors across the frontend codebase — keeping the release clean before merge.
4. Finally, run **security-audit** to review auth handling, API key exposure, and injection risks before the change goes live.

## Key Commands
- `webapp-testing` — Launch Playwright-based browser checks on your local web app; surfaces broken UI flows, console errors, and provides screenshots for visual review.
- `lint-typecheck` — Runs ESLint and `tsc` type checking; surfaces type regressions and lint violations that CI may miss on stale caches.
- `security-audit` — Audits command execution paths, tool permissions, and API key handling for auth vulnerabilities and injection risks.

## Tips
- Run all three gates in sequence on every UI-heavy PR: webapp-testing → lint-typecheck → security-audit.
- Pair with a CI pipeline plugin (e.g., a build-and-test plugin) so the gate runs automatically on each pull request without manual invocation.
- If webapp-testing flags a broken flow, fix it before proceeding to lint-typecheck — a broken render often masks type errors downstream.

Skills

3