创新互联百度小程序教程：脚本示例

脚本示例
- 完整示例
- 测试对象
- 初始化环境
- 脚本编写
  - 1. 测试搜索框文字
  - 2. 测试列表项
  - 3. 测试列表项行为
- 脚本执行

脚本示例

智能小程序自动化 SDK 本身不提供测试框架。这意味着你可以将它与市面上流行的任意 Node.js 测试框架结合使用，以此来达到编写小程序测试用例的目的。接下来将使用 Jest 测试框架来编写一个实际的小程序自动化测试。

创新互联公司是一家集网站建设,横山企业网站建设,横山品牌网站建设,网站定制,横山网站建设报价,网络营销,网络优化,横山网站推广为一体的创新建站企业，帮助传统企业提升企业形象加强企业竞争力。可充分满足这一群体相比中小企业更为丰富、高端、多元的互联网需求。同时我们时刻保持专业、时尚、前沿，时刻以成就客户成长自我，坚持不断学习、思考、沉淀、净化自己，让我们为更多的企业打造出实用型网站。

完整示例

以下讲解内容的完整示例可以从点击这里下载，确保运行环境符合要求后，执行以下命令，即可开始在工具中运行自动化测试。

 
 
 
  
  
  npm install  
  
  npm run test

Tips: 如果在安装jest过程中出现下图提示，请点击“安装”。

接下来，我们分步骤对整个测试用例的编写过程进行介绍。

测试对象

这里以小程序示例为测试对象，将小程序示例的源码下载到本地，然后打开小程序开发者工具，将该项目导入进去。

初始化环境

新建文件夹test目录用于放置测试代码，执行以下命令安装依赖：

 
 
 
  
  
  npm i swan-automator jest --save-dev

按照快速开始中的使用说明安装符合要求的开发者工具版本并配置运行环境。

脚本编写

现在我们准备为小程序示例的组件首页编写测试用例，如下图所示：

创建测试文件 test/component.spec.js 后，首先要做的是：

启动并连接工具
重新启动小程序到组件首页
断开连接并关闭工具

对应脚本如下：

 
 
 
  
  
  const automator = require('swan-automator');  
  
    
  
  describe('index', () => {  
  
   let smartProgram;  
  
   let page;  
  
    
  
   beforeAll(async () => {  
  
   smartProgram = await automator.launch({  
  
   projectPath: 'path/to/swan-demo'  
  
   });  
  
   page = await smartProgram.reLaunch('/pages/component/component');  
  
   }, 50000);  
  
    
  
   afterAll(async () => {  
  
   await smartProgram.close();  
  
   });  
  
  });

开发者工具项目窗口启动及初次编译需要一定时长，Jest 默认 5 秒超时太短，需修改。

1. 测试搜索框文字

通过 text 选择器获取目标元素
目标元素应该是个 text 组件
目标元素应该包含有“搜索组件和接口”的文本

对应脚本如下：

 
 
 
  
  
  it('text', async () => {  
  
   const text = await page.$('text');  
  
   expect(text.tagName).toBe('text');  
  
   expect(await text.text()).toContain('搜索组件和接口');  
  
  });

2. 测试列表项

获取列表元素集合
目标元素集的个数应该是 8 个
第一个列表元素的标题应该是“视图窗器”

对应脚本如下：

 
 
 
  
  
  it('items', async () => {  
  
   const lists = await page.$$('.item');  
  
   expect(lists.length).toBe(8);  
  
   const list = await lists[0].$('.item-desc');  
  
   expect(await list.text()).toBe('视图容器');  
  
  });

3. 测试列表项行为

点击列表标题应该展示或隐藏子列表
点击子列表项应该会跳转到指定页面

对应脚本如下：

 
 
 
  
  
  it('item action', async () => {  
  
   const className = 'item-close';  
  
   const firstItem = await page.$('.item');  
  
   expect(await firstItem.attribute('class')).toContain(className);  
  
   await firstItem.tap();  
  
   expect(await firstItem.attribute('class')).toEqual(expect.not.stringContaining(className));  
  
   await firstItem.tap();  
  
   expect(await firstItem.attribute('class')).toContain(className);  
  
    
  
   await firstItem.tap();  
  
   const subItem = await page.$('.sub-item');  
  
   await subItem.tap();  
  
   await page.waitFor(500);  
  
   expect((await smartProgram.currentPage()).path).toBe('pages/view/view');  
  
  });

脚本执行

编写完脚本后直接执行以下脚本：

 
 
 
  
  
  npx jest test/component.spec.js

如果看到控制台输出以下信息，说明测试成功。

 
 
 
  
  
   PASS test/component.spec.js (23.384s)  
  
   index  
  
    text (82ms)  
  
    items (34ms)  
  
    item action (642ms)  
  
    
  
  Test Suites: 1 passed, 1 total  
  
  Tests: 3 passed, 3 total  
  
  Snapshots: 0 total  
  
  Time: 24.522s, estimated 33s  
  
  Ran all test suites matching /test\/component.spec.js/i.

分享标题：创新互联百度小程序教程：脚本示例
本文地址：http://www.shufengxianlan.com/qtweb/news7/503907.html

网站建设、网络推广公司-创新互联，是专注品牌与效果的网站制作，网络营销seo公司；服务项目有等

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源：创新互联

猜你还喜欢下面的内容