CtrlK
BlogDocsLog inGet started
Tessl Logo

scrolljacking

Use when reviewing rendered HTML, interactive components, or design-system patterns related to Avoid scrolljacking and custom scroll behavior. Check native semantics first, then inspect keyboard behavior, focus flow, accessible names, and screen-reader output where relevant.

62

Quality

73%

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 ./skills/scrolljacking/SKILL.md
SKILL.md
Quality
Evals
Security

Quality

Content

63%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.

The body is well-structured with a clean Check/Fix/Explain/Code Review flow and exemplary reference hygiene (one real, clearly signaled reference file). It is held back by verbatim duplication of the accessibility-impact rationale and by check guidance that says what to verify but not how to detect or verify it concretely.

Suggestions

Deduplicate the accessibility-impact rationale: the 'Explain' section repeats the opening paragraph nearly verbatim and 'Quick Reference' restates it again — keep one canonical statement.

Add concrete detection guidance to 'Check', e.g. search rendered JS for wheel/touchmove/scroll listeners that call preventDefault(), and check CSS scroll-behavior/overscroll-behavior overrides.

Replace the vague 'browser accessibility tooling' in 'Code Review' with named verification steps (e.g. keyboard-only scroll pass, prefers-reduced-motion emulation in devtools, a screen-reader smoke test).

DimensionReasoningScore

Conciseness

The "Explain" section ("Explain how scrolljacking disrupts expected navigation patterns, interferes with assistive technologies, and creates unpredictable experiences for users with motor impairments or cognitive disabilities") repeats the opening paragraph nearly verbatim, and "Quick Reference" restates "Scrolljacking breaks assistive technologies and user expectations" already covered in the intro. Mostly efficient overall, but this duplication could be trimmed — below anchor 4's minor-trimming level, well above anchor 2's padded verbosity.

3 / 5

Actionability

Some concrete direction exists — "Check that scroll speed is not modified, scroll direction is not inverted, and scroll events are not hijacked" and "respect prefers-reduced-motion" — but the how is missing: no detection technique (e.g. searching for wheel/touchmove listeners calling preventDefault, or overscroll-behavior/scroll-behavior CSS), no commands, and no verification steps; the executable detail is entirely deferred to references/rule.md. This matches anchor 3's 'concrete guidance but incomplete, missing key details' rather than anchor 4's mostly-executable guidance.

3 / 5

Workflow Clarity

A clear Check → Fix → Explain → Code Review sequence with a verification checkpoint present ("note how to verify the fix with browser accessibility tooling or assistive tech"). Not 5 because the verification step is named but not concretely specified and "verify it feels native" is subjective; not 3 because the sequence is coherent and a fix-verification checkpoint is explicitly included.

4 / 5

Progressive Disclosure

A short (~30 line) body with well-organized sections and a single, clearly signaled one-level-deep reference — "For full implementation details, code examples, and framework-specific guidance, see `references/rule.md`" — and that file exists and indeed contains the implementation detail (bad-pattern code examples, definitions table). Content split between overview and reference is appropriate for a simple skill.

5 / 5

Total

15

/

20

Passed

Description

83%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 strong description with an explicit 'Use when' trigger clause, a clear what/when pairing, and mostly natural trigger terms. Main weaknesses are a small gap in coverage (no statement of what the review produces) and trigger phrasing that leans on the rule title rather than user-natural synonyms.

DimensionReasoningScore

Specificity

Lists several concrete review actions — "Check native semantics first, then inspect keyboard behavior, focus flow, accessible names, and screen-reader output" — alongside the domain. Not 5 because coverage stops at inspection; what the skill produces (flagging violations, remediation guidance) is unstated, and the mid-sentence title reference "related to Avoid scrolljacking and custom scroll behavior" muddies the action statement. Clearly above anchor 3, which expects only 1-2 concrete actions.

4 / 5

Completeness

Explicitly answers both questions: when via "Use when reviewing rendered HTML, interactive components, or design-system patterns related to Avoid scrolljacking and custom scroll behavior" and what via the concrete check-then-inspect action sequence. The 'when' clause is explicit with concrete trigger contexts, matching the top anchor rather than the anchor-4 case where the 'when' is present but could be more specific.

5 / 5

Trigger Term Quality

Natural trigger terms include "scrolljacking", "custom scroll behavior", "rendered HTML", "interactive components", and "design-system patterns" — phrasings a user reviewing a page would plausibly say. Not 5 because common synonyms like the two-word "scroll hijacking", "parallax", "smooth scrolling", or "wheel events" are absent; not 3 since coverage is good rather than partial.

4 / 5

Distinctiveness Conflict Risk

The "scrolljacking" / "custom scroll behavior" niche is distinct, but generic a11y-review triggers like "keyboard behavior, focus flow, accessible names, and screen-reader output" and "design-system patterns" overlap with sibling accessibility review skills. Not 5 because those shared generic phrases could match other a11y rules; not 3 because the scroll-specific anchor term keeps the skill mostly distinguishable.

4 / 5

Total

17

/

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

metadata_version

'metadata.version' is missing

Warning

Total

15

/

16

Passed

Repository
thedaviddias/Front-End-Checklist
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.