Thumbnail
BEST 개발 ・ 프로그래밍 모바일 앱 개발
TDD 개발 방법론을 활용한 React Native 앱 개발
(4.5)
39개의 수강평 ∙ 332명의 수강생

29,700원

지식공유자 : 박동호
총 18개 수업˙총 2시간 16분
평생 무제한 수강
수료증 발급 강의
초급 대상
내 목록 추가 290 공유
js k 프로필

beforeEach 코드가 작동하지 않습니다. js k 2달 전
AddToDo Component 강의의 AddToDo.spec.js 코드를 동작시켜보니 "Cannot read propery 'onAdded' of undefined" 라는 에러가 뜨면서 빌드에 실패합니다.  아래가 코드입니다. describe('Interaction', ()=> { let wrapper; let props; const text = "some ToDo" beforeEach(()=> { props = { onAdded: jest.fn() } wrapper = shallow(<AddToDo {...props}></AddToDo>) wrapper.find('TextInput').simulate('changeText', text) wrapper.find('Button').prop('onPress')(); }) it('should call the onAdded callback with input text', ()=>{ expect(props.onAdded).toHaveBeenCalledTimes(1); expect(props.onAdded).toHaveBeenCalledWith(text); }) }) beforeEach 콜백함수가 동작하지 않으면서 onAdded 변수가 초기화되지 않는 것으로 보이는데 구글링해도 답을 찾기 어렵네요ㅜㅜ beforeEach를 작성하기 이전의 TDD 코드들은 모두 동작하였습니다. 정 해결책을 찾지 못하게 된다면 TDD 부분을 넘어가고 컴포넌트와 앱 부분만 진행하더라도 무리는 없을까요? 혹시 모르니 package.json 코드도 첨부하겠습니다. { "name": "TDDRN", "version": "0.0.1", "private": true, "scripts": { "android": "react-native run-android", "ios": "react-native run-ios", "start": "react-native start", "test": "jest", "lint": "eslint ." }, "dependencies": { "react": "16.13.1", "react-native": "0.63.3" }, "devDependencies": { "@babel/core": "^7.12.3", "@babel/runtime": "^7.12.5", "@react-native-community/eslint-config": "^2.0.0", "babel-jest": "^26.6.3", "detox": "^17.11.4", "enzyme": "^3.11.0", "enzyme-adapter-react-16": "^1.15.5", "eslint": "^7.13.0", "jest": "^26.6.3", "metro-react-native-babel-preset": "^0.64.0", "react-dom": "^17.0.1", "react-test-renderer": "16.13.1" }, "jest": { "preset": "react-native", "setupFiles": [ "./tests/setup.js" ] }, "detox": { "test-runner":"jest", "configurations": { "ios.sim": { "binaryPath": "bin/Exponent.app", "type": "ios.simulator", "name": "iPhone 7" } } } }

0
황세호 프로필

저 또한 TextInput을 찾지 못합니다.. 황세호 6달 전
윗 분 질문이 동일하게 있으나 답변이 없어 다시 질문 올립니다!

0
황세호 프로필

enzyme 테스트 과정에서 오류가 발생했습니다. 황세호 6달 전

1
760kry@gmail.com 프로필

ios 폴더 아래에 build 폴더가 없고 Pods폴더가 있습니다. 760kry@gmail.com 7달 전
Pods라는 폴더가 있고 build폴더가 어디에도 보이지 않습니다.. 문서에도 예시로 아래와 같이 되어있는데요 .. 폴더가 없고 검색해봐도 방법을 찾지 못하겠네요 ...   "binaryPath": "ios/build/Build/Products/Debug-iphonesimulator/YourAppName.app",

7
정형수 프로필

detox test 정형수 7달 전
강사님 질문이 있습니다. detox 버전 업 때문인지 detox init 당시 강사님과 다른 설정이 나오고, detox test 전에 detox build를 하지 않으면 안됩니다... 버전 업 이후에는 test 전 반드시 build를 해야 하는건가요??

2
정형수 프로필

TextInput을 찾지 못합니다. 정형수 7달 전
텍스트 인풋을 찾지 못하고 실패합니다. 이유를 잘 모르겠습니다.

2
정형수 프로필

