Run any Skill in Manus with one click

frontend-browser-review

Shared workflow for browser-based review of user-visible frontend changes in Langfuse. Use when a change affects UI behavior, layout, styling, navigation, or browser-visible regressions and should be checked with the Playwright MCP server before signoff.

Run Skill in Manus

Overview

Install command

npx skills add https://github.com/langfuse/langfuse --skill frontend-browser-review

Copy and paste this command into Claude Code to install the skill

Source

langfuse/langfuse

Stars28,445

Forks2,939

UpdatedJune 2, 2026 at 08:28

SKILL.md

readonly

name	frontend-browser-review
description	Shared workflow for browser-based review of user-visible frontend changes in Langfuse. Use when a change affects UI behavior, layout, styling, navigation, or browser-visible regressions and should be checked with the Playwright MCP server before signoff.

Frontend Browser Review

Use this skill when a change affects what users see or do in the browser.

Start Here

Read ../../../web/AGENTS.md for web-specific entry points and test commands.
Use the workspace playwright MCP server configured from the repo-owned shared agent setup.

When To Use It

UI changes in web/**
Layout, styling, or responsive behavior changes
Changes to navigation or page flows
Bug fixes where the failure mode is visible in the browser
Final signoff for user-visible frontend work

Review Loop

Start the app with pnpm run dev:web unless an existing local server is already running.
Install Chromium with pnpm run playwright:install if Playwright has not been set up on the machine yet.
Open the primary changed flow with the Playwright MCP server.
Exercise the main happy path affected by the change.
Check for obvious visual regressions:
- broken layout or spacing
- banner overlap or viewport anchoring issues
- missing loading, empty, or error states
- broken responsive behavior on narrow widths
If the page changed materially, inspect the resulting UI state and compare it against the intended behavior from the task or existing patterns.
If the browser session fails, inspect traces and artifacts under /tmp/playwright-mcp.

Output Expectations

Report:

What flow you reviewed
Whether the primary flow worked
Any visible regressions or follow-up risks
If review was blocked, exactly what prevented browser verification

Scope Notes

This skill complements, not replaces, targeted tests and linting.
For implementation details, stay in web/AGENTS.md and package-local skills.
Use this as the browser-signoff workflow, not as a generic frontend coding guide.

More from this repository

same repository

add-model-price

langfuse/langfuse

Use when editing worker/src/constants/default-model-prices.json, packages/shared/src/server/llm/types.ts, pricing tiers, tokenizer IDs, or matchPattern regexes for OpenAI, Anthropic, Bedrock, Vertex, Azure, or Gemini model pricing.

2026-06-0328.4k

agent-setup-maintenance

langfuse/langfuse

Shared workflow for editing Langfuse's repo-owned agent setup under `.agents/`. Use when changing AGENTS files, shared skills, `.agents/config.json`, generated shim behavior, provider discovery paths, or install-time agent sync.

2026-06-0328.4k

backend-dev-guidelines

langfuse/langfuse

Shared backend guide for Langfuse's Next.js, tRPC, BullMQ, and TypeScript monorepo. Use when creating or reviewing tRPC routers, public REST endpoints, BullMQ queue processors, backend services, middleware, Prisma or ClickHouse data access, OpenTelemetry instrumentation, Zod validation, env configuration, or backend tests across web, worker, or packages/shared.

2026-06-0328.4k

clickhouse-best-practices

langfuse/langfuse

MUST USE when reviewing ClickHouse schemas, queries, or configurations. Contains 28 rules that MUST be checked before providing recommendations. Always read relevant rule files and cite specific rules in responses.

2026-06-0328.4k

git-workflow

langfuse/langfuse

Langfuse repo Git, GitHub, commit, branch, pull request, issue search, release, and production-promotion workflow. Use when staging, committing, pushing, opening PRs, searching GitHub issues, or changing release/promotion behavior.

2026-06-0328.4k

pnpm-upgrade-package

langfuse/langfuse

Upgrade pnpm workspace dependencies to target/latest versions: direct/transitive bumps, release-age checks, temporary overrides, minimumReleaseAgeExclude, lockfile/dedupe verification.

2026-06-0328.4k

Source

langfuse

langfuse/langfuse

View GitHub Repository View Creator Repositories

Install command

Download

Run Skill in Manus

Useful forSOC

Software Quality Assurance Analysts and TestersComputer and Mathematical Occupations15-1253L4

name	frontend-browser-review
description	Shared workflow for browser-based review of user-visible frontend changes in Langfuse. Use when a change affects UI behavior, layout, styling, navigation, or browser-visible regressions and should be checked with the Playwright MCP server before signoff.

Frontend Browser Review

Use this skill when a change affects what users see or do in the browser.

Start Here

Read ../../../web/AGENTS.md for web-specific entry points and test commands.
Use the workspace playwright MCP server configured from the repo-owned shared agent setup.

When To Use It

UI changes in web/**
Layout, styling, or responsive behavior changes
Changes to navigation or page flows
Bug fixes where the failure mode is visible in the browser
Final signoff for user-visible frontend work

Review Loop

Start the app with pnpm run dev:web unless an existing local server is already running.
Install Chromium with pnpm run playwright:install if Playwright has not been set up on the machine yet.
Open the primary changed flow with the Playwright MCP server.
Exercise the main happy path affected by the change.
Check for obvious visual regressions:
- broken layout or spacing
- banner overlap or viewport anchoring issues
- missing loading, empty, or error states
- broken responsive behavior on narrow widths
If the page changed materially, inspect the resulting UI state and compare it against the intended behavior from the task or existing patterns.
If the browser session fails, inspect traces and artifacts under /tmp/playwright-mcp.

Output Expectations

Report:

What flow you reviewed
Whether the primary flow worked
Any visible regressions or follow-up risks
If review was blocked, exactly what prevented browser verification

Scope Notes

This skill complements, not replaces, targeted tests and linting.
For implementation details, stay in web/AGENTS.md and package-local skills.
Use this as the browser-signoff workflow, not as a generic frontend coding guide.