Behat / Mink从CSS元素获取价值

Question

我在网站上有一个可扩展的div。我想用Behat / Mink创建一个测试用例，以断言当用户到达页面时，该框未展开。

<a class="expand" data-reactid=".r[37uxa].[1]" href="#">Click to expand</a>
<div class="expandable" data-reactid=".r[37uxa].[2]" style="height: 0px;">

之后，当用户单击“单击以展开”时，style =“ height”的值将更改：

<a class="expand" data-reactid=".r[37uxa].[1]" href="#">Click to expand</a>
<div class="expandable" data-reactid=".r[37uxa].[2]" style="height: 157px;">

这意味着它现在已展开。

我想知道是否有办法或是否可以实现步骤定义来检查/获取样式属性的值。谢谢。

Answer 1

您可以使用NodeElement::isVisible()检查元素的可见性。

NodeElement::isVisible()

或者亲自检查样式

$session = $this->getSession(); // assume extends RawMinkContext
$page = $session->getPage();

$expandable = $page->find('css', '.expandable');

if (null === $expandable) {
    throw new \LogicException('Could not find the element');
}

if ($expandable->isVisible()) {
    throw new \LogicException('Element is visible...');
}

：

attribute

Answer 2

谢谢你们，在您的帮助下，我能够为我所需要的解决方案。这是我使用的方式：

$style = $expandable->getAttribute('style');

}

  /**
 * @Then /^The "([^"]*)" element should not be expanded$/
 */

public function theElementShouldNotBeExpanded($element)
{
    $session = $this->getSession(); 
    $page = $session->getPage();

    $expandable = $page->find('css', '.expandable');
    $style = $expandable->getAttribute('style');

    if ($style === "height: 0px;") {
        $message1 = sprintf('Is not expanded having the attribute: '.$style);
        echo $message1; 
    } else {
             $message2 = sprintf('The element is expanded having the attribute: '.$style);
             throw new Exception($message2);

            }

步骤定义如下：

 /**
     * @Then /^The "([^"]*)" element shold be expanded$/
     */
    public function theElementSholdBeExpanded($element)
    {
        $session = $this->getSession(); 
        $page = $session->getPage();
        $expandable = $page->find('css', '.expandable');
        $style = $expandable->getAttribute('style');

        if ($style === "height: 105px;") {
            $message1 = sprintf('Is expanded having the attribute: '.$style);
            echo $message1; 
        } else {
                 $message2 = sprintf('The element is not expanded having the attribute: '.$style);
                 throw new Exception($message2);

                }

    }

结果：

Given I am on "/"
        Then  I should see an ".promotion" element
        Then  The ".expandable" element should not be expanded
        And   I follow "Click to expand"
        Then  The ".expandable" element shold be expanded
        And   I follow "Click to hide"

谢谢你们，祝你有美好的一天！

Answer 3

我想您有

 Given I am on "/"         
 Then I should see an ".promotion" element     
 Then The ".expandable" element should not be expanded
 --Is not expanded having the attribute: height: 0px; 
 And I follow "Click to expand"
 Then The ".expandable" element shold be expanded
  --Is expanded having the attribute: height: 105px;  

中的$session。

您可以使用$session = new \Behat\Mink\Session($driver);。

NodeElement::getAttribute('style')

如果无法访问或对您不起作用，则可以随时执行

$page = $session->getPage();
$el = $page->find('css', '.something');
echo $el->getAttribute('style');

Answer 4

使用JavaScript isVisible时，并非总是能按预期工作。该示例先查看样式属性，然后查看显示，高度...值：

echo $session->evaluateScript(
    "(function(){ return document.getElementById('...').style.height; })()"
);