获取元素的源代码答案

【问题标题】：Get the source code of an element获取元素的源代码
【发布时间】：2018-03-14 14:58:16
【问题描述】：

Laravel Dusk 中是否有与 Selenium 类似的方法，通过 'innerHTML 属性' 获取元素的源代码？

例如：<div>Hello <p>World!</p></div> 的 innerHTML 将是： Hello <p>World!</p>.

【问题讨论】：

这没有帮助吗？ get-html-source-of-webelement-in-selenium-webdriver-using-python
我正在寻找 Dusk 解决方案。

标签： laravel selenium-webdriver laravel-5 webdriver laravel-dusk

【解决方案1】：

要获取元素的源代码，您应该使用element() 方法和getAttribute，如下所示：

$this->browse(function(Browser $browser) {

    $html = $browser->visit('/')
                    ->element('div.content')
                    ->getAttribute('innerHTML');

   // now in $html you have HTML inside div.content element
});

请注意，如果您有多个带有给定选择器的元素，您应该使用 elements() 方法并遍历找到的元素以获取它们的内容，如下所示：

$this->browse(function(Browser $browser) {
    $elements = $browser->visit('/')
                        ->elements('div.content');

    $html = [];
    foreach ($elements as $element) {
        $html[] = $element->getAttribute('innerHTML');
    }

    // now in $html you have array of HTML inside div.content elements
});

【讨论】：

谢谢。您能否指出我正确的 Dusk 文档以及所有可用的命令/方法。 'element' 和 'getAttribute' Dusk 方法还是 PHP Selenium 命令？
您可以查看vendor/laravel/dusk/Concerns 文件。在InteractsWithElements 你会找到元素和元素方法。但是 getAttribute 方法来自 FaebookWebDriver - 它位于 Facebook\WebDriver\Remote\RemoteWebElement 类中
谢谢，我在vendor/laravel/dusk/src/Concerns/InteractsWithElements.php 和vendor/Facebook/WebDriver/lib/Remote/RemoteWebElement.php 下找到了它们。

【解决方案2】：

我不熟悉 Selenium innerHTML，但使用 Dusk，您可以通过 $browser->assertSourceHas($code) 直接针对源代码进行断言。

如果断言失败，您将看到您网站的完整源代码。

public function testSourceCode()
    {
        $this->browse(function (Browser $browser) {
            $browser->visit('/')
                    ->assertSourceHas('Hello <p>World!</p>');
        });
    }

【讨论】：

通过assertSourceHas，你已经知道源代码，但是通过innerHTML，你得到一个未知源代码的值。