单击表中的特定按钮答案

【问题标题】：Click specific button in table单击表中的特定按钮
【发布时间】：2018-11-28 12:02:35
【问题描述】：

我正在使用 Webdriverio、Selenium 和 Javascript

在我的前端，我有三个 div，每个 div 都包含一个具有相同类名 (field_table) 的表。 div 具有 id 0、1 和 2 以及相同的类名（receiver_field）

每个表还包含一个具有相同类名的按钮（删除按钮）。

那是因为表格是自动生成的

在我的 Webdriverio Selenium 测试中，我想单击其中一个树形按钮，以便删除一个条目

但是当它们都具有相同的类名时，我如何只导航到一个按钮？我尝试通过 id 导航，但无法正常工作

    it('should be possible to delete on button click', function () {

    // Get receiver fields
    var fields = browser.elements('.form-control-list');
    expect(fields.value.length).to.equal(6);

    // Get only one table
    // Get that tables button
    // Click the button

    //expect(fields.value.length).to.equal(4);

});

有什么建议吗？

【问题讨论】：

编辑您的代码并首先删除语法错误
- 然后呢？有关如何解决实际问题的任何建议？
请创建一个minimal reproducible example，在您的问题中展示您的错误 - 如果没有您的 html 和您正在使用的 js，就不可能看到问题所在
很遗憾，我不能给你一个错误 - 我只是在寻求有关如何编写测试以及如何单击表格内的那个按钮的指导
"fields" 应该是一个包含 3 个元素的 webElements 数组，根据位置单击它们，例如：fields[1].click(..) ...

标签： javascript selenium automated-tests chai webdriver-io

【解决方案1】：

一般情况下，你需要将所有具有相同类名的元素放入一个列表（或数组）中，然后从列表中选择你想要交互的元素。

例如：

Elems = browser.findElementsByClassName("class_name")

Elems[0].click()

将上面的内容适应 JavaScript，我不太擅长。 :)

【讨论】：

使用浏览器时不能这样做...它只使用这样的方法：webdriver.io/api.html
哦，是的，我记得现在 WebdriverIO 是多么糟糕……我想把 findElementsByClassName 放在页面对象中，或者你可以找到 webelements 的任何地方。最主要的是找到所有元素，将它们放在一个列表中并遍历该列表。实际上你已经在这样做了。看看mboullouz的评论
@Alichino 你记不太清了，或者你一开始就不知道如何使用这个工具。 WDIO 有更优雅的语法（$ & $$ ftw！）让我们停止对我们没有完全掌握的事物的偏见。这也不是 framework 问题，而是 selector 问题。所以，名字归咎于你！ :p