저는 Jest와 Enzyme의 테스트를 작성하여 React Native 응용 프로그램에서 구성 요소의 기능을 테스트했습니다.부모 클래스의 함수를 호출하여 자식 클래스 테스트
인스턴스 생성을 위해 부모에 메서드를 사용하는 부모 구성 요소와 하위 구성 요소가 있습니다. 즉 부모, 그래서
const TeamDetail = React.createClass({
propTypes: {
team: PropTypes.object.isRequired,
...[INSERT MANY REQUIRED PROPS HERE]
viewTeamMessageFeed: PropTypes.func.isRequired,
},
... INIT LOGIC ...
render() {
return (
<TabContainer
containerStyle={styles.tabContainer}
primaryTab={'board'}
tabs={this.tabs()}
/>
)
},
tabs() {
let tabs = [
this.tab('board', this.renderBoard()),
];
return (tabs);
},
tab(name: string, panel: Object) {
let empty = true;
return({name: name, panel: panel, empty: empty})
},
renderBoard() {
return(
<LeagueTeamAbout
item={this.props.team}
details={this.teamDetails()}
/>
)
},
...MORE METHODS...THIS NEXT ONE IS IMPORTANT:
renderMessagingButton() {
if (this.props.canMessage) {
return (
<StyledButton buttonText='Messaging' onPress={() => this.props.viewTeamMessageFeed(this.props.team)} />
);
}
return null;
...
OK : 정교
, 여기에 부모 클래스의 축약 버전입니다.
나는 부모 구성 요소 구성 요소가 teamDetails() 메소드에 의해 설정되는 세부 속성을 가지고 <LeagueTeamAbout/>
을 테스트하고 있습니다. teamDetails()
은 renderMessagingButton()
메소드로 설정된 메시징 속성을 포함하는 세부 사항 오브젝트를 리턴합니다.
messagingButton
이 사용자가 탭하면 viewTeamMessageFeed()
메서드를 실행하기를 기대하는 테스트를 작성하려고합니다.
이 테스트는 어떻게 작성합니까? 어떻게 든 renderMessagingButton()
을 호출하여 LeagueTeamAbout
세부 개체를 조롱해야합니다.
LeagueTeamAbout-test.js
파일에서 부모 구성 요소의 renderMessagingButton()
함수를 어떻게 호출합니까?