关于前端自动化

Jest基础

Jest优点
1. 主流框架：Mocha、Jasmine、Jest
2. 优点：比较新，基础好，速度快（单独模块测试功能），API相对简单，隔离性好，IDE整合，多项目运行，覆盖率。
3. 步骤：
  1. npm下载jest
  2. 需要创建test文件
  3. 利用test以及expect进行代码检查
    1. 文件：
    2. 检查文件：
    3. 执行结果：
  4. 基本配置和测试覆盖率生成：
    1. 单元测试：对于一个模块的测试
    2. 集成测试：所有模块进行集成测试（组合之后做的事情）
    3. 使用npx jest进行测试覆盖率的生成：
    4. 最终生成了jest.config.js文件
    5. 使用npx jest --coverage来生成代码测试率文件：
  5. Jest的匹配器：
    1. 看个例子，这个是不相等的，因为指向的地址是错误的（因为tobe是绝对匹配）：
    2. 但是对于toEqual，他只是值匹配
    3. toBeNull匹配就是如果a是null的话就匹配成功
    4. 还有ToBeUndefined、toBeDefined（给任何值都可以通过测试）、toBeNaN
    5. toBeTruth，只要是false就不能通过，toBeFalse就是通过假值的
    6. toBeGreaterThan就是传入的参数小于expect的参数就可以通过，大于是toBeLessThan、小于等于是toBeGreateThanOrEqual
    7. toBeCloseTo，针对js精度问题 0.1+0.2 ==0.3，正常情况下不可以等于，但是使用这个匹配器就可以使用
    8. toMatch匹配器主要是匹配字符串，判断是否包含里面有该字符串
    9. toContain匹配的主要是数组中的内容
    10. toThrow匹配器，就是匹配一场，不抛出异常可以用not
    11. 让jest支持import和es6语法（可以使用babel进行转化（es6转化为commanjs））：
      1. 直接编写babel文件
    12. 异步代码的测试方法：
      1. 通过jest测试以axios为例的异步代码，还是用test，expect进行书写
      2. 主要是test两个参数，一个是名称，还有一个是箭头函数，箭头函数里面还嵌套一个箭头函数，最后用expect以及toequal来进行判断
      3. 但是上述是有坑的，因为只到了请求网页的步骤，没有到返回数据的步骤
      4. 所以需要在success之后加入done（）才能避免最后的结果
      5. 遇到promise返回值时候，在测试的箭头函数函数体前面加return
      6. 提供了断言的功能，就是必须执行一次expect，expect.assertions（1）
      7. test测试采用saync和await方法，也就是test的第二个函数参数加入async和await，转换成promise对象之后然后用toMatchobject进行比对!
      8. 当然上述写法也可以用 response = await fetchData（）的返回结果，之后根据response.data进行对比（使用toEqual）
      9. Jest的四个钩子函数
        
        beforeAll就是在测试用例之前进行的
        
        afterAll就是在测试用例之后进行
        
        beforeEach在每个测试用例测试之前都要执行这个方法
        
        aftereach之后就是每个测试用例执行之后完成之后执行，在afterall之前进行
  6. 对测试用例进行分组：
    1. 如果有很多测试用力的话，就需要对其进行分类：
    2. Jest提供的describe方法，第一个参数是描述，第二是一个箭头函数，里面加入相关测试用例的测试内容

关于前端自动化|青训营笔记

关于前端自动化

Jest基础

React项目的测试

Vue项目的测试