Detox : 여러 줄 TextInput을 테스트하는 방법

Question

반응이있는 기본 응용 프로그램에서 detox를 사용하여 양식을 테스트하려고합니다.

양식의 입력 중 하나는 multiline={true}입니다.

나는 다음과 같은 테스트를 실행하려고 :

는

const inputElement = element(by.id('input_multiline')); 
await expect(inputElement).toBeVisible(); 
await inputElement.typeText('line1\n'); 
await inputElement.typeText('line2\n'); 
await inputElement.typeText('line3\n'); 

const submitElement = element(by.id('submit')); 
await submitElement.toBeVisible(); 
await submitElement.tap(); 

이 테스트는 75 % 가시성 기준을 통과하지 못한, 키보드가 버튼을 제출 숨어 있기 때문이다.

일반적으로 multiline={false} 인 TextInput의 경우 입력 문자열에 자동으로 다음 단계로 이동하지만, 여러 줄 입력 \n은 새 줄을 추가하기 만하면됩니다.

해독에서이 검사를 통과하려면 어떻게해야합니까?

Answer 1

우선 Texture에 대해 multiline={true}으로 키보드를 닫을 수 있어야합니다.

이를 위해 우리는 react-native에서 Keyboard 모듈을 사용할 것입니다.

import {Keyboard} from 'react-native' 

이제 TouchableWithoutFeedback으로 양식을 감싸고 Press에서 Keyboard.dismiss()를 호출하십시오.

<TouchableWithoutFeedback onPress={Keyboard.dismiss}> 
    { /*your form goes here here*/ } 
</TouchableWithoutFeedback> 

이제 키보드를 닫으려면 detox 테스트를 수정하십시오.

const inputElement = element(by.id('input')); 
await expect(inputElement).toBeVisible(); 
await inputElement.typeText('line1\n'); 
await inputElement.typeText('line2\n'); 
await inputElement.typeText('line3\n'); 
// click somewhere outside the input 
await inputElement.tapAtPoint({x: 0, y: 1}); 

const submitElement = element(by.id('submit')); 
await submitElement.toBeVisible(); 
await submitElement.tap();