functional component 정형수 7달 전
wrapper.find("AddToDo") 에서 AddToDo 컴퍼넌트를 클래스로 만들 경우에만 동작하고 functional component로 만들 경우에는 아무 객체도 받지 못합니다. functional component로 테스팅할수 있는 방법이 있나요?

1
정형수 프로필

cocoapods 정형수 7달 전
처음 react-native-cli를 npm으로 설치하고 프로젝트를 시작했을 때, React-Native: Error: Failed to install CocoaPods dependencies for iOS project, which is required by this template 라는 에러가 발생했는데, 커맨드 라인에서 sudo gem install cocoapods를 실행하고 sudo xcode-select --switch /Applications/Xcode.app 를 실행했더니 정상적으로 설치가 되었습니다. 어떤게 문제였는지 궁금합니다. 그리고 프로젝트 폴더로 들어가서 react-native run-ios는 실행이 안되었고 npx react-native run-ios는 실행이 되는 부분도 궁금합니다.

2
gradler 프로필

테스트 케이스의 작성 범위 gradler 7달 전
안녕하세요 선배님 좀 어리석은 질문일수도 있습니다만, TDD 방법론으로 코드를 작성하는 경우 모든 코드에 대해 테스트 코드가 작성되는 것이 원칙인것 같습니다. 하지만 한국에서의 전통적인 SI 프로젝트는 기간과 범위가 매우 타이트하게 정해져 있기 때문에 TDD 방법론을 원칙에 따라 적용하기에는 한계가 있는 것도 사실입니다.  만일 모든 코드에 대한 테스트 작성이 어려운 상황이라면, 어떤 종류의 코드 또는 함수를 작성할 때는 테스트 코드를 작성하는게 좋다 라고 할만한 범위에 대한 가이드라인 같은게 있는지 궁금합니다.

1
61250 프로필

detox config 질문 61250 11달 전
안녕하세요 강의 잘 보고 있습니다. detox의 package.json에서 binaryPath 설정단계에 제 폴더에는 ios/build 폴더가 없어서 질문합니다. 이런 경우에는 어떻게 해야 하나요??

2
공부중 프로필

앞으로 작업에 강좌가 도움이 많이 되겠습니다 공부중 2020.01.02
늘 생각만하고 책을봐도 해결하지못한 부분들이 해결되어앞으로 잘 사용 할것같습니다 마지막 강좌에서 말씀하셨듯이 리덕스, 웹서비스 등등 중급강좌가 시급합니다 언른 시작해주세요!ㅎㅎ 개인적으론 파이어베이스 연동도 설명이 되면 좋겠습니다 그리고 간단하게라도 실제앱 개발처럼 작업과정을 좀 알려주시면 하는 바람이있습니다 큰 도움 받았습니다 고맙습니다

0
Ironlove 프로필

코드 커버리지 툴은 어떤걸 사용하시나요? Ironlove 2019.11.22
안녕하세요? 강좌 재미있게 잘 봤습니다. 저는 자바 기반으로는 유닛 테스트를 좀 해봤습니다. 제가 전에 자바로 테스팅 할 때는 코드커버리지 도구를 이용해서 전체 코드 중에 얼마나 테스트를 했는지 확인할 수 있었는데, 강사님은 현재 코드커버리지 도구를 사용중이신지 궁금하고 사용 중이시라면 어떤걸 이용하고 계신지 궁금합니다. 그리고 it(), expect(), 등등 테스트에 사용되는 도구들이 갖고 있는 기본 api 들에대해서 어떤 역할을 하는 것들인지도 쫌 설명이 있었으면 좋았을 것 같습니다. 지금 상태라면 각 함수들의 용도나 기능은 모른채로 강사님의 코드를 따라하기식으로 밖에는 테스트 케이스를 작성할 수 없을 것 같아요. 감사합니다~

1
leh2030 프로필

