如何在不使用 xpath 的情况下检查元素

Question

我在某些不避开xpath的情况下还是有困难。对于下面这个问题如何避免？。有人有一个网站，教了很多方法来做到这一点。非常感谢。

这个class在页面上重复了不止一次。

'//*[@id="gatsby-focus-wrapper"]/div/div/div/main/div/div/div[2]/form/div1/span[2]'

请看图

Answer 1

您没有说明要对该元素执行的操作，但很可能不需要检查整个页面结构，因为该元素中包含文本。此外，使用具有完整页面结构的 XPath 将使您的测试非常脆弱。

如果你想找到你可以做的元素

find('span', text: 'E-mail inválido')

或者如果您想验证它是否在 gatsby-focus-wrapper 范围内，您可以

find('#gatsby-focus-wrapper span', text: 'E-mail inválido')

如果你想验证它是否存在，你可以这样做

expect(page).to have_css('span', text: 'E-mail inválido') # using RSpec

或

asset_css('span', text: 'E-mail inválido') # using Minitest

如果您 needed/wanted 也测试 class 基数，您可以使用带有 class 过滤器的正则表达式，例如

expect(page).to have_css(
  'span', 
  text: 'E-mail inválido', 
  class: /signUpFormFields__InputError\-/
)

How to inspect element without using xpath