[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"skill:01M6KB1GREYMCFFPA4FWZZEGVG":3,"skill-same:01M6KB1GREYMCFFPA4FWZZEGVG":74},{"skillNo":4,"name":5,"nameZh":6,"description":7,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":16,"categories":17,"keywords":23,"publishedAt":41,"linkOnly":42,"markdownContent":43,"markdownBody":44,"frontMatter":45,"refName":46,"commitSha":47,"skillDirectory":48,"forksCount":49,"repositoryHtmlUrl":50,"repositoryHomepageUrl":6,"ownerHtmlUrl":51,"ownerBlogUrl":52,"ownerDescription":6,"updatedAt":53,"install":54,"resources":67},"01M6KB1GREYMCFFPA4FWZZEGVG","generate",null,"Generate Playwright tests. Use when user says \"write tests\", \"generate tests\", \"add tests for\", \"test this component\", \"e2e test\", \"create test for\", \"test this page\", or \"test this feature\".","afaizalam2003\u002FMaster-claude-skill","afaizalam2003","https:\u002F\u002Favatars.githubusercontent.com\u002Fu\u002F222019359?v=4","01M6K8F2XNT0HKBPF00JQ78SV3","Faiz Alam","01M6K8F31EBXAPER0EG8R9HTR5",3,"MIT","https:\u002F\u002Fgithub.com\u002Fafaizalam2003\u002FMaster-claude-skill\u002Fblob\u002Fmain\u002Fengineering-team\u002Fplaywright-pro\u002Fskills\u002Fgenerate\u002FSKILL.md",[18],{"categoryNo":19,"categoryName":20,"taxonomyType":21,"taxonomyTypeDesc":22},"01JBSEEDCAT000000000000008","测试与质量","SCENARIO","使用场景",[5,24,25,26,27,28,29,30,31,32,33,34,35,36,37,38,39,40],"user","create test","for","add","feature","tests","e2e test","generate tests","use","playwright","write","page","e2e","create","write tests","component","test","2026-11-10 10:12:30",false,"---\nname: \"generate\"\ndescription: >-\n  Generate Playwright tests. Use when user says \"write tests\", \"generate tests\",\n  \"add tests for\", \"test this component\", \"e2e test\", \"create test for\",\n  \"test this page\", or \"test this feature\".\n---\n\n# Generate Playwright Tests\n\nGenerate production-ready Playwright tests from a user story, URL, component name, or feature description.\n\n## Input\n\n`$ARGUMENTS` contains what to test. Examples:\n- `\"user can log in with email and password\"`\n- `\"the checkout flow\"`\n- `\"src\u002Fcomponents\u002FUserProfile.tsx\"`\n- `\"the search page with filters\"`\n\n## Steps\n\n### 1. Understand the Target\n\nParse `$ARGUMENTS` to determine:\n- **User story**: Extract the behavior to verify\n- **Component path**: Read the component source code\n- **Page\u002FURL**: Identify the route and its elements\n- **Feature name**: Map to relevant app areas\n\n### 2. Explore the Codebase\n\nUse the `Explore` subagent to gather context:\n\n- Read `playwright.config.ts` for `testDir`, `baseURL`, `projects`\n- Check existing tests in `testDir` for patterns, fixtures, and conventions\n- If a component path is given, read the component to understand its props, states, and interactions\n- Check for existing page objects in `pages\u002F`\n- Check for existing fixtures in `fixtures\u002F`\n- Check for auth setup (`auth.setup.ts` or `storageState` config)\n\n### 3. Select Templates\n\nCheck `templates\u002F` in this plugin for matching patterns:\n\n| If testing... | Load template from |\n|---|---|\n| Login\u002Fauth flow | `templates\u002Fauth\u002Flogin.md` |\n| CRUD operations | `templates\u002Fcrud\u002F` |\n| Checkout\u002Fpayment | `templates\u002Fcheckout\u002F` |\n| Search\u002Ffilter UI | `templates\u002Fsearch\u002F` |\n| Form submission | `templates\u002Fforms\u002F` |\n| Dashboard\u002Fdata | `templates\u002Fdashboard\u002F` |\n| Settings page | `templates\u002Fsettings\u002F` |\n| Onboarding flow | `templates\u002Fonboarding\u002F` |\n| API endpoints | `templates\u002Fapi\u002F` |\n| Accessibility | `templates\u002Faccessibility\u002F` |\n\nAdapt the template to the specific app — replace `{{placeholders}}` with actual selectors, URLs, and data.\n\n### 4. Generate the Test\n\nFollow these rules:\n\n**Structure:**\n```typescript\nimport { test, expect } from '@playwright\u002Ftest';\n\u002F\u002F Import custom fixtures if the project uses them\n\ntest.describe('Feature Name', () => {\n  \u002F\u002F Group related behaviors\n\n  test('should \u003Cexpected behavior>', async ({ page }) => {\n    \u002F\u002F Arrange: navigate, set up state\n    \u002F\u002F Act: perform user action\n    \u002F\u002F Assert: verify outcome\n  });\n});\n```\n\n**Locator priority** (use the first that works):\n1. `getByRole()` — buttons, links, headings, form elements\n2. `getByLabel()` — form fields with labels\n3. `getByText()` — non-interactive text content\n4. `getByPlaceholder()` — inputs with placeholder text\n5. `getByTestId()` — when semantic options aren't available\n\n**Assertions** — always web-first:\n```typescript\n\u002F\u002F GOOD — auto-retries\nawait expect(page.getByRole('heading')).toBeVisible();\nawait expect(page.getByRole('alert')).toHaveText('Success');\n\n\u002F\u002F BAD — no retry\nconst text = await page.textContent('.msg');\nexpect(text).toBe('Success');\n```\n\n**Never use:**\n- `page.waitForTimeout()`\n- `page.$(selector)` or `page.$$(selector)`\n- Bare CSS selectors unless absolutely necessary\n- `page.evaluate()` for things locators can do\n\n**Always include:**\n- Descriptive test names that explain the behavior\n- Error\u002Fedge case tests alongside happy path\n- Proper `await` on every Playwright call\n- `baseURL`-relative navigation (`page.goto('\u002F')` not `page.goto('http:\u002F\u002F...')`)\n\n### 5. Match Project Conventions\n\n- If project uses TypeScript → generate `.spec.ts`\n- If project uses JavaScript → generate `.spec.js` with `require()` imports\n- If project has page objects → use them instead of inline locators\n- If project has custom fixtures → import and use them\n- If project has a test data directory → create test data files there\n\n### 6. Generate Supporting Files (If Needed)\n\n- **Page object**: If the test touches 5+ unique locators on one page, create a page object\n- **Fixture**: If the test needs shared setup (auth, data), create or extend a fixture\n- **Test data**: If the test uses structured data, create a JSON file in `test-data\u002F`\n\n### 7. Verify\n\nRun the generated test:\n\n```bash\nnpx playwright test \u003Cgenerated-file> --reporter=list\n```\n\nIf it fails:\n1. Read the error\n2. Fix the test (not the app)\n3. Run again\n4. If it's an app issue, report it to the user\n\n## Output\n\n- Generated test file(s) with path\n- Any supporting files created (page objects, fixtures, data)\n- Test run result\n- Coverage note: what behaviors are now tested\n","# Generate Playwright Tests\n\nGenerate production-ready Playwright tests from a user story, URL, component name, or feature description.\n\n## Input\n\n`$ARGUMENTS` contains what to test. Examples:\n- `\"user can log in with email and password\"`\n- `\"the checkout flow\"`\n- `\"src\u002Fcomponents\u002FUserProfile.tsx\"`\n- `\"the search page with filters\"`\n\n## Steps\n\n### 1. Understand the Target\n\nParse `$ARGUMENTS` to determine:\n- **User story**: Extract the behavior to verify\n- **Component path**: Read the component source code\n- **Page\u002FURL**: Identify the route and its elements\n- **Feature name**: Map to relevant app areas\n\n### 2. Explore the Codebase\n\nUse the `Explore` subagent to gather context:\n\n- Read `playwright.config.ts` for `testDir`, `baseURL`, `projects`\n- Check existing tests in `testDir` for patterns, fixtures, and conventions\n- If a component path is given, read the component to understand its props, states, and interactions\n- Check for existing page objects in `pages\u002F`\n- Check for existing fixtures in `fixtures\u002F`\n- Check for auth setup (`auth.setup.ts` or `storageState` config)\n\n### 3. Select Templates\n\nCheck `templates\u002F` in this plugin for matching patterns:\n\n| If testing... | Load template from |\n|---|---|\n| Login\u002Fauth flow | `templates\u002Fauth\u002Flogin.md` |\n| CRUD operations | `templates\u002Fcrud\u002F` |\n| Checkout\u002Fpayment | `templates\u002Fcheckout\u002F` |\n| Search\u002Ffilter UI | `templates\u002Fsearch\u002F` |\n| Form submission | `templates\u002Fforms\u002F` |\n| Dashboard\u002Fdata | `templates\u002Fdashboard\u002F` |\n| Settings page | `templates\u002Fsettings\u002F` |\n| Onboarding flow | `templates\u002Fonboarding\u002F` |\n| API endpoints | `templates\u002Fapi\u002F` |\n| Accessibility | `templates\u002Faccessibility\u002F` |\n\nAdapt the template to the specific app — replace `{{placeholders}}` with actual selectors, URLs, and data.\n\n### 4. Generate the Test\n\nFollow these rules:\n\n**Structure:**\n```typescript\nimport { test, expect } from '@playwright\u002Ftest';\n\u002F\u002F Import custom fixtures if the project uses them\n\ntest.describe('Feature Name', () => {\n  \u002F\u002F Group related behaviors\n\n  test('should \u003Cexpected behavior>', async ({ page }) => {\n    \u002F\u002F Arrange: navigate, set up state\n    \u002F\u002F Act: perform user action\n    \u002F\u002F Assert: verify outcome\n  });\n});\n```\n\n**Locator priority** (use the first that works):\n1. `getByRole()` — buttons, links, headings, form elements\n2. `getByLabel()` — form fields with labels\n3. `getByText()` — non-interactive text content\n4. `getByPlaceholder()` — inputs with placeholder text\n5. `getByTestId()` — when semantic options aren't available\n\n**Assertions** — always web-first:\n```typescript\n\u002F\u002F GOOD — auto-retries\nawait expect(page.getByRole('heading')).toBeVisible();\nawait expect(page.getByRole('alert')).toHaveText('Success');\n\n\u002F\u002F BAD — no retry\nconst text = await page.textContent('.msg');\nexpect(text).toBe('Success');\n```\n\n**Never use:**\n- `page.waitForTimeout()`\n- `page.$(selector)` or `page.$$(selector)`\n- Bare CSS selectors unless absolutely necessary\n- `page.evaluate()` for things locators can do\n\n**Always include:**\n- Descriptive test names that explain the behavior\n- Error\u002Fedge case tests alongside happy path\n- Proper `await` on every Playwright call\n- `baseURL`-relative navigation (`page.goto('\u002F')` not `page.goto('http:\u002F\u002F...')`)\n\n### 5. Match Project Conventions\n\n- If project uses TypeScript → generate `.spec.ts`\n- If project uses JavaScript → generate `.spec.js` with `require()` imports\n- If project has page objects → use them instead of inline locators\n- If project has custom fixtures → import and use them\n- If project has a test data directory → create test data files there\n\n### 6. Generate Supporting Files (If Needed)\n\n- **Page object**: If the test touches 5+ unique locators on one page, create a page object\n- **Fixture**: If the test needs shared setup (auth, data), create or extend a fixture\n- **Test data**: If the test uses structured data, create a JSON file in `test-data\u002F`\n\n### 7. Verify\n\nRun the generated test:\n\n```bash\nnpx playwright test \u003Cgenerated-file> --reporter=list\n```\n\nIf it fails:\n1. Read the error\n2. Fix the test (not the app)\n3. Run again\n4. If it's an app issue, report it to the user\n\n## Output\n\n- Generated test file(s) with path\n- Any supporting files created (page objects, fixtures, data)\n- Test run result\n- Coverage note: what behaviors are now tested\n",{"name":5,"description":7},"main","0b48cbb0e6d5be6ff68c0f6b28bc0c65ee21c4a1","engineering-team\u002Fplaywright-pro\u002Fskills\u002Fgenerate",2,"https:\u002F\u002Fgithub.com\u002Fafaizalam2003\u002FMaster-claude-skill","https:\u002F\u002Fgithub.com\u002Fafaizalam2003","https:\u002F\u002Fwww.linkedin.com\u002Fin\u002Fmdfaizalam2003\u002F","2026-04-01 04:35:43",{"source":8,"skillName":5,"commands":55,"prompt":65,"zipAvailable":66},[56,59,62],{"tool":57,"command":58},"npx","npx skills add afaizalam2003\u002FMaster-claude-skill --skill generate",{"tool":60,"command":61},"bunx","bunx skills add afaizalam2003\u002FMaster-claude-skill --skill generate",{"tool":63,"command":64},"pnpm","pnpm dlx skills add afaizalam2003\u002FMaster-claude-skill --skill generate","安装技能，技能地址：https:\u002F\u002Fgithub.com\u002Fafaizalam2003\u002FMaster-claude-skill\u002Fblob\u002Fmain\u002Fengineering-team\u002Fplaywright-pro\u002Fskills\u002Fgenerate\u002FSKILL.md",true,[68],{"path":69,"resourceType":70,"resourceTypeDesc":71,"sizeBytes":72,"sourceHtmlUrl":73},"patterns.md","REFERENCE","参考文档",5848,"https:\u002F\u002Fgithub.com\u002Fafaizalam2003\u002FMaster-claude-skill\u002Fblob\u002Fmain\u002Fengineering-team\u002Fplaywright-pro\u002Fskills\u002Fgenerate\u002Fpatterns.md",[75,105,130,154,184,204],{"skillNo":76,"name":77,"nameZh":6,"description":78,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":79,"categories":80,"keywords":86,"publishedAt":41},"01M6KC4E8MYR9DBAZTAXHKYMMH","soc2-compliance","Use when the user asks to prepare for SOC 2 audits, map Trust Service Criteria, build control matrices, collect audit evidence, perform gap analysis, or assess SOC 2 Type I vs Type II readiness.","https:\u002F\u002Fgithub.com\u002Fafaizalam2003\u002FMaster-claude-skill\u002Fblob\u002Fmain\u002Fra-qm-team\u002Fsoc2-compliance\u002FSKILL.md",[81],{"categoryNo":82,"categoryName":83,"taxonomyType":84,"taxonomyTypeDesc":85},"01JBSEEDCAT000000000000037","律师与法务","PROFESSION","适用职业",[87,88,89,90,91,92,93,94,32,95,96,97,98,99,100,101,102,103,104,26],"compliance","soc2","soc2 compliance","audit evidence","audit","collect","soc","analysis","evidence","trust","build","map","control","type","gap","readiness","gap analysis","assess",{"skillNo":106,"name":107,"nameZh":6,"description":108,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":109,"categories":110,"keywords":111,"publishedAt":41},"01M6KC461R3GKGZ1TAYHVR1MW9","risk-management-specialist","Medical device risk management specialist implementing ISO 14971 throughout product lifecycle. Provides risk analysis, risk evaluation, risk control, and post-production information analysis. Use when user mentions risk management, ISO 14971, risk analysis, FMEA, fault tree analysis, hazard identification, risk control, risk matrix, benefit-risk analysis, residual risk, risk acceptability, or post-market risk.","https:\u002F\u002Fgithub.com\u002Fafaizalam2003\u002FMaster-claude-skill\u002Fblob\u002Fmain\u002Fra-qm-team\u002Frisk-management-specialist\u002FSKILL.md",[],[112,113,114,115,116,117,118,119,94,32,120,121,122,123,124,125,126,127,128,129],"risk","risk management specialist","management","risk management","risk evaluation","product","Evaluation","lifecycle","risk matrix","iso","medical","iso 14971","identification","information","post-production","tree","matrix","implementing",{"skillNo":131,"name":132,"nameZh":6,"description":133,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":134,"categories":135,"keywords":136,"publishedAt":41},"01M6KC3HF5ZFSSP2NZF68PEPFB","regulatory-affairs-head","Senior Regulatory Affairs Manager for HealthTech and MedTech companies. Prepares FDA 510(k), De Novo, and PMA submission packages; analyzes regulatory pathways for new medical devices; drafts responses to FDA deficiency letters and Notified Body queries; develops CE marking technical documentation under EU MDR 2017\u002F745; coordinates multi-market approval strategies across FDA, EU, Health Canada, PMDA, and NMPA; and maintains regulatory intelligence on evolving standards. Use when users need to plan or execute FDA submissions, navigate 510(k) or PMA approval processes, achieve CE marking, prepare pre-submission meeting materials, write regulatory strategy documents, respond to agency queries, or manage compliance documentation for medical device market access.","https:\u002F\u002Fgithub.com\u002Fafaizalam2003\u002FMaster-claude-skill\u002Fblob\u002Fmain\u002Fra-qm-team\u002Fregulatory-affairs-head\u002FSKILL.md",[],[137,138,139,140,141,142,143,34,144,32,145,146,147,148,149,150,151,152,153,26],"regulatory affairs head","regulatory","head","documents","devices","health","plan","strategy","standards","queries","manage","strategies","de","users","respond","medical devices","manager",{"skillNo":155,"name":156,"nameZh":6,"description":157,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":158,"categories":159,"keywords":166,"publishedAt":41},"01M6KC34Z8M1559EY1CXYBJB1A","quality-manager-qms-iso13485","ISO 13485 Quality Management System implementation and maintenance for medical device organizations. Provides QMS design, documentation control, internal auditing, CAPA management, and certification support. Use when working with medical device quality systems, preparing for ISO 13485 audits, managing regulatory compliance documentation, setting up corrective actions, or building audit preparation programs. Useful for quality management, audit preparation, regulatory compliance, medical device documentation, and corrective action workflows.","https:\u002F\u002Fgithub.com\u002Fafaizalam2003\u002FMaster-claude-skill\u002Fblob\u002Fmain\u002Fra-qm-team\u002Fquality-manager-qms-iso13485\u002FSKILL.md",[160,163],{"categoryNo":161,"categoryName":162,"taxonomyType":21,"taxonomyTypeDesc":22},"01JBSEEDCAT000000000000015","视觉设计",{"categoryNo":164,"categoryName":165,"taxonomyType":84,"taxonomyTypeDesc":85},"01JBSEEDCAT000000000000032","设计师",[167,168,153,169,170,171,172,173,174,32,175,176,177,178,179,180,181,182,26,183],"quality manager qms iso13485","quality","design","workflows","validation","actions","certification","system","maintenance","document","systems","records","ISO 13485","organizations","corrective action","internal audit","preparation",{"skillNo":185,"name":186,"nameZh":6,"description":187,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":188,"categories":189,"keywords":191,"publishedAt":41},"01M6KC2FXHBHXYX2ZZ17Y3GDB4","quality-manager-qmr","Senior Quality Manager Responsible Person (QMR) for HealthTech and MedTech companies. Provides quality system governance, management review leadership, regulatory compliance oversight, and quality performance monitoring per ISO 13485 Clause 5.5.2.","https:\u002F\u002Fgithub.com\u002Fafaizalam2003\u002FMaster-claude-skill\u002Fblob\u002Fmain\u002Fra-qm-team\u002Fquality-manager-qmr\u002FSKILL.md",[190],{"categoryNo":82,"categoryName":83,"taxonomyType":84,"taxonomyTypeDesc":85},[192,168,153,193,194,195,196,197,87,198,174,199,138,200,201,202,121,179,26,203],"quality manager qmr","review","policy","performance","governance","monitoring","regulatory compliance","oversight","cost","culture","leadership","person",{"skillNo":205,"name":206,"nameZh":6,"description":207,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":208,"categories":209,"keywords":217,"publishedAt":41},"01M6KC1VRR5JTDBNZANHPS6VR6","quality-documentation-manager","Document control system management for medical device QMS. Covers document numbering, version control, change management, and 21 CFR Part 11 compliance. Use for document control procedures, change control workflow, document numbering, version management, electronic signature compliance, or regulatory documentation review.","https:\u002F\u002Fgithub.com\u002Fafaizalam2003\u002FMaster-claude-skill\u002Fblob\u002Fmain\u002Fra-qm-team\u002Fquality-documentation-manager\u002FSKILL.md",[210,213,216],{"categoryNo":211,"categoryName":212,"taxonomyType":21,"taxonomyTypeDesc":22},"01JBSEEDCAT000000000000002","文档处理",{"categoryNo":214,"categoryName":215,"taxonomyType":21,"taxonomyTypeDesc":22},"01JBSEEDCAT000000000000023","Skill与智能体开发",{"categoryNo":82,"categoryName":83,"taxonomyType":84,"taxonomyTypeDesc":85},[218,219,168,153,193,220,221,91,174,222,223,224,225,226,122,227,228,229,230,26],"documentation","quality documentation manager","workflow","change","change management","list","master","system management","documentation review","cfr","21 cfr part 11","change control","retention"]