# frontendautomatedtest **Repository Path**: hewangjs/frontendautomatedtest ## Basic Information - **Project Name**: frontendautomatedtest - **Description**: 前端自动化测试-imooc-code-learn - **Primary Language**: Unknown - **License**: Not specified - **Default Branch**: master - **Homepage**: None - **GVP Project**: No ## Statistics - **Stars**: 0 - **Forks**: 0 - **Created**: 2022-11-26 - **Last Updated**: 2023-01-15 ## Categories & Tags **Categories**: Uncategorized **Tags**: None ## README ## 前端自动化测试 ### 第2章 Jest前端自动化测试框架基础入门 #### 2-1 自动化测试背景及原理 lesson1 #### 2-3 使用Jest修改自动化测试案例 lesson2 ```shell npm init npm install jest@24.8.0 -D # -D 只在开发环境下才会运行单元测试 npm install jest@24.8.0 --save-dev # 同样只在开发环境 "test": "jest" # package.json中scripts中增加命令 # 将math.js中的方法使用common.js导出供math.test.js使用 # jest包含test expect这些方法 ``` #### 2-4 jest的简单配置 lesson3 ```shell npx jest --init # 暴露jest配置，jest.config.js npx jest --coverage # 执行测试，并生成测试覆盖率报告 coverageDirectory: "coverage" # 测试覆盖率报告路径在当前文件夹下的coverage下 npm install @babel/core@7.4.5 @babel/preset-env@7.4.5 -D # 引入babel相关的库，将math.js和math.test.js 修改为ESModule导出和导入的形式，因为node环境下仅支持commonjs的语法 # 新建.babelrc babel配置文件 { "presets": [ # 插件预设 预设 一组插件集合 ["@babel/preset-env", { # 内部数组的第二项是当前预设的配置 "targets": { # 根据当前node环境使用@babel/preset-env转换当前的代码，例如将import语法转成 "node": "current" # commonsjs的语法 } }] ] } ``` 原理分析 运行npm run jest，jest中有babel-jest，检测当前目录下有bable bable-core，就取.babelrc中的配置，在运行测试之前，结合babel 先把代码做一次转化，再运行转换后的测试用例代码 #### 2-5 Jest中的匹配器 ```shell jest --watchAll # 文件变化后自动运行jest ``` 常用匹配器 toBe 类似于Object.is ==== toEqual 可比较对象内容相同 toBeNull 是不是null toBeUndefined 未定义 undefined toBeDefined 已经定义了 toBeTruthy 真 toBeFalsy 假 not 非，反向匹配器 toBeGreaterThan 大于 toBeLessThan 小于 toBeGreaterThanOrEqual 大于等于 toBeLessThanOrEqual 小于等于 toBeCloseTo 0.1 + 0.2 等于0.3 toMatch 字符串包含 支持正则 toContain 数组或集合包含 支持正则 toThrow 抛出某个异常 支持正则 node_module下的bin文件是做什么的？ #### 2-6 Jest 命令行工具使用 ```shell a模式 # 每次运行所有的测试文件 o模式 # 要配合git使用，要把文件git add 放到暂存区中，新建的文件，如果不添加到暂存区中也不会生效 p模式 # 配合测试文件的文件名，输入正则表达式，过滤文件名 t模式 # 匹配test的名称，输入正则表达式，过滤test名称 jest --watchAll # 是a模式, 运行所有的测试文件 jest --watch # 是o模式，只运行修改的测试文件 ``` #### 2-7 异步代码的测试方法 lesson6 含有回调的异步方法 异步方法，返回的是Promise #### 2-8 Jest中的钩子函数 beforeAll afterAll beforeEach #### 2-11 Jest中的Mock 模拟函数 npm install prettier@1.18.2 --save #### 3-1 快照测试 toMatchSnapshot 生成文件快照 toMatchInlineSnapshot 生成行内快照 #### 3-2 mock深入学习 jest.config.js automock 自动引入mock模块，jest会查找__mock__下面的mock文件，如果有的话会自动引入mock下面的文件模块模拟 #### 3-3 mock timers jest.useFakeTimers() // 使用假的定时器 jest.runAllTimers() // 跑完所有的定时器 jest.runOnlyPendingTimers() // 运行当前处于队列中的定时器 jest.advanceTimersByTime(3000) // 让时间快进3秒