Revision 79f402f76e5b78f0fae93dbff7c4ddc5cd382e04 authored by Kent Tamura on 13 February 2018, 09:24:39 UTC, committed by Blink WPT Bot on 13 February 2018, 09:48:50 UTC
importNode() implementation should pass "is" value to "create an
element" algorithm.

WPT: Add a new test for importNode().

Bug: 807871
Change-Id: Id60c5577b5899aeac66b819986c34a28978e24d9
Reviewed-on: https://chromium-review.googlesource.com/915744
Reviewed-by: Yoichi Osato <yoichio@chromium.org>
Reviewed-by: Yoshifumi Inoue <yosin@chromium.org>
Commit-Queue: Kent Tamura <tkent@chromium.org>
Cr-Commit-Position: refs/heads/master@{#536311}
1 parent 57780df
Raw File
table-model-fixup-2.html
<!doctype html>
<script src='/resources/testharness.js'></script>
<script src='/resources/testharnessreport.js'></script>
<link rel='stylesheet' href='./support/base.css' />
<link rel="help" href="https://drafts.csswg.org/css-tables-3/#table-structure">
<style>
    [inline] { display: inline !important; }
    [block] { display: block !important; }
    [inline-table] { display: inline-table !important; }
    [table] { display: table !important; }
    [table-row] { display: table-row !important; }
    [table-cell] { display: table-cell !important; }
    [table-column] { display: table-column !important; }
    [table-row-group] { display: table-row-group !important; }
    [table-header-group] { display: table-header-group !important; }
    [table-footer-group] { display: table-footer-group !important; }
    [table-column-group] { display: table-column-group !important; }
    div > x-table { background: yellow; border-spacing: 10px }
    div input { width: 100px; }
</style>
<script>
    function assertEqualOffsetWidths(a,b) {
        var desc = document.querySelector('main > hr:last-of-type + p + p') || document.querySelectorAll('main > hr + p + p')[document.querySelectorAll('main > hr + p + p').length-1];
        var root = document.querySelector('main > div:last-of-type') || document.querySelectorAll('main > div')[document.querySelectorAll('main > div').length-1];
        generate_tests(assert_equals, [
            [
                desc.textContent,
                root.querySelector("[target="+a+"]").offsetWidth,
                root.querySelector("[target="+b+"]").offsetWidth
            ]
        ]);
    }
    function assertEqualOffsetTops(a,b) {
        var desc = document.querySelector('main > hr:last-of-type + p + p') || document.querySelectorAll('main > hr + p + p')[document.querySelectorAll('main > hr + p + p').length-1];
        var root = document.querySelector('main > div:last-of-type') || document.querySelectorAll('main > div')[document.querySelectorAll('main > div').length-1];
        generate_tests(assert_equals, [
            [
                desc.textContent,
                root.querySelector("[target="+a+"]").getBoundingClientRect().top|0,
                root.querySelector("[target="+b+"]").getBoundingClientRect().top|0
            ]
        ]);
    }
    function assertUnequalOffsetTops(a,b) {
        var desc = document.querySelector('main > hr:last-of-type + p + p') || document.querySelectorAll('main > hr + p + p')[document.querySelectorAll('main > hr + p + p').length-1];
        var root = document.querySelector('main > div:last-of-type') || document.querySelectorAll('main > div')[document.querySelectorAll('main > div').length-1];
        generate_tests(assert_not_equals, [
            [
                desc.textContent,
                root.querySelector("[target="+a+"]").getBoundingClientRect().top|0,
                root.querySelector("[target="+b+"]").getBoundingClientRect().top|0
            ]
        ]);
    }
</script>

<main>

    <h1>Table fixup</h1>
    <p>Check that replaced elements display types are handled properly in fixup</p>

    <hr/><!------------------------------------------------------------------------------------------------------------>
    <p>Both input fields should look identical, on their own line:</p>
    <p>Replaced elements inside a table cannot be <mark>table-row</mark> and are considered <mark>block</mark> -- input elements</p>
    <div>
        <x-table style="width: 400px">
            <x-tr><x-td><input block target=a /></x-tr>
            <input table-row target=b />
        </x-table>
    </div>
    <script>

        assertEqualOffsetWidths('a','b');

    </script>

    <hr/><!------------------------------------------------------------------------------------------------------------>
    <p>Both images should look identical, on their own line:</p>
    <p>Replaced elements inside a table cannot be <mark>table-row</mark> and are considered <mark>block</mark> -- img elements</p>
    <div>
        <x-table style="width: 400px">
            <x-tr><x-td><img block src="http://w3.org/favicon.ico" target=a /></x-tr>
            <img src="http://w3.org/favicon.ico" table-row target=b />
        </x-table>
    </div>
    <script>

        assertEqualOffsetWidths('a','b');

    </script>

    <hr/><!------------------------------------------------------------------------------------------------------------>
    <p>Both input fields should look identical, on their own line:</p>
    <p>Replaced elements inside a table cannot be <mark>table-column</mark> and are considered <mark>inline</mark> -- input elements</p>
    <div>
        <x-table style="width: 400px">
            <x-tr><x-td><input inline target=a /></x-tr>
            <input table-column target=b />
        </x-table>
    </div>
    <script>

        assertEqualOffsetWidths('a','b');

    </script>

    <hr/><!------------------------------------------------------------------------------------------------------------>
    <p>Both images should look identical, on their own line:</p>
    <p>Replaced elements inside a table cannot be <mark>table-column</mark> and are considered <mark>inline</mark> -- img elements</p>
    <div>
        <x-table style="width: 400px">
            <x-tr><x-td><img inline src="http://w3.org/favicon.ico" target=a /></x-tr>
            <img src="http://w3.org/favicon.ico" table-column target=b />
        </x-table>
    </div>
    <script>

        assertEqualOffsetWidths('a','b');

    </script>

    <hr/><!------------------------------------------------------------------------------------------------------------>
    <p>Both input fields should look identical, on their own line:</p>
    <p>Replaced elements inside a table cannot be <mark>table-cell</mark> and are considered <mark>inline</mark> -- input elements</p>
    <div>
        <x-table style="width: 400px">
            <x-tr><x-td><input inline target=a /></x-tr>
            <x-tr><input table-cell target=b /></x-tr>
        </x-table>
    </div>
    <script>

        assertEqualOffsetWidths('a','b');

    </script>

    <hr/><!------------------------------------------------------------------------------------------------------------>
    <p>Both images should look identical, on their own line:</p>
    <p>Replaced elements inside a table cannot be <mark>table-cell</mark> and are considered <mark>inline</mark> -- img elements</p>
    <div>
        <x-table style="width: 400px">
            <x-tr><x-td><img inline src="http://w3.org/favicon.ico" target=a /></x-tr>
            <x-tr><img src="http://w3.org/favicon.ico" table-cell target=b /></x-tr>
        </x-table>
    </div>
    <script>

        assertEqualOffsetWidths('a','b');

    </script>

    <hr/><!------------------------------------------------------------------------------------------------------------>
    <p>Both text inputs should share the same line:</p>
    <p>Replaced elements outside a table cannot be <mark>inline-table</mark> and are <mark>considered</mark> inline -- input=text elements</p>
    <div>
        <input inline-table target=a />
        <input inline-table target=b />
    </div>
    <script>

        assertEqualOffsetTops('a','b');

    </script>

    <hr/><!------------------------------------------------------------------------------------------------------------>
    <p>Both button inputs should share the same line:</p>
    <p>Replaced elements outside a table cannot be <mark>inline-table</mark> and are considered <mark>inline</mark> -- input=button elements</p>
    <div>
        <input type=button inline-table target=a />
        <input type=button inline-table target=b />
    </div>
    <script>

        assertEqualOffsetTops('a','b');

    </script>

    <hr/><!------------------------------------------------------------------------------------------------------------>
    <p>Both file inputs should share the same line:</p>
    <p>Replaced elements outside a table cannot be <mark>inline-table</mark> and are considered <mark>inline</mark> -- input=file elements</p>
    <div>
        <input type=file inline-table target=a />
        <input type=file inline-table target=b />
    </div>
    <script>

        assertEqualOffsetTops('a','b');

    </script>

    <hr/><!------------------------------------------------------------------------------------------------------------>
    <p>Both images should share the same line:</p>
    <p>Replaced elements outside a table cannot be <mark>inline-table</mark> and are considered <mark>inline</mark> -- img elements</p>
    <div>
        <img src="http://w3.org/favicon.ico" inline-table target=a />
        <img src="http://w3.org/favicon.ico" inline-table target=b />
    </div>
    <script>

        assertEqualOffsetTops('a','b');

    </script>

    <hr/><!------------------------------------------------------------------------------------------------------------>
    <p>Both text inputs should stand on their own line:</p>
    <p>Replaced elements outside a table cannot be <mark>table</mark> and are considered <mark>block</mark> -- input=text elements</p>
    <div>
        <input type=text table target=a />
        <input type=text table target=b />
    </div>
    <script>

        assertUnequalOffsetTops('a','b');

    </script>

    <hr/><!------------------------------------------------------------------------------------------------------------>
    <p>Both button inputs should stand on their own line:</p>
    <p>Replaced elements outside a table cannot be <mark>table</mark> and are considered <mark>block</mark> -- input=button elements</p>
    <div>
        <input type=button table target=a />
        <input type=button table target=b />
    </div>
    <script>

        assertUnequalOffsetTops('a','b');

    </script>

    <hr/><!------------------------------------------------------------------------------------------------------------>
    <p>Both file inputs should stand on their own line:</p>
    <p>Replaced elements outside a table cannot be <mark>table</mark> and are considered <mark>block</mark> -- input=file elements</p>
    <div>
        <input type=file table target=a />
        <input type=file table target=b />
    </div>
    <script>

        assertUnequalOffsetTops('a','b');

    </script>

    <hr/><!------------------------------------------------------------------------------------------------------------>
    <p>Both images should stand on their own line:</p>
    <p>Replaced elements outside a table cannot be <mark>table</mark> and are considered <mark>block</mark> -- img elements</p>
    <div>
        <img src="http://w3.org/favicon.ico" table target=a />
        <img src="http://w3.org/favicon.ico" table target=b />
    </div>
    <script>

        assertUnequalOffsetTops('a','b');

    </script>

    <hr/><!------------------------------------------------------------------------------------------------------------>
    <p>Both text inputs should stand on their own line:</p>
    <p>Replaced elements outside a table cannot be <mark>table-row</mark> and are considered <mark>block</mark> -- input=text elements</p>
    <div>
        <input type=text table-row target=a />
        <input type=text table-row target=b />
    </div>
    <script>

        assertUnequalOffsetTops('a','b');

    </script>

    <hr/><!------------------------------------------------------------------------------------------------------------>
    <p>Both button inputs should stand on their own line:</p>
    <p>Replaced elements outside a table cannot be <mark>table-row</mark> and are considered <mark>block</mark> -- input=button elements</p>
    <div>
        <input type=button table-row target=a />
        <input type=button table-row target=b />
    </div>
    <script>

        assertUnequalOffsetTops('a','b');

    </script>

    <hr/><!------------------------------------------------------------------------------------------------------------>
    <p>Both file inputs should stand on their own line:</p>
    <p>Replaced elements outside a table cannot be <mark>table-row</mark> and are considered <mark>block</mark> -- input=file elements</p>
    <div>
        <input type=file table-row target=a />
        <input type=file table-row target=b />
    </div>
    <script>

        assertUnequalOffsetTops('a','b');

    </script>

    <hr/><!------------------------------------------------------------------------------------------------------------>
    <p>Both images should stand on their own line:</p>
    <p>Replaced elements outside a table cannot be <mark>table-row</mark> and are considered <mark>block</mark> -- img elements</p>
    <div>
        <img src="http://w3.org/favicon.ico" table-row target=a />
        <img src="http://w3.org/favicon.ico" table-row target=b />
    </div>
    <script>

        assertUnequalOffsetTops('a','b');

    </script>

    <hr/><!------------------------------------------------------------------------------------------------------------>
    <p>Both text inputs should stand on their own line:</p>
    <p>Replaced elements outside a table cannot be <mark>table-row-group</mark> and are considered <mark>block</mark> -- input=text elements</p>
    <div>
        <input type=text table-row-group target=a />
        <input type=text table-row-group target=b />
    </div>
    <script>

        assertUnequalOffsetTops('a','b');

    </script>

    <hr/><!------------------------------------------------------------------------------------------------------------>
    <p>Both button inputs should stand on their own line:</p>
    <p>Replaced elements outside a table cannot be <mark>table-row-group</mark> and are considered <mark>block</mark> -- input=button elements</p>
    <div>
        <input type=button table-row-group target=a />
        <input type=button table-row-group target=b />
    </div>
    <script>

        assertUnequalOffsetTops('a','b');

    </script>

    <hr/><!------------------------------------------------------------------------------------------------------------>
    <p>Both file inputs should stand on their own line:</p>
    <p>Replaced elements outside a table cannot be <mark>table-row-group</mark> and are considered <mark>block</mark> -- input=file elements</p>
    <div>
        <input type=file table-row-group target=a />
        <input type=file table-row-group target=b />
    </div>
    <script>

        assertUnequalOffsetTops('a','b');

    </script>

    <hr/><!------------------------------------------------------------------------------------------------------------>
    <p>Both images should stand on their own line:</p>
    <p>Replaced elements outside a table cannot be <mark>table-row-group</mark> and are considered <mark>block</mark> -- img elements</p>
    <div>
        <img src="http://w3.org/favicon.ico" table-row-group target=a />
        <img src="http://w3.org/favicon.ico" table-row-group target=b />
    </div>
    <script>

        assertUnequalOffsetTops('a','b');

    </script>

    <hr/><!------------------------------------------------------------------------------------------------------------>
    <p>Both text inputs should share the same line:</p>
    <p>Replaced elements outside a table cannot be <mark>table-column</mark> and are <mark>considered</mark> inline -- input=text elements</p>
    <div>
        <input table-column target=a />
        <input table-column target=b />
    </div>
    <script>

        assertEqualOffsetTops('a','b');

    </script>

    <hr/><!------------------------------------------------------------------------------------------------------------>
    <p>Both button inputs should share the same line:</p>
    <p>Replaced elements outside a table cannot be <mark>table-column</mark> and are considered <mark>inline</mark> -- input=button elements</p>
    <div>
        <input type=button table-column target=a />
        <input type=button table-column target=b />
    </div>
    <script>

        assertEqualOffsetTops('a','b');

    </script>

    <hr/><!------------------------------------------------------------------------------------------------------------>
    <p>Both file inputs should share the same line:</p>
    <p>Replaced elements outside a table cannot be <mark>table-column</mark> and are considered <mark>inline</mark> -- input=file elements</p>
    <div>
        <input type=file table-column target=a />
        <input type=file table-column target=b />
    </div>
    <script>

        assertEqualOffsetTops('a','b');

    </script>

    <hr/><!------------------------------------------------------------------------------------------------------------>
    <p>Both images should share the same line:</p>
    <p>Replaced elements outside a table cannot be <mark>table-column</mark> and are considered <mark>inline</mark> -- img elements</p>
    <div>
        <img src="http://w3.org/favicon.ico" table-column target=a />
        <img src="http://w3.org/favicon.ico" table-column target=b />
    </div>
    <script>

        assertEqualOffsetTops('a','b');

    </script>

    <hr/><!------------------------------------------------------------------------------------------------------------>
    <p>Both text inputs should share the same line:</p>
    <p>Replaced elements outside a table cannot be <mark>table-cell</mark> and are <mark>considered</mark> inline -- input=text elements</p>
    <div>
        <input table-cell target=a />
        <input table-cell target=b />
    </div>
    <script>

        assertEqualOffsetTops('a','b');

    </script>

    <hr/><!------------------------------------------------------------------------------------------------------------>
    <p>Both button inputs should share the same line:</p>
    <p>Replaced elements outside a table cannot be <mark>table-cell</mark> and are considered <mark>inline</mark> -- input=button elements</p>
    <div>
        <input type=button table-cell target=a />
        <input type=button table-cell target=b />
    </div>
    <script>

        assertEqualOffsetTops('a','b');

    </script>

    <hr/><!------------------------------------------------------------------------------------------------------------>
    <p>Both file inputs should share the same line:</p>
    <p>Replaced elements outside a table cannot be <mark>table-cell</mark> and are considered <mark>inline</mark> -- input=file elements</p>
    <div>
        <input type=file table-cell target=a />
        <input type=file table-cell target=b />
    </div>
    <script>

        assertEqualOffsetTops('a','b');

    </script>

    <hr/><!------------------------------------------------------------------------------------------------------------>
    <p>Both images should share the same line:</p>
    <p>Replaced elements outside a table cannot be <mark>table-cell</mark> and are considered <mark>inline</mark> -- img elements</p>
    <div>
        <img src="http://w3.org/favicon.ico" table-cell target=a />
        <img src="http://w3.org/favicon.ico" table-cell target=b />
    </div>
    <script>

        assertEqualOffsetTops('a','b');

    </script>

</main>
back to top