Skip to main content

Browse the archive

Revision 2eec13b500aa5dc62b83f2d3ec87ed5a73d8e933 authored by Ian Kilpatrick on 26 March 2018, 18:44:58 UTC, committed by Chromium WPT Sync on 26 March 2018, 18:44:58 UTC 
[css-layout-api] Allow LayoutChild(ren) to be laid out.
 
This allows a LayoutChild to have layout performed on it, which will
return a Fragment - with the correct inline and block sizes.

These Fragments cannot be positioned yet, (next patch).

The LayoutChild will be laid out with an available inline/block size of
zero by default, and optionally can accept a fixed-inline/block size,
which it must respect.

Bug: 726125
Change-Id: Ie4386b8f6cd6ccec3f9e52ff332322101058836d
Reviewed-on: https://chromium-review.googlesource.com/962870
Commit-Queue: Ian Kilpatrick <ikilpatrick@chromium.org>
Reviewed-by: Kentaro Hara <haraken@chromium.org>
Reviewed-by: Emil A Eklund <eae@chromium.org>
Reviewed-by: Morten Stenshorne <mstensho@chromium.org>
Cr-Commit-Position: refs/heads/master@{#545845}
1 parent a35b824
Raw File
modulepreload.html 
<!DOCTYPE html>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<body>
<script>

function verifyNumberOfDownloads(url, number) {
    var numDownloads = 0;
    let absoluteURL = new URL(url, location.href).href;
    performance.getEntriesByName(absoluteURL).forEach(entry => {
        if (entry.transferSize > 0) {
            numDownloads++;
        }
    });
    assert_equals(numDownloads, number, url);
}

function attachAndWaitForLoad(element) {
    return new Promise((resolve, reject) => {
        element.onload = resolve;
        element.onerror = reject;
        document.body.appendChild(element);
    });
}

function attachAndWaitForError(element) {
    return new Promise((resolve, reject) => {
        element.onload = reject;
        element.onerror = resolve;
        document.body.appendChild(element);
    });
}

promise_test(function(t) {
    var link = document.createElement('link');
    link.rel = 'modulepreload';
    link.href = 'resources/dummy.js';
    return attachAndWaitForLoad(link).then(() => {
        verifyNumberOfDownloads('resources/dummy.js', 1);

        // Verify that <script> doesn't fetch the module again.
        var script = document.createElement('script');
        script.type = 'module';
        script.src = 'resources/dummy.js';
        return attachAndWaitForLoad(script);
    }).then(() => {
        verifyNumberOfDownloads('resources/dummy.js', 1);
    });
}, 'link rel=modulepreload');

promise_test(function(t) {
    var link = document.createElement('link');
    link.rel = 'modulepreload';
    link.href = 'resources/module1.js';
    return attachAndWaitForLoad(link).then(() => {
        verifyNumberOfDownloads('resources/module1.js', 1);
        // The load event fires before (optional) submodules fetch.
        verifyNumberOfDownloads('resources/module2.js', 0);

        var script = document.createElement('script');
        script.type = 'module';
        script.src = 'resources/module1.js';
        return attachAndWaitForLoad(script);
    }).then(() => {
        verifyNumberOfDownloads('resources/module1.js', 1);
        verifyNumberOfDownloads('resources/module2.js', 1);
    });
}, 'link rel=modulepreload with submodules');

promise_test(function(t) {
    var link = document.createElement('link');
    link.rel = 'modulepreload';
    link.href = 'resources/syntax-error.js';
    return attachAndWaitForLoad(link);
}, 'link rel=modulepreload for a module with syntax error');

promise_test(function(t) {
    var link = document.createElement('link');
    link.rel = 'modulepreload';
    link.href = 'resources/not-exist.js';
    return attachAndWaitForError(link);
}, 'link rel=modulepreload for a module with network error');

promise_test(function(t) {
    var link = document.createElement('link');
    link.rel = 'modulepreload';
    link.href = null;
    return attachAndWaitForError(link);
}, 'link rel=modulepreload with bad href attribute');

promise_test(function(t) {
    var link = document.createElement('link');
    link.rel = 'modulepreload';
    link.href = 'resources/module1.js?as-script';
    link.as = 'script'
    return attachAndWaitForLoad(link);
}, 'link rel=modulepreload as=script');

promise_test(function(t) {
    var link = document.createElement('link');
    link.rel = 'modulepreload';
    link.href = 'resources/module1.js?as-image';
    link.as = 'image'
    return attachAndWaitForError(link);
}, 'link rel=modulepreload with invalid as= value');

promise_test(function(t) {
    var link = document.createElement('link');
    link.rel = 'modulepreload';
    link.href = 'resources/module1.js?integrity-match';
    link.integrity = 'sha256-ZPBZ+J9CiHzZXaBBluSeCpjzuTUkT+rSWIdXUV3AtVo='
    return attachAndWaitForLoad(link);
}, 'link rel=modulepreload with integrity match');

promise_test(function(t) {
    var link = document.createElement('link');
    link.rel = 'modulepreload';
    link.href = 'resources/module1.js?integrity-doesnotmatch';
    link.integrity = 'sha384-doesnotmatch'
    return attachAndWaitForError(link);
}, 'link rel=modulepreload with integrity mismatch');

</script>
</body>
back to top