0

我们将 Extract Text 插件与 Webpack 3 一起使用，效果很好，但我们最近聘请了一位在 Selenium 工作的 QA 自动化工程师。

我们正在讨论使用 Selenium 更容易选择元素的方法，但在前端。这将涉及我们编写我们不使用的 CSS，以便让一个类在组件上呈现。与插件本质上的作用相反。

有没有办法用插件来完成这个？如果您曾在 Selenium 工作过，也欢迎提出建议。甚至可能是黑客攻击。

例子：

{ vehicleOptions.map((option, index) => {
  let [label, value] = option
  if (label && value) {
    return (
      <li
        className={ [styles.option, styles[label]].join(' ') }
        key={ `${ label }_${ index }` }>
        <img
          className={ styles.icon }
          src={ `/images/icon-${ label }@2x.png` }
          />
        <p className={ styles.value }>
          { typeof value === 'number'
            ? formatDistance(value, ',', 'mi')
            : value
          }
        </p>
      </li>
    )
  } else {
    return null
  }

在这一行 className={ [styles.option, styles[label]].join(' ') }中，只有一个映射项的标签将其标签应用为一个类，因为它具有相应的 CSS。其他的不是基于提取文本的工作原理。

这就是 QA 工程师很难在 HTML 中查询特定元素的地方。

我曾想过能够运行testing模式，但为测试呈现不同的东西有点违背了针对将用于生产的真实世界代码进行测试的目的。

4

1 回答 1

1

这样做的类似经验，我们最终做的一件事是添加data-id="foo"，然后在我们的 selenium 测试中使用 xpath 选择器。

然后在 selenuim 中，您可以执行以下操作： '//*[@data-id="foo"]'

或在 chrome 中测试 $x('//*[@data-id="foo"]')

于 2017-11-16T21:17:43.080 回答