Chai Smoothie - Protractor 断言库 for Chai

Chai Smoothie 使您的 Protractor 驱动的自动化 Web 测试更加流畅。

该库提供了一组自定义的 Chai 断言，帮助您基于 Protractor 的 Serenity/JS 测试更好地表达其意图，赋予断言错误更多意义，并减少团队在故障排除方面花费的时间。

Chai Smoothie 附带 TypeScript 类型定义，并且与 Chai-as-Promised、Serenity/JS 和普通的 Protractor 测试兼容！

将 Chai Smoothie 添加到您的 Node.js 项目中

npm install chai-smoothie --save-dev

动机和（缺失的）上下文

假设我们想更多地了解定义为以下的 HTML 元素的状态

<h1 id="title">Chai Smoothie is delicious!</h1>

Protractor 测试中使用的典型方法用于检查元素是否显示，大体上类似于

expect(element(by.id('title')).isDisplayed()).to.eventually.be.true

当标识为“title” 的元素显示时，断言正常工作，不会给我们带来困扰。

但是，如果该元素决定不出现，断言将失败，并告诉我们

AssertionError: expected false to be true

尽管 Chai 尽力告诉我们失败的原因，但使用这种方法，它唯一可用的信息是元素可见性的布尔状态。这种缺乏上下文导致错误消息不太有用。

Chai Smoothie 为 Chai 提供了缺失的上下文，并使断言更易读！

如果您的自动化 Web 测试使用 Protractor，您可以使用 Chai Smoothie 将上一个示例中的断言更改为更易读的内容

expect(element(by.id('title'))).to.eventually.be.displayed

如果上述断言失败，错误消息将更有信息量

AssertionError: Expected the element located By(css selector, *[id="title"]) to be displayed, but it's not.

由于 Serenity/JS 建立在 Protractor 的基础上，您可以使用类似的语法与 Serenity/JS Questions 一同使用

expect(actor.toSee(WebElement.of(Article.Title))).displayed

使用开源 Serenity/JS 库还具有许多其他好处 - 了解更多。

首先，如果您还没有在项目中安装 Chai，请安装它

npm install chai --save-dev

接下来，安装 Chai Smoothie

npm install chai-smoothie --save-dev

import chai = require('chai');
chai.use(require('chai-smoothie'));
const expect = chai.expect;

expect(element(by.css('h1'))).to.be.present;

var chai = require('chai');
chai.use(require('chai-smoothie'));
var expect = chai.expect;

expect(element(by.css('h1'))).to.be.present;

Chai Smoothie 提供以下断言，每个断言都可以

使用 not 运算符进行否定：expect(el).not.to.be.displayed、expect(el).not.to.be.present.eventually 等。
与 chai-as-promised 结合使用，突出显示 Chai Smoothie 断言返回承诺：return expect(el).to.eventually.be.present。

断言	示例	含义	Protractor API
displayed	`expect(el).to.be.displayed`	元素存在于 DOM 中且可见	`isDisplayed()`
enabled	`expect(el).to.be.enabled`	表单控件元素，例如 `input`，未禁用	`isEnabled()`
present	`expect(el).to.be.present`	元素存在于 DOM 中，但可以隐藏	`isPresent()`
selected	`expect(el).to.be.selected`	表单控件，例如 `input` `checkbox` 已选中	`isSelected()`
text()	`expect(el).to.have.text('some text')` 或 `expect(el).to.contain.text('some text')`	元素具有/包含给定文本	`getText()`

要询问有关 Serenity/JS 或其任何组件（如 Chai Smoothie）的使用和故障排除，请在 StackOverflow 上发布一个带有 serenity-js 标签的问题。

您觉得 Chai Smoothie 有用吗？为它加一颗星！ ★

发现错误了吗？需要某个功能？提出一个问题或提交一个拉取请求。

有反馈吗？请在 Twitter 上告诉我：@JanMolak

Chai Smoothie 库在 Apache-2.0 许可证下发布。

如果您有兴趣了解商业许可证、培训、支持或让您的团队掌握现代软件开发实践，请联系我们。