Salesforce Lwc

---
name: salesforce-lwc
description: "Router for the 83 SfSkills `lwc` skill packages. Lightning Web Components: reactivity, wire adapters, component communication, accessibility, performance, security and Jest testing. Use when the request mentions LWC, Lightning Web Component, wire, @api, @track, lightning-record-form, shadow DOM, Jest, Lightning Message Service, Aura migration, Lightning page. Finds and opens the exact skill package to read; it does not contain the guidance itself."
---

# Salesforce lwc — SfSkills domain router

Lightning Web Components: reactivity, wire adapters, component communication, accessibility, performance, security and Jest testing.

**83 skill packages** live under
`${CLAUDE_PLUGIN_ROOT}/skills/lwc/<slug>/SKILL.md`. They are not
loaded — reach them by path, on demand.

**Generated by `scripts/build_plugin.py`. Do not hand-edit.**

## How to find the right skill

Three mechanisms, listed in order of reliability on a fresh install.
Use the first one that is available; do not stop at a guess.

**1. The shipped roster (always works, no setup).**
Read `references/skill-index.md` next to this file. It lists every
`lwc` skill package with a one-line gloss, generated from
`registry/skills.json`. Scan it and pick by name.

**2. The MCP server (fast, needs the `sfskills-mcp` server connected).**
Call the `search_skill` tool with the user's phrasing and `domain: "lwc"`. It returns
ranked skill ids. `get_skill` then returns the package contents.

**3. The search CLI (fast, needs a locally built index).**

```bash
python3 "${CLAUDE_PLUGIN_ROOT}/scripts/search_knowledge.py" "<the user's question>" --domain lwc --json
```

This needs `vector_index/`, which is **not shipped** — it is gitignored
and must be built once per clone:

```bash
cd "${CLAUDE_PLUGIN_ROOT}" && python3 -m pip install -r requirements.txt && python3 scripts/build_index.py
```

If the command errors or reports `Coverage: NONE`, fall back to
mechanism 1 rather than telling the user the topic is uncovered.

**Then read the package.** Open the exact
`${CLAUDE_PLUGIN_ROOT}/skills/<domain>/<slug>/SKILL.md` the lookup
returned, plus its `references/gotchas.md` and
`references/llm-anti-patterns.md`. Do not answer from this router:
it is a map, not the territory.

## Featured entry points

Curated starting points when the request is broad or the lookup is
ambiguous. This is a shortlist, not the catalogue — the roster at
`references/skill-index.md` has all 83.

- `${CLAUDE_PLUGIN_ROOT}/skills/lwc/component-communication/SKILL.md` — parent/child, events, and when to reach for Lightning Message Service
- `${CLAUDE_PLUGIN_ROOT}/skills/lwc/wire-service-patterns/SKILL.md` — @wire, reactive parameters, and refreshing cached data
- `${CLAUDE_PLUGIN_ROOT}/skills/lwc/lifecycle-hooks/SKILL.md` — connected/rendered/disconnected and the work that belongs in each
- `${CLAUDE_PLUGIN_ROOT}/skills/lwc/lwc-performance/SKILL.md` — render cost, wasted reactivity, and the LWC side of a slow page
- `${CLAUDE_PLUGIN_ROOT}/skills/lwc/lwc-security/SKILL.md` — Lightning Web Security, sanitisation, and safe use of API data
- `${CLAUDE_PLUGIN_ROOT}/skills/lwc/lwc-accessibility/SKILL.md` — keyboard, focus and screen-reader behaviour as acceptance criteria
- `${CLAUDE_PLUGIN_ROOT}/skills/lwc/lwc-testing/SKILL.md` — Jest setup, mocking wire adapters, and asserting rendered output
- `${CLAUDE_PLUGIN_ROOT}/skills/lwc/lwc-error-boundaries/SKILL.md` — containing a component failure instead of blanking the page

## Decision trees

Read the tree *before* activating a skill when the request could be
solved more than one way, and cite the branch that decided it.

- `${CLAUDE_PLUGIN_ROOT}/standards/decision-trees/performance-tuning.md` — the LWC render branch, for any "the page is slow" report

## Canonical templates

Do not hand-roll an idiom that already exists. Copy from
`${CLAUDE_PLUGIN_ROOT}/templates/lwc/` and rename in the consuming
project; never edit the template in place.

- `${CLAUDE_PLUGIN_ROOT}/templates/lwc/jest.config.js`
- `${CLAUDE_PLUGIN_ROOT}/templates/lwc/component-skeleton`
- `${CLAUDE_PLUGIN_ROOT}/templates/lwc/patterns`
- `${CLAUDE_PLUGIN_ROOT}/templates/lwc/README.md` — the full list

## Run-time agents for this domain

Invoke one of these subagents when the ask is a whole workflow
rather than a single question:

- `lwc-auditor` — Accessibility + performance + security audit of an LWC bundle
- `lwc-builder` — Generate a Lightning Web Component bundle
- `lwc-debugger` — Diagnose a live LWC failure

## Rules

1. Answer from the opened `lwc` package, never from this router.
2. Cite the skill id and, where one applied, the decision-tree branch.
3. Never claim a topic is uncovered without pasting lookup output.
4. Never deploy to an org.