Question

我需要获得元素的边框样式。我尝试了以下代码：

sample = page.execute_script("
  var x = window.document.querySelector('#{path}');
  a = window.getComputedStyle(x, null).getPropertyValue('border');
  return a;
")                     
puts sample

它打印为空。

（注意：元素的边框是 - 实心）

Answer 1

根据您之前的问题，我假设您使用的是selenium-webdriver。

本机selenium-webdriver元素具有检查计算样式的方法 - Element#css_value。

如果您的网页HTML为：

<html>
    <body>
        <p style="border-style:solid;">A solid border.</p>
    </body>
</html>

然后你可以使用：

获得边框样式

puts page.first('p').native.css_value('border-style')
#=> 'solid'

请注意代码：

Capybara使用page.first('p')
native用于获取selenium-webdriver元素
css_value用于获取计算出的样式。请注意，css_value方法必须传递参数'border-style'而不是简写'border'。

<强>更新

对于您的具体示例：

似乎如果使用简写“border”属性，“border-style”属性将为空。相反，您必须使用特定的“border-bottom-style”，“border-left-style”等属性。
由于你知道元素的id，你可以使用page.find_by_id('option')

考虑到上述情况，您可以使用以下方法检查计算出的边框样式：

puts page.find_by_id('option').native.css_value('border-bottom-style')
#=> "solid"
puts page.find_by_id('option').native.css_value('border-left-style')
#=> "solid"
puts page.find_by_id('option').native.css_value('border-right-style')
#=> "solid"
puts page.find_by_id('option').native.css_value('border-top-style')
#=> "solid"

与Capybara一起获得边境风格

1 个答案: