建站
咨詢(xún)
售后
建站咨詢(xún)
新聞中心
- 腳本示例
- 完整示例
- 測(cè)試對(duì)象
- 初始化環(huán)境
- 腳本編寫(xiě)
- 1. 測(cè)試搜索框文字
- 2. 測(cè)試列表項(xiàng)
- 3. 測(cè)試列表項(xiàng)行為
- 腳本執(zhí)行
腳本示例
智能小程序自動(dòng)化 SDK 本身不提供測(cè)試框架。這意味著你可以將它與市面上流行的任意 Node.js 測(cè)試框架結(jié)合使用，以此來(lái)達(dá)到編寫(xiě)小程序測(cè)試用例的目的。接下來(lái)將使用 Jest 測(cè)試框架來(lái)編寫(xiě)一個(gè)實(shí)際的小程序自動(dòng)化測(cè)試。
創(chuàng)新互聯(lián)公司是一家集網(wǎng)站建設(shè),橫山企業(yè)網(wǎng)站建設(shè),橫山品牌網(wǎng)站建設(shè),網(wǎng)站定制,橫山網(wǎng)站建設(shè)報(bào)價(jià),網(wǎng)絡(luò)營(yíng)銷(xiāo),網(wǎng)絡(luò)優(yōu)化,橫山網(wǎng)站推廣為一體的創(chuàng)新建站企業(yè)，幫助傳統(tǒng)企業(yè)提升企業(yè)形象加強(qiáng)企業(yè)競(jìng)爭(zhēng)力。可充分滿(mǎn)足這一群體相比中小企業(yè)更為豐富、高端、多元的互聯(lián)網(wǎng)需求。同時(shí)我們時(shí)刻保持專(zhuān)業(yè)、時(shí)尚、前沿，時(shí)刻以成就客戶(hù)成長(zhǎng)自我，堅(jiān)持不斷學(xué)習(xí)、思考、沉淀、凈化自己，讓我們?yōu)楦嗟钠髽I(yè)打造出實(shí)用型網(wǎng)站。
完整示例
以下講解內(nèi)容的完整示例可以從 點(diǎn)擊這里 下載，確保 運(yùn)行環(huán)境 符合要求后，執(zhí)行以下命令，即可開(kāi)始在工具中運(yùn)行自動(dòng)化測(cè)試。
npm installnpm run test
Tips: 如果在安裝jest過(guò)程中出現(xiàn)下圖提示，請(qǐng)點(diǎn)擊“安裝”。
接下來(lái)，我們分步驟對(duì)整個(gè)測(cè)試用例的編寫(xiě)過(guò)程進(jìn)行介紹。
測(cè)試對(duì)象
這里以小程序示例為測(cè)試對(duì)象，將 小程序示例 的源碼下載到本地，然后打開(kāi)小程序開(kāi)發(fā)者工具，將該項(xiàng)目導(dǎo)入進(jìn)去。
初始化環(huán)境
新建文件夾test目錄用于放置測(cè)試代碼，執(zhí)行以下命令安裝依賴(lài)：
npm i swan-automator jest --save-dev
按照 快速開(kāi)始 中的使用說(shuō)明安裝符合要求的開(kāi)發(fā)者工具版本并配置運(yùn)行環(huán)境。
腳本編寫(xiě)
現(xiàn)在我們準(zhǔn)備為小程序示例的組件首頁(yè)編寫(xiě)測(cè)試用例，如下圖所示：
創(chuàng)建測(cè)試文件 test/component.spec.js 后，首先要做的是：
- 啟動(dòng)并連接工具
- 重新啟動(dòng)小程序到組件首頁(yè)
- 斷開(kāi)連接并關(guān)閉工具
對(duì)應(yīng)腳本如下：
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();});});
開(kāi)發(fā)者工具項(xiàng)目窗口啟動(dòng)及初次編譯需要一定時(shí)長(zhǎng)，Jest 默認(rèn) 5 秒超時(shí)太短，需修改。
1. 測(cè)試搜索框文字
- 通過(guò) text 選擇器獲取目標(biāo)元素
- 目標(biāo)元素應(yīng)該是個(gè) text 組件
- 目標(biāo)元素應(yīng)該包含有“搜索組件和接口”的文本
對(duì)應(yīng)腳本如下：
it('text', async () => {const text = await page.$('text');expect(text.tagName).toBe('text');expect(await text.text()).toContain('搜索組件和接口');});
2. 測(cè)試列表項(xiàng)
- 獲取列表元素集合
- 目標(biāo)元素集的個(gè)數(shù)應(yīng)該是 8 個(gè)
- 第一個(gè)列表元素的標(biāo)題應(yīng)該是“視圖窗器”
對(duì)應(yīng)腳本如下：
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. 測(cè)試列表項(xiàng)行為
- 點(diǎn)擊列表標(biāo)題應(yīng)該展示或隱藏子列表
- 點(diǎn)擊子列表項(xiàng)應(yīng)該會(huì)跳轉(zhuǎn)到指定頁(yè)面
對(duì)應(yīng)腳本如下：
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');});
腳本執(zhí)行
編寫(xiě)完腳本后直接執(zhí)行以下腳本：
npx jest test/component.spec.js
如果看到控制臺(tái)輸出以下信息，說(shuō)明測(cè)試成功。
PASS test/component.spec.js (23.384s)indextext (82ms)items (34ms)item action (642ms)Test Suites: 1 passed, 1 totalTests: 3 passed, 3 totalSnapshots: 0 totalTime: 24.522s, estimated 33sRan all test suites matching /test\/component.spec.js/i.
標(biāo)題名稱(chēng)：創(chuàng)新互聯(lián)百度小程序教程：腳本示例
網(wǎng)頁(yè)鏈接：http://m.fisionsoft.com.cn/article/coijjgh.html
