Testcafe Hammerhead 在带有损坏代码的 innerHTML 上具有明显的行为

Question

尝试在使用 dojo js 库的页面上使用 Testcafe，其分页组件已损坏 HTML（dojo reference），浏览器（Chrome、Firefox 和 Safari）处理它并根据需要修复，但 testcafe-hammerhead 对待它不同并破坏了相关组件。

可以使用以下方式重现：

<html>
    <body>
        <script>

            document.body.innerHTML = '<html>'+
                '<head></head>'+
                '<body>'+
                    '<div dojoattachpoint="paginatorBar">'+
                        '<table style="width:100%">'+
                            '<tbody>'+
                                '<tr>'+
                                    '<td>Jill</td>'+
                                    '<td>Smith</td>'+
                                    '<td>'+
                                        '<div>50</div></div>'+<!--broken code--!>
                                    '</td>'+
                                '</tr>'+
                                '<tr>'+
                                    '<td>Eve</td>'+
                                    '<td>Jackson</td>'+
                                    '<td>94</td>'+
                                '</tr>'+
                            '</tbody>'+
                        '</table>'+
                    '</div>'+
                '</body>'+
            '</html>';

        </script>
    </body>
</html>

浏览器生成：

<html>
    <head></head>
    <body>
        <div dojoattachpoint="paginatorBar">
            <table style="width:100%">
                <tbody>
                    <tr>
                        <td>Jill</td>
                        <td>Smith</td>
                        <td>
                            <div>50</div> <!--fixed code--!>
                        </td>
                    </tr>
                    <tr>
                        <td>Eve</td>
                        <td>Jackson</td>
                        <td>94</td>
                    </tr>
                </tbody>
            </table>
        </div>
    </body>
</html>

和锤头：

<html data-hammerhead-hovered="">
    <head>
        <meta class="charset-hammerhead-shadow-ui" charset="iso-8859-1">
            <script type="text/javascript" class="script-hammerhead-shadow-ui" charset="UTF-8" src="http://localhost:1401/hammerhead.js"></script>
            <script type="text/javascript" class="script-hammerhead-shadow-ui" charset="UTF-8" src="http://localhost:1401/task.js"></script>
        </head>
        <body>
            <div dojoattachpoint="paginatorBar">
                <table style="width:100%">
                    <tbody>
                        <tr>
                            <td>Jill</td>
                            <td>Smith</td>
                            <td>
                                <div>50</div>
                            </td>
                        </tr>
                    </tbody>
                </table>           <!--ends table--!>
            </div>EveJackson94
            <div id="root-hammerhead-shadow-ui" contenteditable="false" class="root-hammerhead-shadow-ui"></div>
        </body>
    </html>

有谁知道导致此问题的原因以及如何避免它？

我正在使用：

Chrome 版本 81.0.4044.138（64 位）
节点 v12.16.3
测试咖啡馆 1.8.4
macOS 莫哈韦沙漠 10.14.4

提前致谢。

Answer 1

TestCafe 无法处理错误的标记。有类似的wrong markup issues。

Testcafe Hammerhead 在带有损坏代码的 innerHTML 上具有明显的行为

Testcafe Hammerhead has a distinct behaviour on innerHTML with broken code

testing

automated-tests

innerhtml

e2e-testing

testcafe