CtrlK
BlogDocsLog inGet started
Tessl Logo
SkillPublic

review-ui-widgets

Reviews Chrome DevTools frontend changes in path group ui-and-widgets (^front_end/(ui|panels)/.*\.(ts|css)$), strictly reflecting review standards, architectural invariants, and security boundaries derived from historical code reviews.

Quality

80%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide
SecuritybySnyk

Passed

No findings from the security scan

Fix and improve this skill with Tessl

tessl review fix ./.agents/skills/review-ui-widgets/SKILL.md
SKILL.md
Quality
Evals
Security

Quality

Content

88%Weight 40%Scale 1-5

Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.

An excellent rule catalog: every rule pairs a rationale with concrete detection patterns and false-positive carve-outs, and the invocation contract (path group, rule-id citation) is stated unambiguously up front. The main weaknesses are repetitive Why/Look-for duplication within several rules and a single-file layout with no progressive disclosure for what is a long reference document.

DimensionReasoningScore

Conciseness

The body is dense with DevTools-specific invariants Claude would not know, with no padding about general concepts — every token is rule content. It falls short of anchor 5 only because several rules' **Why** and **Look for** sections restate the same guidance nearly verbatim (e.g. `UI_DECLARATIVE_CHILD_WIDGET_COMPOSITION` repeats the `widget(ChildWidget, {...})` preference three times), which could be trimmed.

4 / 5

Actionability

Each rule provides directly executable review guidance: grep-able patterns with real identifiers (`UI.Fragment.build`, `Platform.assertNever(x)` in `default:`, `import * as Buttons from '../../ui/components/buttons/buttons.js'`, `querySelector('[attr="' + val + '"]')`), explicit severity levels, and precise "Do not flag" carve-outs that prevent false positives. Per the rubric's instruction-skill note, this fully covers the common cases without needing code blocks.

5 / 5

Workflow Clarity

It is a single-task skill (review changes in the path group) whose single action is unambiguous: the intro specifies matching `^front_end/(ui|panels)/.*\.(ts|css)$`, applying the 17 rules, and "cite the rule id in findings" for output format. No destructive or batch operations are involved, so no validation cap applies and the simple-skill exception holds.

5 / 5

Progressive Disclosure

Structure is good — one section per rule with a consistent Severity/Why/Look-for/Do-not-flag schema — but the skill is a monolithic ~18KB single file with no bundle reference files, and its only links (`docs/ui_engineering.md`, `code-review`) point outside the bundle. This matches "good structure; minor organization gaps" rather than the appropriately-split, well-signaled one-level-deep references of anchor 5.

4 / 5

Total

18

/

20

Passed

Description

65%Weight 40%Scale 1-5

Based on the skill's description, can an agent find and select it at the right time? Clear, specific descriptions lead to better discovery.

A highly distinctive, domain-precise description with a clear "what", but it lacks any explicit "Use when..." trigger guidance and offers only one concrete action. Adding a trigger clause naming the natural situations (e.g., reviewing DevTools front_end/ or panels/ .ts/.css changes) would raise completeness and trigger-term quality.

Suggestions

Add an explicit trigger clause, e.g. "Use when reviewing changes to files under front_end/ui/ or front_end/panels/ (.ts/.css), or when the user asks for a DevTools UI/widget code review."

Include natural synonyms users would actually say — "code review", "UI", "widgets", "front_end" — alongside the formal path-group regex.

Briefly name what the review produces (e.g., findings citing rule ids with severity levels) to convert the meta-phrase about standards/invariants into a second concrete capability.

DimensionReasoningScore

Specificity

The description names the domain precisely ("Reviews Chrome DevTools frontend changes in path group ui-and-widgets (^front_end/(ui|panels)/.*\.(ts|css)$)") but lists only that single concrete action; "strictly reflecting review standards, architectural invariants, and security boundaries derived from historical code reviews" is meta-justification rather than additional actions, matching the anchor for a clear domain with 1-2 actions but not comprehensive coverage.

3 / 5

Completeness

The "what" is clear (reviews frontend changes in the path group against review standards, architectural invariants, and security boundaries), but there is no "Use when..." clause or equivalent explicit trigger guidance — the "when" is only weakly implied by the path regex. Per the judging guidelines, a missing explicit trigger clause caps completeness at 3.

3 / 5

Trigger Term Quality

It contains natural keywords users would say ("Chrome DevTools", "frontend", "review", "ui-and-widgets") but misses a few common variations such as "code review", "UI", "widgets" as plain terms, or "front_end". This is good coverage with a few natural terms missing rather than comprehensive synonym coverage.

4 / 5

Distinctiveness Conflict Risk

The description carves out a clear niche — one specific path group of the Chrome DevTools frontend, scoped to code review — with minimal overlap risk. It would not naturally trigger for unrelated skills; even the adjacent authoring skill (`ui-widgets`) is distinguishable by the review-only framing.

5 / 5

Total

15

/

20

Passed

Validation

93%

Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.

Validation — 15 / 16 Passed

Validation for skill structure

CriteriaDescriptionResult

relative_links

Relative link issues: 1 suspicious

Warning

Total

15

/

16

Passed

Repository

ChromeDevTools/devtools-frontend

Path

.agents/skills/review-ui-widgets/SKILL.md

Reviewed

Table of Contents

Is this your skill?

If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.