[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"skill:01M73FD171R5GS2GXQ8KTN5CWT":3,"skill-same:01M73FD171R5GS2GXQ8KTN5CWT":49},{"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":18,"publishedAt":19,"linkOnly":20,"markdownContent":21,"markdownBody":22,"frontMatter":23,"refName":25,"commitSha":26,"skillDirectory":27,"forksCount":28,"repositoryHtmlUrl":29,"repositoryHomepageUrl":30,"ownerHtmlUrl":31,"ownerBlogUrl":32,"ownerDescription":33,"updatedAt":34,"install":35,"resources":48},"01M73FD171R5GS2GXQ8KTN5CWT","react-testing",null,"React component testing with React Testing Library + Vitest\u002FJest + MSW network mocking + axe accessibility assertions. Covers unit, integration, and component vs E2E decision boundary.","Horonomos-laps\u002FYana-AI","Horonomos-laps","https:\u002F\u002Favatars.githubusercontent.com\u002Fu\u002F355299122?v=4","01M76B3QPXE88ET2SQPDPVATZT"," Horonomos-laps","01M72ZQRJPCYPSSWT4D00VJR2A",13,"MIT","https:\u002F\u002Fgithub.com\u002FHoronomos-laps\u002FYana-AI\u002Fblob\u002Fmain\u002Fcore\u002Fskills\u002Freact-testing\u002FSKILL.md",[],[],"2026-11-11 15:11:14",false,"---\nname: react-testing\ndescription: React component testing with React Testing Library + Vitest\u002FJest + MSW network mocking + axe accessibility assertions. Covers unit, integration, and component vs E2E decision boundary.\nlicense: MIT\nsource: https:\u002F\u002Fgithub.com\u002Faffaan-m\u002FECC\n---\n\n# React Testing\n\nTest behavior, not implementation. Query by role\u002Flabel, not CSS or test-id.\n\n**Trigger phrases:** \"test React component\", \"RTL\", \"React Testing Library\", \"write tests for component\", \"MSW mock\", \"accessibility test\"\n\n---\n\n## Core Principle\n\n```tsx\n\u002F\u002F ✅ Query as users perceive\nconst button = screen.getByRole('button', { name: \u002Fsubmit\u002Fi })\nconst input  = screen.getByLabelText('Email address')\n\n\u002F\u002F ❌ Implementation details\nscreen.getByClassName('btn-primary')\nscreen.getByTestId('submit-btn')\n```\n\n---\n\n## Component Test Template\n\n```tsx\nimport { render, screen } from '@testing-library\u002Freact'\nimport userEvent from '@testing-library\u002Fuser-event'\n\ndescribe('LoginForm', () => {\n  it('calls onSubmit with credentials', async () => {\n    const onSubmit = vi.fn()\n    render(\u003CLoginForm onSubmit={onSubmit} \u002F>)\n\n    await userEvent.type(screen.getByLabelText('Email'), 'a@b.com')\n    await userEvent.type(screen.getByLabelText('Password'), 'secret')\n    await userEvent.click(screen.getByRole('button', { name: \u002Fsign in\u002Fi }))\n\n    expect(onSubmit).toHaveBeenCalledWith({ email: 'a@b.com', password: 'secret' })\n  })\n})\n```\n\n---\n\n## MSW Network Mocking\n\n```ts\nimport { http, HttpResponse } from 'msw'\nimport { setupServer } from 'msw\u002Fnode'\n\nconst server = setupServer(\n  http.get('\u002Fapi\u002Fusers', () => HttpResponse.json([{ id: 1, name: 'Alice' }])),\n)\n\nbeforeAll(() => server.listen())\nafterEach(() => server.resetHandlers())\nafterAll(() => server.close())\n```\n\n---\n\n## Accessibility Testing\n\n```ts\nimport { axe, toHaveNoViolations } from 'jest-axe'\nexpect.extend(toHaveNoViolations)\n\nit('has no a11y violations', async () => {\n  const { container } = render(\u003CLoginForm onSubmit={vi.fn()} \u002F>)\n  expect(await axe(container)).toHaveNoViolations()\n})\n```\n\n---\n\n## Component vs E2E Decision\n\n| Test | Tool |\n|------|------|\n| Component renders + behaves | RTL |\n| Network request handling | RTL + MSW |\n| Full user flow across pages | Playwright |\n| Visual regression | Playwright screenshots |\n\n---\n\n## Async Patterns\n\n```tsx\n\u002F\u002F ✅ findBy* has built-in waitFor\nconst result = await screen.findByRole('status')\n\n\u002F\u002F ❌ Arbitrary timeouts\nawait new Promise(r => setTimeout(r, 1000))\n```\n\n---\n\n## Anti-Fake-Pass\n\n```\n❌ Testing internal state (useState calls) not user-visible behavior\n❌ Not using userEvent.setup() — legacy fireEvent misses pointer events\n❌ Mocking fetch globally instead of MSW — brittle, order-dependent\n❌ Full DOM snapshot tests — any refactor breaks them\n```\n","# React Testing\n\nTest behavior, not implementation. Query by role\u002Flabel, not CSS or test-id.\n\n**Trigger phrases:** \"test React component\", \"RTL\", \"React Testing Library\", \"write tests for component\", \"MSW mock\", \"accessibility test\"\n\n---\n\n## Core Principle\n\n```tsx\n\u002F\u002F ✅ Query as users perceive\nconst button = screen.getByRole('button', { name: \u002Fsubmit\u002Fi })\nconst input  = screen.getByLabelText('Email address')\n\n\u002F\u002F ❌ Implementation details\nscreen.getByClassName('btn-primary')\nscreen.getByTestId('submit-btn')\n```\n\n---\n\n## Component Test Template\n\n```tsx\nimport { render, screen } from '@testing-library\u002Freact'\nimport userEvent from '@testing-library\u002Fuser-event'\n\ndescribe('LoginForm', () => {\n  it('calls onSubmit with credentials', async () => {\n    const onSubmit = vi.fn()\n    render(\u003CLoginForm onSubmit={onSubmit} \u002F>)\n\n    await userEvent.type(screen.getByLabelText('Email'), 'a@b.com')\n    await userEvent.type(screen.getByLabelText('Password'), 'secret')\n    await userEvent.click(screen.getByRole('button', { name: \u002Fsign in\u002Fi }))\n\n    expect(onSubmit).toHaveBeenCalledWith({ email: 'a@b.com', password: 'secret' })\n  })\n})\n```\n\n---\n\n## MSW Network Mocking\n\n```ts\nimport { http, HttpResponse } from 'msw'\nimport { setupServer } from 'msw\u002Fnode'\n\nconst server = setupServer(\n  http.get('\u002Fapi\u002Fusers', () => HttpResponse.json([{ id: 1, name: 'Alice' }])),\n)\n\nbeforeAll(() => server.listen())\nafterEach(() => server.resetHandlers())\nafterAll(() => server.close())\n```\n\n---\n\n## Accessibility Testing\n\n```ts\nimport { axe, toHaveNoViolations } from 'jest-axe'\nexpect.extend(toHaveNoViolations)\n\nit('has no a11y violations', async () => {\n  const { container } = render(\u003CLoginForm onSubmit={vi.fn()} \u002F>)\n  expect(await axe(container)).toHaveNoViolations()\n})\n```\n\n---\n\n## Component vs E2E Decision\n\n| Test | Tool |\n|------|------|\n| Component renders + behaves | RTL |\n| Network request handling | RTL + MSW |\n| Full user flow across pages | Playwright |\n| Visual regression | Playwright screenshots |\n\n---\n\n## Async Patterns\n\n```tsx\n\u002F\u002F ✅ findBy* has built-in waitFor\nconst result = await screen.findByRole('status')\n\n\u002F\u002F ❌ Arbitrary timeouts\nawait new Promise(r => setTimeout(r, 1000))\n```\n\n---\n\n## Anti-Fake-Pass\n\n```\n❌ Testing internal state (useState calls) not user-visible behavior\n❌ Not using userEvent.setup() — legacy fireEvent misses pointer events\n❌ Mocking fetch globally instead of MSW — brittle, order-dependent\n❌ Full DOM snapshot tests — any refactor breaks them\n```\n",{"name":5,"source":24,"license":15,"description":7},"https:\u002F\u002Fgithub.com\u002Faffaan-m\u002FECC","main","481dcd7dd2e288b9d627a2bd017db70e64e6c6fa","core\u002Fskills\u002Freact-testing",1,"https:\u002F\u002Fgithub.com\u002FHoronomos-laps\u002FYana-AI","https:\u002F\u002Fyana.vutam.link\u002F","https:\u002F\u002Fgithub.com\u002FHoronomos-laps","https:\u002F\u002Fyana.vutam.link","An open-source governed runtime & execution environment for multi-agent AI systems.","2026-11-11 23:56:26",{"source":8,"skillName":5,"commands":36,"prompt":46,"zipAvailable":47},[37,40,43],{"tool":38,"command":39},"npx","npx skills add Horonomos-laps\u002FYana-AI --skill react-testing",{"tool":41,"command":42},"bunx","bunx skills add Horonomos-laps\u002FYana-AI --skill react-testing",{"tool":44,"command":45},"pnpm","pnpm dlx skills add Horonomos-laps\u002FYana-AI --skill react-testing","安装技能，技能地址：https:\u002F\u002Fgithub.com\u002FHoronomos-laps\u002FYana-AI\u002Fblob\u002Fmain\u002Fcore\u002Fskills\u002Freact-testing\u002FSKILL.md",true,[],[50,57,65,73,81,89],{"skillNo":51,"name":52,"nameZh":6,"description":53,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":54,"categories":55,"keywords":56,"publishedAt":19},"01M735GKET5YVYKAY62W2P5YXB","openai--sentry--sentry","Use when the user asks to inspect Sentry issues or events, summarize recent production errors, or pull basic Sentry health data via the Sentry API; perform read-only queries with the bundled script and require `SENTRY_AUTH_TOKEN`.","https:\u002F\u002Fgithub.com\u002FHoronomos-laps\u002FYana-AI\u002Fblob\u002Fmain\u002F.claude\u002Fskills\u002Fopenai--sentry--sentry\u002FSKILL.md",[],[],{"skillNo":58,"name":59,"nameZh":6,"description":60,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":61,"licenseFileUrl":6,"sourceHtmlUrl":62,"categories":63,"keywords":64,"publishedAt":19},"01M73DCAP83T17HY7SMGK7MGFE","ito-basket-compare","Compare Itô prediction-market baskets against a user's knowledge base, portfolio notes, financial context, watchlist, or research thesis. Use for read-only basket comparison and gap analysis without investment advice or live trading.","Apache-2.0","https:\u002F\u002Fgithub.com\u002FHoronomos-laps\u002FYana-AI\u002Fblob\u002Fmain\u002Fcore\u002Fskills\u002Fito-basket-compare\u002FSKILL.md",[],[],{"skillNo":66,"name":67,"nameZh":6,"description":68,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":61,"licenseFileUrl":69,"sourceHtmlUrl":70,"categories":71,"keywords":72,"publishedAt":19},"01M734CYEMZFDR3KH6SW0JP8TD","implementing-network-traffic-baselining","Build network traffic baselines from NetFlow\u002FIPFIX data using Python pandas for statistical analysis, z-score anomaly detection, and hourly\u002Fdaily traffic pattern profiling","https:\u002F\u002Fgithub.com\u002Fyanacuti1121\u002FYana-AI\u002Fblob\u002Fmain\u002F.claude\u002Fskills\u002Fimplementing-network-traffic-baselining\u002FLICENSE","https:\u002F\u002Fgithub.com\u002FHoronomos-laps\u002FYana-AI\u002Fblob\u002Fmain\u002F.claude\u002Fskills\u002Fimplementing-network-traffic-baselining\u002FSKILL.md",[],[],{"skillNo":74,"name":75,"nameZh":6,"description":76,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":61,"licenseFileUrl":77,"sourceHtmlUrl":78,"categories":79,"keywords":80,"publishedAt":19},"01M73ASZ6NJRJM44Z2P84NGQ3Q","detecting-evasion-techniques-in-endpoint-logs","Detects defense evasion techniques used by adversaries in endpoint logs including log tampering, timestomping, process injection, and security tool disabling. Use when investigating suspicious endpoint behavior, building detection rules for evasion tactics, or conducting threat hunting for stealthy adversary activity. Activates for requests involving evasion detection, defense evasion analysis, log tampering detection, or MITRE ATT&CK TA0005.","https:\u002F\u002Fgithub.com\u002Fyanacuti1121\u002FYana-AI\u002Fblob\u002Fmain\u002Fcore\u002Fskills\u002Fdetecting-evasion-techniques-in-endpoint-logs\u002FLICENSE","https:\u002F\u002Fgithub.com\u002FHoronomos-laps\u002FYana-AI\u002Fblob\u002Fmain\u002Fcore\u002Fskills\u002Fdetecting-evasion-techniques-in-endpoint-logs\u002FSKILL.md",[],[],{"skillNo":82,"name":83,"nameZh":6,"description":84,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":61,"licenseFileUrl":85,"sourceHtmlUrl":86,"categories":87,"keywords":88,"publishedAt":19},"01M734AFNXD06Z78QRK0VKGT7Q","implementing-microsegmentation-with-guardicore","Implementing microsegmentation using Akamai Guardicore Segmentation to map application dependencies, create granular network policies, visualize east-west traffic flows, and enforce least-privilege communication between workloads across data centers and cloud.","https:\u002F\u002Fgithub.com\u002Fyanacuti1121\u002FYana-AI\u002Fblob\u002Fmain\u002F.claude\u002Fskills\u002Fimplementing-microsegmentation-with-guardicore\u002FLICENSE","https:\u002F\u002Fgithub.com\u002FHoronomos-laps\u002FYana-AI\u002Fblob\u002Fmain\u002F.claude\u002Fskills\u002Fimplementing-microsegmentation-with-guardicore\u002FSKILL.md",[],[],{"skillNo":90,"name":91,"nameZh":6,"description":6,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":61,"licenseFileUrl":6,"sourceHtmlUrl":92,"categories":93,"keywords":94,"publishedAt":19},"01M736TK27QMCXK0DVCH25SJN5","ramdisk-tmpfs-patterns","https:\u002F\u002Fgithub.com\u002FHoronomos-laps\u002FYana-AI\u002Fblob\u002Fmain\u002F.claude\u002Fskills\u002Framdisk-tmpfs-patterns\u002FSKILL.md",[],[]]