Question

foreach表行中的元素交互看起来无法正常工作，找不到元素，并且未编写write方法

创建以下步骤

* Create following task
  | fiels | value          |
  |-------|----------------|
  | name  | test task name |
  | type  | urgent         |

并解析表

step("Create following task <table>", async (table) => {
  await click($('.add-task'));
  table.rows.forEach( async row => {
    switch(row.cells[0]) {
      case 'name':
        await write(row.cells[1], into(inputField({placeholder:"Type here"}, toRightOf('Name of the task'))));
      case 'type':
        await click($('.input-text', toRightOf('Type of task')));
       await write(row.cells[1]);
   }
  click('Create');
});

即使我放置了waitfor或waitforstart，write方法也不会写任何东西，但是如果我在循环外的不同步骤中运行它们，它们将起作用。

Answer 1

@nonyck 感谢您报告此问题。

这是一种解决方法。使用for循环而不是如下所示的foreach

HTML

<!DOCTYPE html>
<html>
<body>

<h2>HTML Forms</h2>

<form action="/action_page.php">
  First name:  <input type="text" name="firstname" placeholder="first">
  <br>
  Last name:  <input type="text" name="lastname" placeholder="last">
  <br><br>
  <input type="submit" value="Submit">
</form> 

<p>If you click the "Submit" button, the form-data will be sent to a page called "/action_page.php".</p>

</body>
</html>

* Create following task
  | fiels  | value          |toRightOf  |
  |--------|----------------|-----------|
  | first  | test task name |First name:|
  | last   | urgent         |Last name: |

step("Create following task <table>", async function(table) {
    for(var i=0;i<table.rows.length;i++)
    {
        console.log(table.rows[i].cells[0])
        console.log(table.rows[i].cells[1])
        console.log(table.rows[i].cells[2])
        await write(table.rows[i].cells[1], into(textBox({placeholder:table.rows[i].cells[0]}, toRightOf(table.rows[i].cells[2]))));
    }

foreach的问题可以在https://github.com/getgauge/taiko/issues/646进行跟踪。请随时添加更多详细信息/想法。

以下是一些观察结果

您正在使用 await write(row.cells[1], into(inputField({placeholder:"Type here"}, toRightOf('Name of the task'))));

使用占位符“在此处键入”和toRightOf(<hard coded value>)，您将一次又一次地选择相同的元素。 “仅因为在文本字段中添加了一个值，占位符就不会失效。

$是用于选择元素的后备选项。您可以使用click(<wordings visible on screen>)。 Taiko将为您寻找元素。

PS：如果您可以共享与此一起使用的HTML，将能够为您提供更好的帮助！

Answer 2

这里的问题与gauge或gauge-js或taiko无关。节点的forEach不处理async回调。因此，将不考虑回调中的任何await，并且循环将转到下一个元素，而无需完成第一个任务。以下线程解释了此行为，并讨论了一些整洁的解决方法。

Using async/await with a forEach loop

带Taiko的Gaugejs的数据表行为异常

2 个答案: