选择第一行中的第三个元素（webdriver.io 和 javascript）类型错误：tables.$ 不是函数错误

Question

我正在使用 cucumber、webdriver.io 和 javascript，并且必须选择第一行中的第三个元素。表元素不断变化，但始终以“__table”开头，因此我将其合并到我的代码中。我的网页上有一个表，我尝试使用 for 循环来选择第一个表，但 for 循环中的代码未执行。当我删除 for 循环时，出现 TypeError:tables.$ is not a function 错误。这是我的代码的当前状态。如何修改代码以使其运行？

When("the user selects the customer from the results", async function () {
  // Implementation for selecting the customer from the results

  const tables = await $$('table[id^="__tables"]');
  console.log('Tables:', tables);
  for (const table of tables) {
    // Your code to interact with each table
    const firstRow = await table.$('tr');
    const thirdCell = await firstRow.$$('td')[2]; // Index 2 for the third cell
    const text = await thirdCell.getText();
    console.log('Cell text', text);
    await thirdCell.waitForClickable();
    await thirdCell.click()
  }
});

我尝试了以下解决方案来实现我的目标

When("the user selects the customer from the results", async function () {
  // Implementation for selecting the customer from the results

  const tables = await $$('table[id^="__tables"]');
  console.log('Tables:', tables);

  // Assuming you want to interact with the first table found
  const targetTable = tables[0];

  // Locate the first row in the table
  const firstRow = await targetTable.$('tr');

  // Locate the third cell (td) in the first row
  const thirdCell = await firstRow.$$('td')[2]; // Index 2 for the third cell

  // Perform actions on the selected cell
  await thirdCell.click();

});

但是我收到以下错误

[0-0] Error in "0: And the user selects the customer from the results"
TypeError: Cannot read properties of undefined (reading '$')

Answer 1

如果您使用 TypeScript，请尝试为每行隐式添加类型，或者在每行上另外尝试打印到控制台某些内容（文本、长度、isExist）以了解发生的情况，或尝试使用调试。

// Implementation for selecting the customer from the results
const tables: WebdriverIO.ElementArray = await $$('table[id^="__tables"]');
console.log('Tables:', tables);

// Assuming you want to interact with the first table found
const targetTable: WebdriverIO.Element = tables[0];

// Locate the first row in the table
const firstRow: WebdriverIO.Element = await targetTable.$('tr');

// Locate the third cell (td) in the first row
const thirdCell: WebdriverIO.Element = await firstRow.$$('td')[2]; // Index 2 for the third cell

// Perform actions on the selected cell
await thirdCell.click();