[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"skill:01M6E22KX3JB92D7AGKG2NN85C":3,"skill-same:01M6E22KX3JB92D7AGKG2NN85C":65},{"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":37,"linkOnly":38,"markdownContent":39,"markdownBody":40,"frontMatter":41,"refName":42,"commitSha":43,"skillDirectory":44,"forksCount":45,"repositoryHtmlUrl":46,"repositoryHomepageUrl":47,"ownerHtmlUrl":48,"ownerBlogUrl":49,"ownerDescription":6,"updatedAt":50,"install":51,"resources":64},"01M6E22KX3JB92D7AGKG2NN85C","javascript-typescript-jest",null,"Best practices for writing JavaScript\u002FTypeScript tests using Jest, including mocking strategies, test structure, and common patterns.","ByeongminLee\u002Fnextjs-claude-code","ByeongminLee","https:\u002F\u002Favatars.githubusercontent.com\u002Fu\u002F71276006?v=4","01M6E1S467E7GC0NE144SWHC0V","Byeongmin Lee","01M6E1S4AV3W0B08Z2YBK26VG9",3,"MIT","https:\u002F\u002Fgithub.com\u002FByeongminLee\u002Fnextjs-claude-code\u002Fblob\u002Fmain\u002Ftemplate\u002Fskills-archive\u002Fjavascript-typescript-jest\u002FSKILL.md",[18],{"categoryNo":19,"categoryName":20,"taxonomyType":21,"taxonomyTypeDesc":22},"01JBSEEDCAT000000000000008","测试与质量","SCENARIO","使用场景",[24,25,26,27,28,29,30,31,32,33,34,35,36],"typescript","javascript","javascript typescript jest","javascript typescript","jest","writing","test","best practices","common","patterns","structure","strategies","tests","2026-11-10 10:12:30",false,"---\nname: javascript-typescript-jest\ndescription: 'Best practices for writing JavaScript\u002FTypeScript tests using Jest, including mocking strategies, test structure, and common patterns.'\n---\n\n### Test Structure\n- Name test files with `.test.ts` or `.test.js` suffix\n- Place test files next to the code they test or in a dedicated `__tests__` directory\n- Use descriptive test names that explain the expected behavior\n- Use nested describe blocks to organize related tests\n- Follow the pattern: `describe('Component\u002FFunction\u002FClass', () => { it('should do something', () => {}) })`\n\n### Effective Mocking\n- Mock external dependencies (APIs, databases, etc.) to isolate your tests\n- Use `jest.mock()` for module-level mocks\n- Use `jest.spyOn()` for specific function mocks\n- Use `mockImplementation()` or `mockReturnValue()` to define mock behavior\n- Reset mocks between tests with `jest.resetAllMocks()` in `afterEach`\n\n### Testing Async Code\n- Always return promises or use async\u002Fawait syntax in tests\n- Use `resolves`\u002F`rejects` matchers for promises\n- Set appropriate timeouts for slow tests with `jest.setTimeout()`\n\n### Snapshot Testing\n- Use snapshot tests for UI components or complex objects that change infrequently\n- Keep snapshots small and focused\n- Review snapshot changes carefully before committing\n\n### Testing React Components\n- Use React Testing Library over Enzyme for testing components\n- Test user behavior and component accessibility\n- Query elements by accessibility roles, labels, or text content\n- Use `userEvent` over `fireEvent` for more realistic user interactions\n\n## Common Jest Matchers\n- Basic: `expect(value).toBe(expected)`, `expect(value).toEqual(expected)`\n- Truthiness: `expect(value).toBeTruthy()`, `expect(value).toBeFalsy()`\n- Numbers: `expect(value).toBeGreaterThan(3)`, `expect(value).toBeLessThanOrEqual(3)`\n- Strings: `expect(value).toMatch(\u002Fpattern\u002F)`, `expect(value).toContain('substring')`\n- Arrays: `expect(array).toContain(item)`, `expect(array).toHaveLength(3)`\n- Objects: `expect(object).toHaveProperty('key', value)`\n- Exceptions: `expect(fn).toThrow()`, `expect(fn).toThrow(Error)`\n- Mock functions: `expect(mockFn).toHaveBeenCalled()`, `expect(mockFn).toHaveBeenCalledWith(arg1, arg2)`\n","### Test Structure\n- Name test files with `.test.ts` or `.test.js` suffix\n- Place test files next to the code they test or in a dedicated `__tests__` directory\n- Use descriptive test names that explain the expected behavior\n- Use nested describe blocks to organize related tests\n- Follow the pattern: `describe('Component\u002FFunction\u002FClass', () => { it('should do something', () => {}) })`\n\n### Effective Mocking\n- Mock external dependencies (APIs, databases, etc.) to isolate your tests\n- Use `jest.mock()` for module-level mocks\n- Use `jest.spyOn()` for specific function mocks\n- Use `mockImplementation()` or `mockReturnValue()` to define mock behavior\n- Reset mocks between tests with `jest.resetAllMocks()` in `afterEach`\n\n### Testing Async Code\n- Always return promises or use async\u002Fawait syntax in tests\n- Use `resolves`\u002F`rejects` matchers for promises\n- Set appropriate timeouts for slow tests with `jest.setTimeout()`\n\n### Snapshot Testing\n- Use snapshot tests for UI components or complex objects that change infrequently\n- Keep snapshots small and focused\n- Review snapshot changes carefully before committing\n\n### Testing React Components\n- Use React Testing Library over Enzyme for testing components\n- Test user behavior and component accessibility\n- Query elements by accessibility roles, labels, or text content\n- Use `userEvent` over `fireEvent` for more realistic user interactions\n\n## Common Jest Matchers\n- Basic: `expect(value).toBe(expected)`, `expect(value).toEqual(expected)`\n- Truthiness: `expect(value).toBeTruthy()`, `expect(value).toBeFalsy()`\n- Numbers: `expect(value).toBeGreaterThan(3)`, `expect(value).toBeLessThanOrEqual(3)`\n- Strings: `expect(value).toMatch(\u002Fpattern\u002F)`, `expect(value).toContain('substring')`\n- Arrays: `expect(array).toContain(item)`, `expect(array).toHaveLength(3)`\n- Objects: `expect(object).toHaveProperty('key', value)`\n- Exceptions: `expect(fn).toThrow()`, `expect(fn).toThrow(Error)`\n- Mock functions: `expect(mockFn).toHaveBeenCalled()`, `expect(mockFn).toHaveBeenCalledWith(arg1, arg2)`\n",{"name":5,"description":7},"main","330a71e3d12264515ce3477e446d29fd34a88a9d","template\u002Fskills-archive\u002Fjavascript-typescript-jest",1,"https:\u002F\u002Fgithub.com\u002FByeongminLee\u002Fnextjs-claude-code","https:\u002F\u002Fbyeongminlee.github.io\u002Fnextjs-claude-code\u002F","https:\u002F\u002Fgithub.com\u002FByeongminLee","byeongmin.dev","2026-03-27 12:45:44",{"source":8,"skillName":5,"commands":52,"prompt":62,"zipAvailable":63},[53,56,59],{"tool":54,"command":55},"npx","npx skills add ByeongminLee\u002Fnextjs-claude-code --skill javascript-typescript-jest",{"tool":57,"command":58},"bunx","bunx skills add ByeongminLee\u002Fnextjs-claude-code --skill javascript-typescript-jest",{"tool":60,"command":61},"pnpm","pnpm dlx skills add ByeongminLee\u002Fnextjs-claude-code --skill javascript-typescript-jest","安装技能，技能地址：https:\u002F\u002Fgithub.com\u002FByeongminLee\u002Fnextjs-claude-code\u002Fblob\u002Fmain\u002Ftemplate\u002Fskills-archive\u002Fjavascript-typescript-jest\u002FSKILL.md",true,[],[66,85,93,123,152,191],{"skillNo":67,"name":68,"nameZh":6,"description":69,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":70,"categories":71,"keywords":72,"publishedAt":37},"01M6E263DRDCZ5AX01N6MDYC6Z","zustand","Zustand state management guide. Use when working with store code (src\u002Fstore\u002F**), implementing actions, managing state, or creating slices. Triggers on Zustand store development, state management questions, or action implementation.","https:\u002F\u002Fgithub.com\u002FByeongminLee\u002Fnextjs-claude-code\u002Fblob\u002Fmain\u002Ftemplate\u002Fskills-archive\u002Fzustand\u002FSKILL.md",[],[68,73,74,75,76,77,78,79,80,81,82,83,84],"triggers","state management","zustand state","implementation","use","guide","management","src","actions","state","code","development",{"skillNo":86,"name":87,"nameZh":6,"description":6,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":88,"categories":89,"keywords":90,"publishedAt":37},"01M6E260QFP3ZMXY2Y6KTGZYXS","web-vitals","https:\u002F\u002Fgithub.com\u002FByeongminLee\u002Fnextjs-claude-code\u002Fblob\u002Fmain\u002Ftemplate\u002Fskills-archive\u002Fweb-vitals\u002FSKILL.md",[],[91,92],"web vitals","web",{"skillNo":94,"name":95,"nameZh":6,"description":96,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":97,"categories":98,"keywords":102,"publishedAt":37},"01M6E25QEKXHH092S5RB0GKM0K","vercel-storage","Vercel storage expert guidance — Blob, Edge Config, and Marketplace storage (Neon Postgres, Upstash Redis). Use when choosing, configuring, or using data storage with Vercel applications.","https:\u002F\u002Fgithub.com\u002FByeongminLee\u002Fnextjs-claude-code\u002Fblob\u002Fmain\u002Ftemplate\u002Fskills-archive\u002Fvercel-storage\u002FSKILL.md",[99],{"categoryNo":100,"categoryName":101,"taxonomyType":21,"taxonomyTypeDesc":22},"01JBSEEDCAT000000000000010","后端与接口",[103,104,105,106,107,108,109,110,111,112,113,114,115,116,117,118,119,120,121,122],"vercel","vercel storage","storage","supabase","api","mongodb","SET","nextjs","database","auth","migrate","click","app","neon","prisma","postgres","expert","up","auto","configure",{"skillNo":124,"name":125,"nameZh":6,"description":126,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":127,"categories":128,"keywords":135,"publishedAt":37},"01M6E25EC9YM4QM0KBQ2W5R1SC","vercel-functions","Vercel Functions expert guidance — Serverless Functions, Edge Functions, Fluid Compute, streaming, Cron Jobs, and runtime configuration. Use when configuring, debugging, or optimizing server-side code running on Vercel.","https:\u002F\u002Fgithub.com\u002FByeongminLee\u002Fnextjs-claude-code\u002Fblob\u002Fmain\u002Ftemplate\u002Fskills-archive\u002Fvercel-functions\u002FSKILL.md",[129,130],{"categoryNo":100,"categoryName":101,"taxonomyType":21,"taxonomyTypeDesc":22},{"categoryNo":131,"categoryName":132,"taxonomyType":133,"taxonomyTypeDesc":134},"01JBSEEDCAT000000000000030","开发工程师","PROFESSION","适用职业",[136,103,137,138,139,140,141,142,115,116,143,144,145,146,147,148,149,150,151,119],"functions","vercel functions","local","shared","project","time","apps","express","vercel ai sdk","router","loop","server","logs","streaming","delete","create",{"skillNo":153,"name":154,"nameZh":6,"description":155,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":156,"categories":157,"keywords":173,"publishedAt":37},"01M6E25873YRYP96MSQK7E2D9X","ui-ux-pro-max","UI\u002FUX design intelligence for web and mobile. Includes 50+ styles, 161 color palettes, 57 font pairings, 161 product types, 99 UX guidelines, and 25 chart types across 10 stacks (React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn\u002Fui, and HTML\u002FCSS). Actions: plan, build, create, design, implement, review, fix, improve, optimize, enhance, refactor, and check UI\u002FUX code. Projects: website, landing page, dashboard, admin panel, e-commerce, SaaS, portfolio, blog, and mobile app. Elements: button, modal, navbar, sidebar, card, table, form, and chart. Styles: glassmorphism, claymorphism, minimalism, brutalism, neumorphism, bento grid, dark mode, responsive, skeuomorphism, and flat design. Topics: color systems, accessibility, animation, layout, typography, font pairing, spacing, interaction states, shadow, and gradient. Integrations: shadcn\u002Fui MCP for component search and examples.","https:\u002F\u002Fgithub.com\u002FByeongminLee\u002Fnextjs-claude-code\u002Fblob\u002Fmain\u002Ftemplate\u002Fskills-archive\u002Fui-ux-pro-max\u002FSKILL.md",[158,161,164,167,170],{"categoryNo":159,"categoryName":160,"taxonomyType":21,"taxonomyTypeDesc":22},"01JBSEEDCAT000000000000009","前端开发",{"categoryNo":162,"categoryName":163,"taxonomyType":21,"taxonomyTypeDesc":22},"01JBSEEDCAT000000000000015","视觉设计",{"categoryNo":165,"categoryName":166,"taxonomyType":21,"taxonomyTypeDesc":22},"01JBSEEDCAT000000000000023","Skill与智能体开发",{"categoryNo":168,"categoryName":169,"taxonomyType":133,"taxonomyTypeDesc":134},"01JBSEEDCAT000000000000032","设计师",{"categoryNo":171,"categoryName":172,"taxonomyType":133,"taxonomyTypeDesc":134},"01JBSEEDCAT000000000000033","数据分析师",[174,175,176,177,178,179,180,181,115,182,183,184,185,186,187,188,189,81,190,151],"ui ux pro max","ui","ux","max","css","MCP","design","react","card","chart","fix","projects","plan","improve","Tailwind","Animation","search",{"skillNo":192,"name":193,"nameZh":6,"description":194,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":195,"categories":196,"keywords":197,"publishedAt":37},"01M6E251G3FJSRB9019V20QK9X","turborepo","Turborepo monorepo build system guidance. Triggers on: turbo.json, task pipelines,\ndependsOn, caching, remote cache, the \"turbo\" CLI, --filter, --affected, CI optimization, environment\nvariables, internal packages, monorepo structure\u002Fbest practices, and boundaries.\n\nUse when user: configures tasks\u002Fworkflows\u002Fpipelines, creates packages, sets up\nmonorepo, shares code between apps, runs changed\u002Faffected packages, debugs cache,\nor has apps\u002Fpackages directories.","https:\u002F\u002Fgithub.com\u002FByeongminLee\u002Fnextjs-claude-code\u002Fblob\u002Fmain\u002Ftemplate\u002Fskills-archive\u002Fturborepo\u002FSKILL.md",[],[193,198,77,199,200,142,73,201,34,120,202,203,204,205,206,207,83,208,209,210],"cli","filter","environment variables","caching","environment","monorepo","system","canary","Optimization","ci","packages","tasks","workflows"]