Web自动化框架 Testcafe 入门

最新推荐文章于 2024-06-23 15:15:00 发布

黄美腻

最新推荐文章于 2024-06-23 15:15:00 发布

阅读量578

点赞数

分类专栏：自动化测试文章标签：软件测试

本文链接：https://blog.csdn.net/qq_27806965/article/details/113826692

版权

自动化测试专栏收录该内容

2 篇文章 0 订阅

订阅专栏

本文档详细介绍了TestCafe自动化测试框架的特性、优势与不足，包括其兼容性、集成性、验证功能及调试能力。通过实例展示了如何进行元素定位、执行操作、断言判断以及调试。此外，还提供了基础的脚本运行指令和断点调试方法，帮助初学者快速上手TestCafe。

摘要由CSDN通过智能技术生成

语言特点

优点：

兼容性好，可以支持各类的浏览器
集成性好，有一整套完整的自动化测试框架，不仅提供了案例的管理，运行，失败自动重跑，错误自动截图，并发等，对页面和页面元素的等待也封装完善而且使用简单，无需借助其他框架二次封装。
便于验证，可以控制整体的执行速度，甚至可以细到某个操作的执行速度；支持调试模式

缺点：

语言局限性，支持js ,TypeScript语言编写
学习资料较少，英语文档

官网：http：//devexpress.github.io/testcafe/

api文档：https：//devexpress.github.io/testcafe/documentation/getting-started/

脚本运行指令

testcafe安装成功后，打开终端，输入对应指令，会使用指定的浏览器运行脚本

testcafe chrome /YourPath/test1.js

#testcafe 浏览器 脚本路径

基础指令

1.元素获取和定位

https://devexpress.github.io/testcafe/documentation/test-api/selecting-page-elements/

简单元素的获取

Class用”.”来代表 ID用“#”来代表

有多个元素名字一样，用其他属性唯一定位

使用功能功能选择器来进行排查，可以通过在DOM层次结构中搜索元素或者过滤DOM节点

2.操作

https://devexpress.github.io/testcafe/documentation/test-api/actions/

等待

await t.wait(time)

点击

await t.click( selector [, options] )

延迟

await t.setTestSpeed(time)

拖动

await t.drag( selector, dragOffsetX, dragOffsetY [, options] )

输入文字

await t.typeText( selector, text [, options] )

附录：devexpressExample.js

实现输入文案、插入文案、按钮点击、滑竿设置

import { Selector } from 'testcafe';

const nameInput = Selector('#developer-name');
const checkbox = Selector('#remote-testing');
fixture `My fixture`
    .page `https://devexpress.github.io/testcafe/example/`;

test('Type and Replace', async t => {
    await t
        .setTestSpeed(0.01)
        .typeText(nameInput, 'Peter')   //输入Pater
        .typeText(nameInput, 'Paker', { replace: true })  //输入Paker
        .typeText(nameInput, 'r', { caretPos: 2 })  //第三个位置添加r
        .setNativeDialogHandler(() => true)   //关闭系统弹窗
        .click(checkbox)   //选择
        .click('#tried-test-cafe')   //选择
        .typeText('#comments', 'Peter')  //输入Peter
        .drag('.ui-state-default', 360, 0, { offsetX: 10, offsetY: 10 }) //从0拖动到5
        .click('#submit-button')  //提交
        .wait(3000)
});

3.断言

https://devexpress.github.io/testcafe/documentation/test-api/assertions/assertion-api.html

用于判断操作是否生效

等于/不等于:用于判断选项的值是否与预期的一致；返回值可以是文本、数字

await t.expect( actual ).eql( expected, message（选）, options（选） );
await t.expect( actual ).notEql( unexpected, message（选）, options（选） );

是/否：用于判断状态是否正确；返回值是bool值

await t.expect( actual ).ok( message（选）, options（选） ); 
await t.expect( actual ).notOk( message（选）, options（选） );

附录：assertioneeExample.js

实现下拉菜单选择、判断选择内容是否正确、勾选框是否选中

import { Selector } from 'testcafe';

const checkbox = Selector('#remote-testing');
const comboBox = Selector('#preferred-interface');

fixture `My fixture`
    .page `https://devexpress.github.io/testcafe/example/`;

test('Type and Replace', async t => {
    await t
        .setTestSpeed(0.01)
        .click(comboBox)
        // .debug()
        .click(comboBox.child(2))  //点击下拉菜单中的第三个选项
        // .debug()  //调试
        .expect(comboBox.value).eql('Both','值等于both', { timeout: 3500 })  //判断内容是否与预期的一致
        // .expect(comboBox.value).notEql('Both','值不等both', { timeout: 10500 });

        await t
         .click(checkbox)  //勾选框
         .expect(checkbox.checked).ok()  //确认选项是否选中
         .click(checkbox)
         .expect(checkbox.checked).notOk();

       
});