How do I install the Verify skill?

Run npx skillmds@latest add ng-select/verify in your terminal (requires Node.js), paste this page's agent-chat prompt into Claude, Cursor, or any MCP-connected agent, or download the SKILL.md file and copy it into your agent's skills directory.

Is Verify safe to use?

This skill has not completed SkillMD's automated safety review yet. Independent scanners report: SkillSpector: PASS, Skill Scanner: PASS. Capability flags: makes network calls. SkillMD never runs a skill's scripts for you; review the SKILL.md before installing.

Which AI agents work with Verify?

This skill is tagged as working with Claude Code, Claude.ai, OpenAI Codex. SKILL.md is an open format, so most agents that read a skills directory can load it too.

Is Verify free to use?

Yes. Installing skills from SkillMD is free, and the skill stays under its author's original license.

Who published Verify?

ng-select (@ng-select) published this skill. Their other Agent Skills are listed on their SkillMD profile.

Verify by ng-select — Agent Skill

Name: Verify
Rating: 4.666666666666667 (3 reviews)
Author: ng-select

File contents

Verifying ng-select changes

Launch the demo app

Use the Browser pane, never Bash: preview_start {name: "demo"} (config in .claude/launch.json, pnpm ng serve). If port 4300 is taken by another session, autoPort: true lets it pick a free port.

Demo routes are hash-based: http://localhost:<port>/#/forms, #/data-sources, etc. (see src/demo/app/routes.ts).

Drive component behaviors

Theme switcher and LTR/RTL toggle are dropdowns in the demo header. Material theme is required for appearance="outline" / appearance="fill" styling.
When changing styles, verify all three themes (default, material, ant) via the switcher — theme class names are part of the public styling contract (AGENTS.md).
Outline-appearance selects live on #/forms ("Reactive form using ng-option" example).
To test on a non-white background: javascript_tool → document.body.style.background = '#263238' and clear card backgrounds.

Gotchas

Theme resets to default on full page reload (component state, not persisted) — re-select Material after any force reload before judging appearance styles.
Opening a select programmatically: dispatch keydown Space on the ng-select host element (new KeyboardEvent('keydown', {keyCode: 32, ...})). Synthetic mousedown on the container is unreliable, and coordinate clicks fight scroll jumps.
Demo RTL does not exercise theme RTL rules. The demo nests themes under :host.<x>-theme ::ng-deep (app.component.scss) and puts dir on an inner div, so the themes' @include rtl rules ([dir='rtl'] … at root) never match in the demo. To verify RTL as real consumers see it, set document.documentElement.dir = 'rtl' via javascript_tool.
Unit tests run in Vitest browser mode — real headless Chromium via @vitest/browser-playwright (wired through @angular/build:unit-test + root vitest.config.ts), not jsdom — layout measurement (offsetWidth etc.) works in specs.
Failed specs save screenshots to src/ng-select/lib/__screenshots__/ — read them when diagnosing a browser-mode test failure.

Pipeline (Definition of Done, AGENTS.md)

pnpm lint
pnpm exec ng test ng-select --watch=false   # fast: ng-select only
pnpm test:ci                                # full: both libraries + coverage (what CI runs)
pnpm run build
pnpm exec prettier --check <changed files>  # or: pnpm format:check (whole repo)

---name: verifydescription: Use when verifying an ng-select change at runtime — launching the demo app, driving a component behavior in the browser, or running the repo's test/lint/build pipeline before claiming a change works.---# Verifying ng-select changes## Launch the demo appUse the Browser pane, never Bash: `preview_start {name: "demo"}` (config in `.claude/launch.json`, pnpm ng serve). If port 4300 is taken by another session, `autoPort: true` lets it pick a free port.Demo routes are hash-based: `http://localhost:<port>/#/forms`, `#/data-sources`, etc. (see `src/demo/app/routes.ts`).## Drive component behaviors- Theme switcher and LTR/RTL toggle are dropdowns in the demo header. Material theme is required for `appearance="outline"` / `appearance="fill"` styling.- When changing styles, verify all three themes (`default`, `material`, `ant`) via the switcher — theme class names are part of the public styling contract (AGENTS.md).- Outline-appearance selects live on `#/forms` ("Reactive form using ng-option" example).- To test on a non-white background: `javascript_tool` → `document.body.style.background = '#263238'` and clear card backgrounds.## Gotchas- **Theme resets to `default` on full page reload** (component state, not persisted) — re-select Material after any force reload before judging appearance styles.- **Opening a select programmatically:** dispatch `keydown` Space on the `ng-select` host element (`new KeyboardEvent('keydown', {keyCode: 32, ...})`). Synthetic `mousedown` on the container is unreliable, and coordinate clicks fight scroll jumps.- **Demo RTL does not exercise theme RTL rules.** The demo nests themes under `:host.<x>-theme ::ng-deep` (app.component.scss) and puts `dir` on an inner div, so the themes' `@include rtl` rules (`[dir='rtl'] …` at root) never match in the demo. To verify RTL as real consumers see it, set `document.documentElement.dir = 'rtl'` via javascript_tool.- Unit tests run in **Vitest browser mode** — real headless Chromium via `@vitest/browser-playwright` (wired through `@angular/build:unit-test` + root `vitest.config.ts`), not jsdom — layout measurement (`offsetWidth` etc.) works in specs.- **Failed specs save screenshots** to `src/ng-select/lib/__screenshots__/` — read them when diagnosing a browser-mode test failure.## Pipeline (Definition of Done, AGENTS.md)```bashpnpm lintpnpm exec ng test ng-select --watch=false # fast: ng-select onlypnpm test:ci # full: both libraries + coverage (what CI runs)pnpm run buildpnpm exec prettier --check <changed files> # or: pnpm format:check (whole repo)```

Frequently asked questions

Verify