{"enrichment":{"faq":[{"a":"react-native-testing guides you through writing component tests using Testing Library patterns. Start by importing render from @testing-library/react-native, then render your component with render(<YourComponent />). Use query methods like getByRole, getByText, or getByTestId to find elements, then assert their state using matchers like toBeOnTheScreen. For async operations, wrap assertions in waitFor() to handle state updates. This approach ensures your tests verify user-facing behavior rather than implementation details.","q":"How do you write React Native tests with Testing Library?"},{"a":"react-native-testing covers key differences between v13 and v14. Version 13 uses synchronous render patterns, while v14 introduced async render capabilities by default. The screen API behavior evolved between versions, and query method availability may differ. Migration from v13 to v14 requires understanding these async/sync pattern changes to avoid test flakiness. The skill helps you identify which patterns apply to your version and how to adapt existing tests accordingly.","q":"What are the version-specific API differences between RNTL v13 and v14?"},{"a":"react-native-testing teaches proper query selection by matching user interactions: use getByRole for accessibility-first queries, getByText for visible text, and getByTestId as a fallback. For async operations, use findBy queries or wrap assertions in waitFor() to handle component state updates. Understand that v14 defaults to async rendering while v13 uses sync patterns. Avoid anti-patterns like querying before render completes or using fireEvent for text input when userEvent is more reliable for simulating real user behavior.","q":"How should you select queries and handle async/sync patterns for React Native tests?"},{"a":"react-native-testing shows how to create wrapper components that inject providers like Redux, Theme, or Navigation context. Define a custom render function that wraps your component with these providers, then use it consistently across tests. This pattern ensures all components render with the same context setup, reducing boilerplate and preventing provider-related test failures. The skill demonstrates how to structure these wrappers to be reusable and maintainable across your test suite.","q":"How do you set up custom render functions with providers for testing?"},{"a":"react-native-testing helps you debug and fix common mistakes: querying elements before they render (use findBy or waitFor instead), mixing fireEvent and userEvent inconsistently, ignoring accessibility roles in favor of implementation details, and not wrapping async assertions in waitFor. The skill teaches you to recognize test flakiness caused by timing issues and how to refactor tests to be more reliable. It also covers jest matcher usage, including toBeOnTheScreen for visibility assertions.","q":"What are common testing anti-patterns to avoid in React Native component tests?"},{"a":"react-native-testing provides examples for testing interactive components: use fireEvent.changeText or userEvent for TextInput value changes, and fireEvent.press or userEvent for Pressable button interactions. Query these elements by role (button, textbox) or accessible label when possible. For TextInput, verify value changes propagate correctly; for Pressable, confirm callbacks fire and UI updates reflect the interaction. The skill covers screen API usage to access rendered elements and demonstrates patterns that work reliably across RNTL versions.","q":"How do you test React Native components like TextInput and Pressable with Testing Library?"}],"shadow_tags":["mobile-unit-testing","accessibility-first-queries","async-render-patterns","jest-integration","user-interaction-simulation","version-specific-apis","provider-wrapping","anti-pattern-detection"],"summary_rewrite":"Master React Native testing workflows with this agent skill designed for AI coding assistants. It equips you to write, review, and refine component tests using Testing Library patterns, streamlining quality assurance in your React Native projects."},"files":[{"bytes":7315,"path":"plugins/vendored/.agents/skills/react-native-testing/SKILL.md","sha256":"dea54d1d397cbd271a9ee7f6c09e841bb1aa546d9f2a3ee46fd466275061e6e1","url":"https://skillfed.io/files/callstackincubator/agent-skills/react-native-testing/068708f2/SKILL.md"}],"id":"callstackincubator/agent-skills/react-native-testing","links":{"html":"https://skillfed.io/callstackincubator/agent-skills/react-native-testing","md":"https://skillfed.io/callstackincubator/agent-skills/react-native-testing.md","repo":"https://github.com/callstackincubator/agent-skills"},"meta":{"agents_supported":[],"first_seen":"2026-07-28","forks":113,"language":"Shell","last_updated":"2026-07-25","license":"MIT","name":"react-native-testing","publisher":"callstackincubator","stars":1566},"relations":{"similar":[{"id":"callstack/react-native-testing-library/react-native-testing"},{"id":"gohypergiant/agent-skills/accelint-react-testing"},{"id":"itechmeat/llm-code/react-testing-library"},{"id":"DaleStudy/skills/testing"},{"id":"pproenca/dot-skills/react-testing-library"},{"id":"shipshitdev/skills/react-testing-library"},{"id":"manutej/luxor-claude-marketplace/jest-react-testing"},{"id":"hieutrtr/ai1-skills/react-testing-patterns"},{"id":"pluginagentmarketplace/custom-plugin-react-native/react-native-testing"},{"id":"affaan-m/ECC/react-testing"}]},"slug":{"owner":"callstackincubator","repo":"agent-skills","skill":"react-native-testing"},"version":"068708f2"}
