如何在Protractor/Gherkins中用Chai断言元素行数？验证表格tr数量为0

嘿，刚接触Cucumber/Protractor/Gherkins完全不用不好意思，这些工具上手确实需要点时间～我来帮你拆解需求，一步步实现你要的功能，顺便讲清楚Chai断言的用法！

1. 先写Gherkin功能文件（.feature） #

用自然语言把业务场景描述清楚，符合Gherkin的Given-When-Then结构，可读性拉满：

Feature: 位置表格数据验证
  用于验证搜索操作后表格的显示状态

  Scenario: 输入无效文本后表格无数据行
    Given 我进入了位置管理页面
    When 我在搜索框输入 "不存在的位置名称"
    Then 位置表格中应该没有任何数据行

2. 页面对象（Page Object）定义locationsTable #

页面对象模式能让元素定位和业务逻辑分离，后续维护更省心。这里我们把表格元素和相关操作封装起来：

// page-objects/locationsPage.js
module.exports = function() {
  // 定位整个位置表格
  this.locationsTable = element(by.css('table#locations-table'));
  // 定位搜索输入框
  this.searchInput = element(by.css('input#location-search'));

  // 获取表格中的所有数据行（跳过thead的表头行，避免统计错误）
  this.getTableDataRows = async function() {
    return await this.locationsTable.all(by.css('tbody tr'));
  };
};

小贴士：如果你的表格没有单独的tbody标签，直接用table tr也可以，但尽量用tbody区分表头和数据行，保证统计准确性。

3. 步骤定义（Step Definitions） #

把Gherkin的自然语言步骤转化为可执行代码，结合Protractor的异步操作和Chai断言：

// step-definitions/locationVerificationSteps.js
const { Given, When, Then } = require('cucumber');
const { expect } = require('chai');
const { browser, ExpectedConditions } = require('protractor');
const LocationsPage = require('../page-objects/locationsPage');

const locationsPage = new LocationsPage();

Given('我进入了位置管理页面', async function() {
  await browser.get('/locations'); // 替换成你的实际页面URL
});

When('我在搜索框输入 {string}', async function(searchText) {
  await locationsPage.searchInput.clear(); // 先清空输入框避免残留内容干扰
  await locationsPage.searchInput.sendKeys(searchText);
  // 等待搜索结果加载完成，避免断言时机过早导致结果不准确
  await browser.wait(
    ExpectedConditions.stalenessOf(await locationsPage.locationsTable.$('tr')),
    5000,
    '搜索结果加载超时'
  );
});

Then('位置表格中应该没有任何数据行', async function() {
  const dataRows = await locationsPage.getTableDataRows();
  // 用Chai断言行数为0
  expect(dataRows.length).to.equal(0);
});

关于Chai断言的更多用法 #

如果习惯用Promise链式调用（不用async/await），可以结合chai-as-promised来处理异步断言：

// 先确保安装并引入依赖
const chai = require('chai');
const chaiAsPromised = require('chai-as-promised');
chai.use(chaiAsPromised);
const expect = chai.expect;

// 断言表格行数为0
Then('位置表格中应该没有任何数据行', function() {
  return expect(locationsPage.getTableDataRows().count()).to.eventually.equal(0);
});

其他常用的行数断言场景：

• 验证行数大于0：expect(dataRows.length).to.be.greaterThan(0);
• 验证行数等于指定数量：expect(dataRows.length).to.equal(5);

内容的提问来源于stack exchange，提问作者kevin