resolve-url-on-insertion.html | Explore in Territory

<html>
<body>
<script>
var base = document.createElement('base');
base.href = 'resources/';

var link1 = document.createElement('link');
var promises = [];
link1.setAttribute('rel', 'stylesheet');
link1.setAttribute('href', 'stylesheet.css');
promises.push(new Promise(function(resolve) {
    link1.addEventListener('load', function() { resolve(); }, false);
  }));

var foreignDocument = document.implementation.createHTMLDocument('');
var link2 = foreignDocument.createElement('link');
link2.setAttribute('rel', 'stylesheet');
link2.setAttribute('href', 'stylesheet2.css');
promises.push(new Promise(function(resolve) {
    link2.addEventListener('load', function() { resolve(); }, false);
  }));

document.body.appendChild(base);
document.body.appendChild(link1);
document.body.appendChild(link2);

if (window.testRunner) {
    testRunner.dumpAsText();
    testRunner.waitUntilDone();
}
</script>
<p>This tests that links resouce URLs are resolved dynamically when inserted into
   the document, and honor the base URL of the document at the time of insertion.</p>

<h1 id=test>I should be blue</h1>
<h1 id=test2>I should be red</h1>

<script>
Promise.all(promises).then(function() {
    var test = document.getElementById('test');
    var testColor = window.getComputedStyle(document.getElementById('test'), null).color;
    var test2 = document.getElementById('test2');
    var test2Color = window.getComputedStyle(document.getElementById('test2'), null).color;
    test.innerHTML += testColor === 'rgb(0, 0, 255)' ? '...and I am!!!' : '...but I am not =-(';
    test2.innerHTML += test2Color === 'rgb(255, 0, 0)' ? '...and I am!!!' : '...but I am not =-(';
    testRunner.notifyDone();
  });
</script>
</body></html>
chromium/third_party/blink/web_tests/fast/dom/HTMLLinkElement/resolve-url-on-insertion.html
