重要前提
安装AI Skills的关键前提是:必须科学上网,且开启TUN模式,这一点至关重要,直接决定安装能否顺利完成,在此郑重提醒三遍:科学上网,科学上网,科学上网。查看完整安装教程 →
react-native-testing by pluginagentmarketplace/custom-plugin-react-native
npx skills add https://github.com/pluginagentmarketplace/custom-plugin-react-native --skill react-native-testing学习全面的测试策略,包括单元测试、组件测试和端到端测试。
完成此技能后,您将能够:
// jest.config.js
module.exports = {
preset: 'react-native',
setupFilesAfterEnv: ['@testing-library/jest-native/extend-expect'],
transformIgnorePatterns: [
'node_modules/(?!(react-native|@react-native)/)',
],
};
import { render, screen, fireEvent } from '@testing-library/react-native';
import { Button } from './Button';
describe('Button', () => {
it('calls onPress when pressed', () => {
const onPress = jest.fn();
render(<Button title="Click" onPress={onPress} />);
fireEvent.press(screen.getByText('Click'));
expect(onPress).toHaveBeenCalled();
});
});
广告位招租
在这里展示您的产品或服务
触达数万 AI 开发者,精准高效
import { renderHook, act } from '@testing-library/react-native';
import { useCounter } from './useCounter';
describe('useCounter', () => {
it('increments count', () => {
const { result } = renderHook(() => useCounter());
act(() => result.current.increment());
expect(result.current.count).toBe(1);
});
});
// Mock native module
jest.mock('@react-native-async-storage/async-storage', () => ({
setItem: jest.fn(),
getItem: jest.fn(),
}));
// Mock API
jest.mock('./api', () => ({
fetchUser: jest.fn().mockResolvedValue({ id: '1', name: 'Test' }),
}));
describe('Login', () => {
beforeAll(async () => {
await device.launchApp();
});
it('should login successfully', async () => {
await element(by.id('email')).typeText('test@example.com');
await element(by.id('password')).typeText('password');
await element(by.id('login-btn')).tap();
await expect(element(by.id('home'))).toBeVisible();
});
});
// ProductCard.test.tsx
import { render, screen, fireEvent } from '@testing-library/react-native';
import { ProductCard } from './ProductCard';
const mockProduct = {
id: '1',
title: 'Test Product',
price: 99.99,
};
describe('ProductCard', () => {
it('renders product info', () => {
render(<ProductCard {...mockProduct} onPress={jest.fn()} />);
expect(screen.getByText('Test Product')).toBeOnTheScreen();
expect(screen.getByText('$99.99')).toBeOnTheScreen();
});
it('handles press', () => {
const onPress = jest.fn();
render(<ProductCard {...mockProduct} onPress={onPress} />);
fireEvent.press(screen.getByRole('button'));
expect(onPress).toHaveBeenCalledWith('1');
});
});
| 错误 | 原因 | 解决方案 |
|---|---|---|
| "Cannot find module" | 缺少模拟 | 添加 jest.mock() |
| 异步超时 | 缺少 await | 使用 waitFor() |
| 找不到元素 | 查询条件错误 | 检查 testID/role |
Skill("react-native-testing")
绑定代理 : 06-react-native-testing
每周安装次数
63
仓库
GitHub 星标数
5
首次出现
Jan 21, 2026
安全审计
安装于
opencode53
codex49
claude-code48
gemini-cli48
cursor42
github-copilot38
Learn comprehensive testing strategies including unit tests, component tests, and E2E tests.
After completing this skill, you will be able to:
// jest.config.js
module.exports = {
preset: 'react-native',
setupFilesAfterEnv: ['@testing-library/jest-native/extend-expect'],
transformIgnorePatterns: [
'node_modules/(?!(react-native|@react-native)/)',
],
};
import { render, screen, fireEvent } from '@testing-library/react-native';
import { Button } from './Button';
describe('Button', () => {
it('calls onPress when pressed', () => {
const onPress = jest.fn();
render(<Button title="Click" onPress={onPress} />);
fireEvent.press(screen.getByText('Click'));
expect(onPress).toHaveBeenCalled();
});
});
import { renderHook, act } from '@testing-library/react-native';
import { useCounter } from './useCounter';
describe('useCounter', () => {
it('increments count', () => {
const { result } = renderHook(() => useCounter());
act(() => result.current.increment());
expect(result.current.count).toBe(1);
});
});
// Mock native module
jest.mock('@react-native-async-storage/async-storage', () => ({
setItem: jest.fn(),
getItem: jest.fn(),
}));
// Mock API
jest.mock('./api', () => ({
fetchUser: jest.fn().mockResolvedValue({ id: '1', name: 'Test' }),
}));
describe('Login', () => {
beforeAll(async () => {
await device.launchApp();
});
it('should login successfully', async () => {
await element(by.id('email')).typeText('test@example.com');
await element(by.id('password')).typeText('password');
await element(by.id('login-btn')).tap();
await expect(element(by.id('home'))).toBeVisible();
});
});
// ProductCard.test.tsx
import { render, screen, fireEvent } from '@testing-library/react-native';
import { ProductCard } from './ProductCard';
const mockProduct = {
id: '1',
title: 'Test Product',
price: 99.99,
};
describe('ProductCard', () => {
it('renders product info', () => {
render(<ProductCard {...mockProduct} onPress={jest.fn()} />);
expect(screen.getByText('Test Product')).toBeOnTheScreen();
expect(screen.getByText('$99.99')).toBeOnTheScreen();
});
it('handles press', () => {
const onPress = jest.fn();
render(<ProductCard {...mockProduct} onPress={onPress} />);
fireEvent.press(screen.getByRole('button'));
expect(onPress).toHaveBeenCalledWith('1');
});
});
| Error | Cause | Solution |
|---|---|---|
| "Cannot find module" | Missing mock | Add jest.mock() |
| Async timeout | Missing await | Use waitFor() |
| Element not found | Wrong query | Check testID/role |
Skill("react-native-testing")
Bonded Agent : 06-react-native-testing
Weekly Installs
63
Repository
GitHub Stars
5
First Seen
Jan 21, 2026
Security Audits
Gen Agent Trust HubPassSocketPassSnykPass
Installed on
opencode53
codex49
claude-code48
gemini-cli48
cursor42
github-copilot38
测试策略完整指南:单元/集成/E2E测试金字塔与自动化实践
11,200 周安装