<!DOCTYPE html>
<script src="/js-test-resources/testharness.js"></script>
<script src="/js-test-resources/testharnessreport.js"></script>
<script>
    var t = async_test('Makes sure that preloaded resources are not downloaded again when used');
</script>
<link rel=preload href="http://127.0.0.1:8000/resources/dummy.js" as=script>
<link rel=preload href="http://127.0.0.1:8000/resources/dummy.css" as=style>
<link rel=preload href="http://127.0.0.1:8000/resources/square100.png" as=image>
<link rel=preload href="http://127.0.0.1:8000/resources/square100.png?background" as=image>
<link rel=preload href="http://127.0.0.1:8000/resources/Ahem.woff" as=font crossorigin>
<link rel=preload href="http://127.0.0.1:8000/resources/test.mp4" as=video>
<link rel=preload href="http://127.0.0.1:8000/resources/test.oga" as=audio>
<link rel=preload href="http://127.0.0.1:8000/security/resources/captions.vtt" as=track>
<link rel=preload href="http://127.0.0.1:8000/resources/dummy.xml?foobar" as=foobarxmlthing>
<link rel=preload href="http://127.0.0.1:8000/resources/dummy.xml" as=fetch crossorigin>
<script src="http://127.0.0.1:8000/resources/slow-script.pl?delay=200"></script>
<style>
    #background {
        width: 200px;
        height: 200px;
        background-image: url(http://127.0.0.1:8000/resources/square100.png?background);
    }
    @font-face {
      font-family:ahem;
      src: url(http://127.0.0.1:8000/resources/Ahem.woff);
    }
    span { font-family: ahem, Arial; }
</style>
<link rel="stylesheet" href="http://127.0.0.1:8000/resources/dummy.css">
<script src="http://127.0.0.1:8000/resources/dummy.js"></script>
<div id="background"></div>
<img src="http://127.0.0.1:8000/resources/square100.png">
<video src="http://127.0.0.1:8000/resources/test.mp4">
    <track kind=subtitles src="http://127.0.0.1:8000/security/resources/captions.vtt" srclang=en>
</video>
<audio src="http://127.0.0.1:8000/resources/test.oga"></audio>
<script>
    var xhr = new XMLHttpRequest();
    xhr.open("GET", "http://127.0.0.1:8000/resources/dummy.xml");
    xhr.send();

    window.addEventListener("load", t.step_func(function() {
        function verifyDownloadNumber(url, number) {
            assert_equals(performance.getEntriesByName(url).length, number, url);
        }
        setTimeout(t.step_func(function() {
            verifyDownloadNumber("http://127.0.0.1:8000/resources/dummy.js", 1);
            verifyDownloadNumber("http://127.0.0.1:8000/resources/dummy.css", 1);
            verifyDownloadNumber("http://127.0.0.1:8000/resources/square100.png", 1);
            verifyDownloadNumber("http://127.0.0.1:8000/resources/square100.png?background", 1);
            verifyDownloadNumber("http://127.0.0.1:8000/resources/Ahem.woff", 1);
            verifyDownloadNumber("http://127.0.0.1:8000/resources/dummy.xml?foobar", 0);
            verifyDownloadNumber("http://127.0.0.1:8000/security/resources/captions.vtt", 1);
            // FIXME: XHR should trigger a single download, but it downloads 2 resources instead.
            verifyDownloadNumber("http://127.0.0.1:8000/resources/dummy.xml", 2);
            // FIXME: We should verify for video and audio as well, but they seem to (flakily?) trigger multiple partial requests.
            var xhr = new XMLHttpRequest();
            xhr.open("GET", "../resources/dummy.xml");
            xhr.send();
            var xhr2 = new XMLHttpRequest();
            xhr2.open("GET", "../resources/dummy.xml?badvalue");
            xhr2.send();
            t.done();
            }), 100);
    }));
</script>