그런데 사용자는 실제 기기에서 “Continue” 버튼을 탭했을 때 아무런 반응도 하지 않는다고 보고합니다. 컴포넌트 테스트에서는 버튼을 찾았고, 핸들러를 호출했으며, 예상된 화면을 모킹된 자바스크립트 환경에서 보았습니다. 그러나 실제 네이티브 권한提示, 키보드 동작, 애니메이션, 플랫폼 API, 또는 실제 네비게이션 스택을 검증하지 않았습니다.
그것은 팀이 잘못된 자신감을 얻는 곳입니다. 리액트 네이티브 테스트 라이브러리 컴포넌트가 렌더링하는 내용과 사용자와의 상호 작용에 대한 반응을 테스트하기 위해 탁월하지만, 장치 테스트나 성능 측정의 대체는 아니다. 신뢰할 수 있는 전략은 각层의 실패를 노출할 수 있는 부분을 사용하는 것이다.
내용목록
- 사용자 중심 테스트가 모든 것을 바꾼다
- 정확하게 작동하는 설치 및 설정
- 코어 API, 쿼리 및 어설션에 대한 설명
- 컴포넌트, 훅스 및 네비게이션에 대한 실용적인 패턴
- 디버깅 불안정한 테스트 CI 및 성능 검사
- 모두를 합쳐서 앞으로 나아가기
사용자 중심 테스트가 모든 것을 바꾼다
테스트가 작성되기 전에 테스트가 실패하는 일반적인 문제는 개발자가 컴포넌트의 속성을 검사하고 컴포넌트의 상태에 접근하거나 큰 스냅샷을 비교하는 것입니다. 테스트는 통과하지만 리팩토링이 컴포넌트 구조를 변경하지 않고 사용자 경험을 변경하지 않으면 테스트 스위트가 실패합니다. 더 나쁜 것은 테스트가 계속 통과하면서 사용자에게 보이는 동작이 잘못된 채로 남아 있는 것입니다. 왜냐하면 주장된 내용은 사용자가 볼 수 있는 내용을 설명하지 않았기 때문입니다.
React Native Testing Library는 반대 접근법을 취합니다. 컴포넌트를 렌더링하고 사용자가 볼 수 있는 제어를 통해 컴포넌트와 상호 작용한 다음 사용자가 볼 수 있는 결과를 주장합니다. 이 접근법은 React Native Testing Library의 사용자 중심 예시와 일치합니다. React Native Testing Library의 사용자 중심 예시React Native의 테스트 지침과 함께 테스트를 짧고, 각 테스트가 하나의 일에 집중하고, 뷰 관련 문제를 비즈니스 로직과 상태에서 분리하고, 내부 implementation 세부 사항 대신 가시적인 출력 또는 접근성 도우미를 선호하는 것을 유지하는 것이 중요합니다.
사용자가 의존하는 동작을 테스트하세요
로그인 폼이 요청이 실행되는 동안 SUBMIT 버튼을 비활성화한다고 가정해 보세요. brittle한 테스트는 특정 컴포넌트 인스턴스에 대한 검사 또는 상태 변수가 변경된 것을 확인하는 것을 검사할 수 있습니다. 더 강한 테스트는 접근성 가능한 '로그인' 버튼을 클릭하고 로딩 인디케이터를 기다리며 오류 메시지 또는 목적지 화면이 나타나는지 확인합니다. disabled 두 번째 테스트는 로컬 상태, 리듀서, 커스텀 훅, 또는 다른 버튼 implementation을 사용하는지 신경 쓰지 않습니다. 앱이 올바른 결과를 전달하는지에만 관심이 있습니다.
실용적인 규칙:
사용자가 관찰할 수 없는 것을 테스트하는 경우, 컴포넌트 동작 테스트에 포함하는지 의심해 보세요. 접근성 레이블 및 역할에 기반한 쿼리도 더 나은 제품을 강제합니다. 의미 있는 레이블을 노출하는 화면은 보조 기술과 테스트를 수행하는 데 더 쉽습니다. 이 연결은 broader 앱 사용자 경험을 평가할 때 중요합니다. 왜냐하면 테스트 가능성과 사용성은 종종 함께 개선되기 때문입니다.
Queries based on accessibility labels and roles also force better product code. A screen that exposes meaningful labels is easier to use with assistive technology and easier to exercise in tests. That connection matters when you assess the broader __CAPGO_KEEP_0____CAPGO_KEEP_0__
__CAPGO_KEEP_0__
A 사용자 중심 컴포넌트 테스트는 JavaScript가 예상되는 branch를 렌더링하고 시뮬레이션된 클릭에 응답하는지 증명할 수 있습니다. 그러나 생체 인증 프롬프트가 올바르게 열리는지, 네이티브 카메라가 사용 가능한 결과를 반환하는지, 플랫폼별 라이프 사이클 동작에 따라 결제 흐름이 살아남는지를 증명할 수는 없습니다.
그 경계는 라이브러리의 약점이 아니라 테스트层를 진실되게 유지하는 이유입니다. RNTL을 컴포넌트 동작에 사용하고, 네이티브 통합, 실제 네비게이션, 권한, 인증, 결제, 또는 앱의 핵심 기능이 결과를 변경할 수 있는 흐름에 대해서만 장치 기반 테스트를 사용하십시오.
설치 및 실제로 작동하는 구성
최신 설정은 다음과 같습니다.
@testing-library/react-native__CAPGO_KEEP_0__ 패키지 이름은 역사적인 유물로 남아 있지만 현재 프로젝트에서는 Testing Library 가족 내에서 관리되는 스코프 패키지를 사용해야 합니다. 프로젝트의 __CAPGO_KEEP_0__ 저장소는 React Native를 사용하는 좋은 테스트 관행을 장려하는 유틸리티로 설명하고 있으며, 라이브러리의 릴리스 기록은 React Native와 함께 계속해서 변하는 대신 정적 헬퍼가 아닌 라이브러리로서의 역할을 계속하고 있습니다. react-native-testing-library npm package name still exists as a historical artifact, but current projects should use the scoped package maintained within the Testing Library family. The project’s GitHub repository __CAPGO_KEEP_0__
__CAPGO_KEEP_0__
npm install --save-dev @testing-library/react-native jest__CAPGO_KEEP_0__
{
"scripts": {
"test": "jest"
},
"jest": {
"preset": "jest-expo"
}
}React Native 애플리케이션의 경우, React Native Jest 설정을 사용하세요. 프레임워크 버전과 일치시켜 두세요. RNTL 문제로 보이는 많은 실패는 React 렌더러, Babel 변환, 또는 Jest preset이 일치하지 않기 때문입니다.
설정 파일을 명확하게 유지하세요
공유 환경 설정을 설정 파일에 넣어두세요. 테스트마다 mocks를 반복하지 마세요:
// jest.setup.js
import '@testing-library/react-native/extend-expect';그런 다음 Jest에서 참조하세요:
{
"jest": {
"preset": "jest-expo",
"setupFilesAfterEnv": ["<rootDir>/jest.setup.js"]
}
}앱이 React Navigation, Reanimated, 제스처 처리, safe-area 컨텍스트, 또는 저장소 모듈을 사용한다면, 테스트 환경이 필요한 mocks만 구성하세요. 모든 테스트를 통과하기 쉽게 만드는 global mock은 테스트 스위트의 신뢰성을 떨어뜨립니다.
TypeScript도 같은 주의가 필요합니다. Jest가 preset 또는 Babel 설정을 통해 변환하고, 테스트 타입을 컴파일러에 제공하세요. 로컬에서 실행되는 테스트지만 타입 체크되지 않은 테스트는 잘못된 쿼리 이름, 유효하지 않은 네비게이션 매개 변수, 또는 안전하지 않은 mock 형태를 숨길 수 있습니다. .ts 릴리스 시간표는 이전 설정 조언을 진단할 때 유용합니다. 프로젝트 목록에 .tsx 127개 릴리스
, v14.0.1은 2026-06-23에 태깅되었습니다., with v14.0.1 tagged on 2026-06-23React Native Testing Library v12.9.0, 2024년 11월 27일 출시, React Native 0.77 및 Expo 52에 대한 공식 지원을 추가했습니다.. 2025년 3월에 Universal Test Renderer로 마이그레이션 된 v14 alpha 라인은 React 19만 지원하는 준비를했습니다. 이러한 세부 정보는 RNTL 릴리스 역사에서 확인할 수 있습니다. 따라서 outdated tutorial에서 renderer 의존성을 복사하지 말고 앱의 버전을 확인하세요.
실제 Jest foundation를 위해, Jest 단위 테스트 가이드와 비교하여, 네비게이션 및 네이티브 모킹을 추가하기 전에 한 개의 작은 컴포넌트 테스트를 실행하세요.
Core APIs Queries and Assertions Explained
RNTL tests become trustworthy when their queries match what a user can see, find, and operate. The API is small, but choosing a selector that exposes implementation details can make a passing test misleading.
__CAPGO_KEEP_0__은 작지만, 구현 세부 정보를 드러내는 선택자가 테스트를 통과하는 테스트를 오해하게 만들 수 있습니다. 시작하세요. render:
const screen = render(<LoginForm />);사용자에게 가장 관련이 있는 쿼리 중 하나를 선택하세요. 접근성에 중점을 둔 쿼리를 사용할 수 있는 경우, 컴포넌트가 노출하는 쿼리를 사용하고, 텍스트가 동작할 때는 보이는 텍스트를 사용하고, 의미 있는 사용자 인터페이스 선택자가 없거나 안정적인 통합 훅이 필요할 때는 testID 쿼리 우선순위를 결정하는 그래픽 피라미드 차트
각 쿼리 패밀리는 다음과 같은 특수한 목적을 가지고 있습니다:
동시성 존재:
- 이용 또는 다른
getByRole,getByText쿼리를 사용하여 요소가 이미 존재해야 할 때. 테스트가 실패하면 즉시 실패합니다.getBy동시성 나타남: - 이용 또는
findByRole쿼리를 사용하여 요소가 나타나야 할 때. 테스트가 실패하면 즉시 실패합니다. 또는, 요소가 나타나야 할 때는 사용할 수 있는 다른 쿼리를 사용하세요.findByTextasync 업데이트를 일으키거나 상호 작용할 때. - 결핍 확인: 사용
queryByText또는queryByTestIdHTML 텍스트 조각은 더 긴 Capgo UI 문자열 (부모 키 `alternatives_cta_questions`)에서 나옵니다. 페이지/영역: Capacitor live-update 대안 비교 페이지. 역할: 장기적인 마케팅 또는 법적 문단. 표시되는 곳: 페이지 alternatives.astro. Capgo 제품/브랜드 및 개발자 용어를 정확하게 유지하십시오. 메시지 키 `alternatives_cta_questions` (대안 CTA 질문). | HTML 텍스트 조각은 더 긴 Capgo UI 문자열 (부모 키 `appflow_cta_questions`)에서 나옵니다. 페이지/영역: Appflow 비교/이동 마케팅 복사본. 역할: 장기적인 마케팅 또는 법적 문단. 표시되는 곳: 페이지 ionic-appflow.astro. Capgo 제품/브랜드 및 개발자 용어를 정확하게 유지하십시오. 메시지 키 `appflow_cta_questions` (Appflow CTA 질문). | HTML 텍스트 조각은 더 긴 Capgo UI 문자열 (부모 키 `capwesome_cta_questions`)에서 나옵니다. 페이지/영역: Capawesome 비교 페이지. 역할: 장기적인 마케팅 또는 법적 문단. 표시되는 곳: 페이지 capwesome.astro. Capgo 제품/브랜드 및 개발자 용어를 정확하게 유지하십시오. 메시지 키 `capwesome_cta_questions` (Capwesome CTA 질문). | HTML 텍스트 조각은 더 긴 Capgo UI 문자열 (부모 키 `consulting_faq_subtitle`)에서 나옵니다. 페이지/영역: 컨설팅 서비스 페이지. 역할: 섹션 서브 타이틀 또는 태그 라인. 표시되는 곳: 페이지 consulting.astro. Capgo 제품/브랜드 및 개발자 용어를 정확하게 유지하십시오. 메시지 키 `consulting_faq_subtitle` (컨설팅 FAQ 서브 타이틀). | 페이지/영역: Appflow 비교/이동 마케팅 복사본. 역할: 짧은 UI 레이블 또는 네비게이션 아이템. 표시되는 곳: 페이지 ionic-appflow.astro, 페이지 ionic-enterprise-plugins.astro, 페이지 solutions/ionic-enterprise-plugins.astro. 메시지 키 `appflow_plugins_or` (Appflow 플러그인 또는). - 요소가 없을 수 있고 null 결과가 예상되는 대신 예외가 발생하지 않도록. 대체 선택자:
getByTestId사용
의도적으로. 복잡한 컨트롤에 지속적인 hook을 제공하지만 앱 내에서 접근 가능성 있는 레이블을 대체하지 않도록. fireEvent.press 집중 이벤트 테스트에 대해
fireEvent.press(screen.getByRole('button', { name: 'Save' }));직접: userEvent 사용
expect(await screen.findByText('Saved')).toBeTruthy();핸들러 선언문은 이벤트 콜백으로 구성된 컴포넌트에 적합합니다. 사용자 경험의 작동을 증명하는 유일한 증거는 약합니다.
스냅샷보다 특정 선언문을 선호하세요.
좋은 선언문은 화면을 설명합니다:
expect(screen.getByText('Account created')).toBeTruthy();
expect(screen.getByRole('button', { name: 'Continue' })).toBeEnabled();그것들은 또한 접근성 상태, 선택, 그리고 보이는 유효성 피드백을 확인할 수 있습니다. 내부 연결을 확인하지 마세요:
expect(screen.getByTestId('submit-button').props.onPress).toBeDefined();그 선언문은 프로퍼가 존재한다는 것을 증명한다는 것이 아니라, 기능이 작동한다는 것을 증명하지 않습니다. 작은, 의도적인 스냅샷은 구조적 변경을 잡을 수 있지만, 큰 네비게이션 또는 화면 스냅샷은 노이즈가 많은 리뷰를 만들고, 설명되지 않은 업데이트를 쉽게 승인할 수 있습니다.
테스트 라이브러리 패키지는 더 넓은 testing-library npm @testing-library/react-native의 일부입니다. 활발한 패키지는 13.3.3버전이 2026년에 에 출시되었습니다.프로젝트의 저장소 정보에 따르면. 플랫폼 간에 공유되는 쿼리 규칙이 도움이 되지만, 제품 동작을 대표하는 선언문을 결정하지는 않습니다.
React Native 테스트 라이브러리 Jest 컴포넌트 테스트 방법론의 더 넓은 비교를 위해 이 안내서를 참조하십시오.React 단위 테스트
. RNTL은 여전히 자바스크립트 렌더링 컴포넌트 경계에 멈춥니다. 네이티브 권한, 실제 네비게이션 스택, 디바이스 키보드, 프레임 타이밍 및 메모리 동작은 E2E 또는 성능 도구 대신 더 많은 컴포넌트 모킹이 아닌 필요합니다.
아래의 비디오는 쿼리 및 진술 워크플로우를 컨텍스트에서 보여줍니다.
컴포넌트, 훅스 및 네비게이션에 대한 실용적인 패턴
현대 랩톱과 나무 데스크 위에 표시된 React Native __CAPGO_KEEP_0__와 모바일 앱 모키토.
프레젠테이션 컴포넌트
const onSelect = jest.fn();
render(
<PlanCard
title="Team"
description="Shared workspace"
onSelect={onSelect}
/>
);
fireEvent.press(screen.getByRole('button', { name: 'Choose Team' }));
expect(onSelect).toHaveBeenCalled();컴포넌트 테스트는 다음과 같이 유지해야 합니다:
정확한 레이블은 UI와 일치해야 합니다. 중요한 부분은 테스트가 사용자 또는 접근성 서비스와 같이 컨트롤을 찾고, 가시적인 또는 콜백 결과를 확인하는 것입니다. 기본적으로 모든 자식 컴포넌트를 모킹하지 마십시오. 비용이 많이 드는 또는 관련이 없는 경계만 모킹할 때 테스트하는 동작을 방해하지 않도록 하십시오. renderHook 커스텀 훅스를 사용할 때는
const { result } = renderHook(() => useSearch());
await act(async () => {
await result.current.submit('query');
});
expect(result.current.status).toBe('success');Hook 테스트는 네트워크 또는 저장소 경계를 제어해야 하며 전체 앱을 재현하지 않아야 합니다. 화면을 별도로 테스트하여 hook의 상태가 유용한 UI가 되는지 확인하세요.
이동 및 비동기 데이터
이동 동작에 대한 경우, 실제 화면 내에서 화면을 렌더링하는 것보다 작은 테스트 네비게이터를 렌더링하는 것이 종종 더 가치가 있습니다. 표시된 컨트롤을 클릭하고 목적지 콘텐츠를 기다리며 새로운 화면의 출력을 확인하세요. 직접적인 mock은 작은 버튼의 경우 dispatching된 라우팅 타입만을 위한 dispatching만을 위한 mock이지만 라우팅 등록, 매개변수, 또는 중첩 네비게이터 동작을 검증하지 않습니다. NavigationContainer 비동기 데이터도 같은 discipline을 적용해야 합니다. 저장소 또는 repository의 응답을 mock하고 화면을 렌더링한 후 로딩 상태를 확인한 후 요청을 해결한 후 성공 또는 오류 출력을 확인하세요. 기대되는 최종 요소에 대한 쿼리를 사용하여 거부된 요청을 명시적으로 하세요. 그렇지 않으면 테스트가 통과할 수 있습니다. 컴포넌트가 의도한 branch로 도달하지 못했기 때문입니다. useNavigation 네이티브 모듈 mock
Async data deserves the same discipline. Mock the API or repository response, render the screen, assert the loading state, resolve the request, then assert success or error output. Use findBy 시나리오
RNTL과 함께 가장 좋음
E2E Validation이 필요함
| __CAPGO_KEEP_0__ | __CAPGO_KEEP_0__ | __CAPGO_KEEP_0__ |
|---|---|---|
| 형식 유효성 검사 및 표시 오류 | 네 | 보통 아님 |
| 모의 저장소에서 로딩, 성공 및 오류 UI 가져오기 | 네 | 중요한 프로덕션 흐름 |
| 등록된 화면 간의 네비게이션 | 네, 테스트 네비게이터와 함께 | 네, 제스처, 깊이 링크 또는 플랫폼 동작이 중요할 때 |
| AsyncStorage 상태 결정 | 네, 제어된 모의와 함께 | 네, 런칭 및 영구성이 네이티브 라이프 사이클과 상호 작용할 때 |
| 카메라, 생체 인식, 권한, 또는 플랫폼 API | JS 대체 로직 및 branch | 실제 장치 또는 대표 장치에서 |
| 레이아웃, 렌더링 성능 및 네이티브 code | 아니오 | 장치 또는 특수 도구를 사용하여 |
실제 장치 테스트를 위해 의존성을 모킹하여 자바스크립트 결정을 테스트하고, 의존성의 실제 동작을 확인하기 위해 장치 테스트를 실행하는 경계는 실용적입니다.
불안정한 테스트 디버깅 CI 및 성능 검사
불안정한 테스트는 일반적으로 시간, 공유 상태 또는 UI와 경쟁하는 어설션과 관련이 있습니다. 시간 초과를 설정하기 전에 해당 조건을 식별해야 합니다. 더 긴 시간 초과는 스케줄링 문제를 숨길 수 있고 테스트 스위트의 속도를 느리게 할 수 있습니다.
사용 findBy 업데이트 후 나타날 것으로 예상되는 요소에 대해 사용합니다. 사용 waitFor 상태 조건 또는 모의 호출에 대해 사용합니다. 가짜 타이머가 활성화된 경우, 상호 작용이 필요할 때 타이머를 앞서고, 실제 타이머를 나중에 복원하세요. act warning은 React가 예상하지 못한 상호 작용 경계 외부에서 업데이트를 관찰했다는 것을 의미합니다. 누락된 사용자 상호 작용 또는 타이머 플러시 대신 경고를 억제하는 대신 누락된 사용자 상호 작용 또는 타이머 플러시를 고치세요. awaitCI 실패를 재현하세요
신뢰할 수 있는 CI 작업은 lock파일에서 설치하고 로컬에서 사용하는 동일한 Jest 명령을 실행하며 모의 상태를 분리합니다. 테스트 간 모의 호출을 클리어하고 모듈 수준 상태가 동작에 영향을 미치는 경우 모듈을 초기화하고 실행 순서에 의존하는 종속성을 제거하세요. Jest 캐싱은 feedback를 빠르게 하지만 종속성 또는 구성 변경이 적절한 캐시 무효화가 필요합니다.
CI 전용 실패는 컴포넌트 리팩토링 전에 환경 비교가 필요합니다. Node, 패키지 관리자, Jest 워커 설정, 타이머 구성 및 환경 변수를 확인하세요. 가능한 경우 로컬에서 동일한 명령을 재현한 다음 실패하는 테스트를 가장 작은 상호 작용으로 줄여서 차이점을 노출하세요.
관찰성은 다른 단계를 καλύ준다. React Native에 대한 Sentry와 같은 도구는 실제 장치 및 네이티브 통합과 관련된 실패를 재현할 수 없는 모의된 컴포넌트 테스트에서 생산 오류 컨텍스트를 제공합니다.
보안에 민감한 여행은 두 번째 경계가 필요합니다. 컴포넌트 테스트를 사용하여 유효성 검사 및 상태 전환을 수행한 다음 장치 수준의 커버리지를 추가하여 핸드오프 및 네이티브 동작을 테스트하세요. 한 번만 __CAPGO_KEEP_0__ 흐름을 테스트할 때, 그 통합이 여행의 일부가 되는 경우 SMS 인증 흐름을 테스트하는 방법에 대한 지침을 참조하세요. 성능은 측정으로 간주하세요, 아니라 선언으로 warning은 React가 예상하지 못한 상호 작용 경계 외부에서 업데이트를 관찰했다는 것을 의미합니다. 누락된 사용자 상호 작용 또는 타이머 플러시 대신 경고를 억제하는 대신 누락된 사용자 상호 작용 또는 타이머 플러시를 고치세요.
Security-sensitive journeys need a second boundary. Use component tests for validation and state transitions, then add device-level coverage for the handoff and native behavior. For one-time-code flows, consult guidance on how to CI 실패를 재현하세요. 신뢰할 수 있는 CI 작업은 lock파일에서 설치하고 로컬에서 사용하는 동일한 Jest 명령을 실행하며 모의 상태를 분리합니다. 테스트 간 모의 호출을 클리어하고 모듈 수준 상태가 동작에 영향을 미치는 경우 모듈을 초기화하고 실행 순서에 의존하는 종속성을 제거하세요. Jest 캐싱은 feedback를 빠르게 하지만 종속성 또는 구성 변경이 적절한 캐시 무효화가 필요합니다.
CI 전용 실패는 컴포넌트 리팩토링 전에 환경 비교가 필요합니다. Node, 패키지 관리자, Jest 워커 설정, 타이머 구성 및 환경 변수를 확인하세요. 가능한 경우 로컬에서 동일한 명령을 재현한 다음 실패하는 테스트를 가장 작은 상호 작용으로 줄여서 차이점을 노출하세요.
기능 테스트는 목록이 렌더링되는지 확인할 수 있지만, 리팩토링이 렌더링 시간이나 렌더링 횟수가 변경되었는지 신뢰할 수 없다. 테스트 런타임은 잡음이 발생한다. 특정 시나리오에서 측정치를 재사용하고 시나리오를 반복하여 분산을 줄이고 통계 분석을 적용한 후 의미 있는 변경을 보고한다. 성능 테스트 문서 CI 및 pull-request 리뷰를 위한 적절한 보고서도 포함한다.
고정된 단언을 피하라. 예를 들어, "이 렌더링이 특정 임계값 이하로 끝나야 한다."라고 말하는 것은 CI 작업자가 false failure를 트리거할 수 있기 때문이다. 반면에 임계값이 너무 느슨하면 실제 regressions을 놓치게 된다. 반복적인 측정치를 사용하여 regressions 신호를 얻은 후, 비교가 의미 있는 차이를 나타내면 컴포넌트와 디바이스 프로파일을 검사한다.
측정 규칙: 기능 테스트는 동작이 올바른지 여부를 대답한다. 성능 도구는 측정된 시나리오가 변경되었는지 여부를 대답한다. 두 질문을 분리한다.
모든 것을 함께 조합하고 앞으로 나아가기
React Native Testing Library는 테스트 전략의 빠른 layer에 속한다. 컴포넌트 동작, 가시 상태 변경, 접근성 결과, 유효성 검사, 가짜 데이터 상태, JavaScript 컴포넌트 간의 통합을 포함한다. 사용자가 관찰할 수 있는 테스트에 집중하고, 실패가 특정 동작을指示하는 대신 렌더링 tree의 큰 부분을指示하지 않도록 한다.
작은 디바이스 기반 layer는 mocks가 있는 흐름을 보호해야 한다. React Native의 테스트 개요 RNTL은 완전한 React Native 런타임을 제공하지 않으며 네이티브 기능을 테스트할 수 없습니다. 같은 지침은 Detox와 같은 E2E 도구와 함께 인증, 결제, 핵심 앱 기능과 같은 중요한 흐름을 pair하여 네이티브 기능을 테스트할 수 있습니다.
실용적인 마이그레이션 경로
기존의 테스트 스위트를 한 번에 다시 작성할 필요가 없습니다.
- 가치 있는 비즈니스 테스트를 유지하세요. 순수한 상태와 도메인 로직을 집중된 단위 테스트로 옮겨서 명확한 feedback를 제공하세요.
- implementation assertion을 먼저 대체하세요. prop와 내부 상태 검사를 visible output, accessibility state, interaction outcome로 변경하세요.
- 스냅샷을 축소하세요. 리뷰어들이 이해하고 유지할 수 있는 스냅샷만 유지하세요.
- 네이티브 경계를 테스트하세요. 매우 중요한 모듈을 mock한 경우, 여전히 유효성 검사를 필요로 하는 디바이스 동작을 식별하세요.
- 중요한 여행을 보호하세요. 인증, 결제, 핵심 네비게이션, 권한, 그리고 native 동작이 결과를 변경할 수 있는 다른 흐름에 대한 E2E 보장을 추가하세요.
- Sensitive 화면을 별도로 측정하세요. 리스트, 피드, 비용이 많이 드는 렌더 경로 대신 Jest 지속 시간에서 추측하지 않고 반복적인 성능 비교를 사용하세요.
릴리즈 신뢰를 위해 CI/CD 통합 테스트에 연결하세요. CI/CD 통합 테스트 Capgo는 CapacitorJS 및 Electron 애플리케이션에 대한 signed 웹 번들을 대상 채널로 전달하여 JavaScript 및 자산 수정을 validated layer에서 validated layer로 전달할 수 있습니다. 이 배포 워크플로우는 React Native 장치 테스트를 대체하지 않지만 동일한 원칙을 보여줍니다: behavior를 실행하는 layer에서 behavior를 validate하세요.
React Native 테스트 라이브러리가 앱의 전체 테스트를 수행할 수 있는지 여부가 중요한 질문이 아닙니다. 그것은 할 수 없으며 공식적인 경계는 유용합니다. 중요한 위험에 대한 테스트가 실행 가능한 환경에서 실행되는지 여부가 중요한 질문입니다.
Capgo는 validated JavaScript 및 자산 변경을 CapacitorJS 및 Electron 팀에 대한 controlled 배포에 연결합니다. 대상 채널, 배포 시각화, 롤백 보호와 함께. Capgo Capgo UI string (parent key `submitting_a_pr_to_capgo`). Page/area: Capgo marketing website. Role: Website copy sentence. Seen in: page contributing.astro. Preserve Capgo product/brand and developer terms exactly. Message key `submitting_a_pr_to_capgo` (Submitting A Pr To Capgo).
