dlrandy
commented
6 years ago jest的一些测试问题和依赖包 的版本相关。
mock是你的一些方法，会在测试正式文件的时候替换调用，返回你想要的结果给正式的函数。 async的测试两种组合： 1、return promise + expect.assertions(num) 2、it 或者test的回调传一个done函数，在最终结束测试的时候，挑用done();
Open dlrandy opened 6 years ago
dlrandy
commented
6 years ago jest的一些测试问题和依赖包 的版本相关。
mock是你的一些方法，会在测试正式文件的时候替换调用，返回你想要的结果给正式的函数。 async的测试两种组合： 1、return promise + expect.assertions(num) 2、it 或者test的回调传一个done函数，在最终结束测试的时候，挑用done();
dlrandy
commented
6 years ago WHY USE JEST １、易于搭建 ２、可以并行运行测试 ３、快照测试 ４、Ｊａｓｍｉｎｅ 验证 5、代码覆盖报告 6、内置手动Mock
mock时候的路径，名字一定是要引用包的，路径一定是相对于当前的测试文件的
测试环境一般需要： jest (UT framework); babel-jest (support es6/7); enzyme(test utils for component); react-addons-test-utils(Enzyme的依赖， 也可以用来测试)； react-test-renderer(抓取组件的DOM tree快照的)； redux-mock-store(用来mock redux store的)。
命名约定就是test \ component.spec/test.js。mocks应该是模块挨着的直接子目录，当然也可以放在函数内部。
写组件的时候，最好是有多个单粒度的导出 （）
测试的组件不要使用decorator
https://medium.com/netscape/testing-a-react-redux-app-using-jest-and-enzyme-b349324803a9
dlrandy
commented
6 years ago 测试Connected 组件（container）的方法： 1、直接传递store，shallow render 2、把connected 组件包装在Provider里，全部渲染mount 3、上面的方法既可以使用伪store或者真正的store（多用于集成 测试，但是它可以捕获到state的变化）
npm test -- -u 或者 jest -- -u来更新snapshot jest -u 快照可以减少测试dumb组件的时间，一旦有变化，snapshot 验证就会报错。snapshot不处理事件和props等。这些是应该在组件里测试的。
所以说使用了snapshot测试组件，我们要测试的就是事件和属性 state等。
yarn test -- --coverage OR npm test -- --coverage
dlrandy
commented
6 years ago dlrandy
commented
6 years ago Snapshot多用于叶子组件 也可以用于connected组件，一个组件只能有一个snapshot文件，但是可以有多个snapshots。
create-react-app他的测试目录最好放在组件的目录里。单独放到根目录下是不好使得
dlrandy
commented
6 years ago 测试组件 的click等事件的时候 可以使用shallowWrapper或者ReactElement的props.event()来进行测试，然后判断调用次数 参数结果等
dlrandy
commented
6 years ago beforeEach 的变量是对应的 it/test 里的，而不是describe里的
beforeEach里的mock也是缓存的哦
dlrandy
commented
6 years ago Describe里一个it里的函数执行了，那么这个执行的 代码 在接下来的 it里也是算数的。
dlrandy
commented
6 years ago 写可测试的组件的时候，一般要注意多导出 小的组件，react里的chheckbox的checked赋值的时候一定要用！！强转移一下，否侧测试的时候又警告，同理radio等类似的元素。 要注意require和es6 模块的引入差别
import renderer from 'react-test-renderer'; jest的Snapshot智能用于renderer的方法
dlrandy
commented
6 years ago https://github.com/reactjs/redux/issues/1534
https://github.com/reactjs/react-redux/issues/325
https://github.com/facebook/react/issues/6779
https://facebook.github.io/immutable-js/docs/#/Record/toJS
https://tonyhb.gitbooks.io/redux-without-profanity/using_immutablejs_records.html
http://nicolerauch.de/posts/2016-05-16-shallow-rendering.html
https://github.com/reactjs/react-redux/blob/master/test/components/Provider.spec.js
https://medium.com/@visualskyrim/test-your-redux-container-with-enzyme-a0e10c0574ec
https://www.packtpub.com/mapt/book/web_development/9781786462398/8/08lvl1sec44/using-jest
https://www.learnhowtoprogram.com/react/react-and-redux/building-an-environment-testing-with-jest
https://thebrainfiles.wearebrain.com/use-jest-for-react-app-testing-95006dc8c4de
https://www.sitepoint.com/test-react-components-jest/
https://www.codesai.com/2017/06/testing-hacks-react-redux
https://www.codementor.io/mz026/unit-testing-a-redux-app-9wzb5uwlq
https://jonbellah.com/articles/intro-react-testing/
https://codeburst.io/unit-testing-react-redux-selectors-and-epics-664e7b4798a8
https://ericnish.io/blog/how-to-unit-test-react-redux-components/
http://frontend.turing.io/lessons/module-3/testing-redux.html
https://stackoverflow.com/questions/40134756/enzyme-check-checkbox-status/40186176
https://medium.com/netscape/testing-a-react-redux-app-using-jest-and-enzyme-b349324803a9
https://github.com/airbnb/enzyme/issues/1002
https://www.fullstackreact.com/30-days-of-react/day-25/
https://www.ximedes.com/test-redux-action-creators-with-jest/
https://redux.js.org/docs/recipes/WritingTests.html
https://stackoverflow.com/questions/33854103/why-were-javascript-atob-and-btoa-named-like-that
https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/Data_URIs
https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/btoa
dlrandy
commented
6 years ago jest 的mock如果需要引用其它的模块的话，需要直接在mock方法里直接require，不能再函数里引用外面的模块变量
dlrandy
commented
6 years ago jest 里修改window.location.hostname的时候，可以提供jest一个testURL的,这个方法不是很灵活，所以真要测试的灵活一些 可以找一些库
测试文件中有依赖模块的时候，可以使用的jest.mock方法来mock。主要是不想真正的引入某些模块，而只是mock一些 参数或者对象，以至于测试的文件不报错。这些都是要在beforeEach中执行的。