<!DOCTYPE html>
<html>
<head>
<script>
if (window.testRunner) {
    testRunner.waitUntilDone();
    testRunner.dumpAsText();
    testRunner.dumpResourceLoadCallbacks();
}

let loadCount = 0;
function didLoad(element)
{
    if (!loadCount) {
        document.querySelector('link').rel = 'preload';
        setTimeout(() => {
            document.querySelector('link').rel = 'PreLoad';          
        }, 100);
        setTimeout(() => {
            document.querySelector('link').rel = 'PreLoad ';          
        }, 200);
        setTimeout(() => {
            if (window.testRunner)
              testRunner.notifyDone();
        }, 300);
    }
    ++loadCount;
    result.innerHTML = loadCount;
}

</script>
<link rel="preload" as="style" href="data:text/css,div { background: green; width: 100px; height: 100px }" onload="didLoad(this)">
</head>
<body>
<p>This tests overriding rel content attribute with the same value.<br>
You should see 1 below:</p>
<div id="result"></div>
</body>
</html>