No tests found, exiting with code 1 에러 leh2030 2019.10.02
{ "name": "ReactNativeTDD", "version": "0.0.1", "private": true, "scripts": { "android": "react-native run-android", "ios": "react-native run-ios", "start": "react-native start", "test": "jest", "lint": "eslint ." }, "dependencies": { "react": "16.9.0", "react-native": "0.61.1" }, "devDependencies": { "@babel/core": "^7.6.2", "@babel/runtime": "^7.6.2", "@react-native-community/eslint-config": "^0.0.5", "babel-jest": "^24.9.0", "eslint": "^6.5.1", "jest": "^24.9.0", "metro-react-native-babel-preset": "^0.56.0", "react-test-renderer": "16.9.0" }, "jest": { "preset": "react-native" } } __tests__ 폴더명 변경 시 yarn run test 를 하게 되면 testMatch: **/__tests__/**/*.[jt]s?(x), **/?(*.)+(spec|test).[tj]s?(x) - 0 matches 이렇게 테스트가 작성된 폴더를 찾지 못하는 경우가 있습니다. 강의의 진행과 동일하게 했는데도 이렇게 에러가 나네요. 검색 결과 package.json 파일에서 "jest" : { "preset": "react-native", "testRegex": "(/tests/.*|(\\.|/)(test))\\.js$" } 이렇게 testRegex 에 대한 추가 설정을 해주고 나면 테스트 폴더가 잡힙니다. 무슨 문제인지 알고 싶습니다.

2
박동조 박 프로필

onCompleted와 onDeleted를 따로 describe로 나누시는 이유가 궁금합니다. 박동조 박 2019.08.14
안녕하세요. 궁금한 점이 있어 질문 올립니다.  TodoItem.spec.js 에서  onCompleted callback 하는 단위 테스트와  onDeleted callback 하는 단위 테스트를 각각 describe 해서 그룹테스트로 나누시던데, 그 이유가 궁금합니다.   beforeEach(() => { // 테스트 진행 이전 호출 props = { item: { text: 'first todo', done: false }, index: 0, onCompleted: jest.fn(), onDeleted: jest.fn() } wrapper = shallow(<TodoItem {...props}></TodoItem>); wrapper.find('Button').at(0).simulate('press'); wrapper.find('Button').at(1).simulate('press'); // wrapper.find('Button').prop('onPress')(); }) it('should call the onCompleted callback with index', () => { expect(props.onCompleted).toHaveBeenCalledTimes(1); expect(props.onCompleted).toHaveBeenCalledWith(props.index); }) it('should call the onDeleted callback with index', () => { expect(props.onDeleted).toHaveBeenCalledTimes(1); expect(props.onDeleted).toHaveBeenCalledWith(props.index); }) 왜 위와 같이 같은 describe 그룹테스트 안에 안두시나요? 개념적으로 제가 부족한건 아닌가 싶어서 질문드렸습니다.

2
박동조 박 프로필

enzyme를 사용하는데 있어서 문제가 있습니다. 박동조 박 2019.07.10
이전 분이 올려주신 질문과 동일한 에러가 납니다. 원인은 두가지가 있었는데요.   1. 첫번째 setup.js 파일을 __test__ 디렉토리에서 테스트 파일로 인식하는듯 하다. 2. 두번째 shallow(<Text>{test}</Text>).text() 의 반환값이 <TouchableText />로 나온다     첫번째는 setup.js파일을 __test__디렉토리 밖으로 빼줌으로써 해결했구요. 두번째는 shallow(<Text>{test}</Text>).text() 는 잘 동작하지 않지만, shallow(<div>{test}</div >).text() 는 일단 잘 동작하는 걸로 확인 되었습니다.   그래서 우선 제가 예상하기론 react-native와 enzyme의 버전 호환성 문제가 아닐까 싶기도 하구요. 또는 jest와의 버전 호환성 문제가 아닐까 생각이 됩니다.   아래는 저의 버전 상태입니다. ------------------- "react": "16.8.3", "react-native": "0.59.9"     "@babel/core": "7.5.4", "@babel/runtime": "7.5.4", "babel-jest": "24.8.0", "enzyme": "^3.10.0", "enzyme-adapter-react-16": "^1.14.0", "jest": "24.8.0", "metro-react-native-babel-preset": "0.55.0", "react-dom": "^16.8.6", "react-test-renderer": "16.8.3"    

7

29,700원

내 목록 추가 290 공유
지식공유자 : 박동호
총 18개 수업˙총 2시간 16분
평생 무제한 수강
수료증 발급 강의
초급 대상
지식공유자 되기
많은 사람들에게 배움의 기회를 주고,
경제적 보상을 받아보세요.
지식공유참여
기업 교육을 위한 인프런
“인프런 비즈니스” 를 통해 모든 팀원이 인프런의 강의들을
자유롭게 학습하는 환경을 제공하세요.
인프런 비즈니스