<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html>
<html id="h" xmlns="http://www.w3.org/1999/xhtml" xml:base="">
  <head>
    <title>HTML Test: Dynamic changes to base URLs</title>
    <link rel="author" title="Intel" href="http://www.intel.com/"/>
    <link rel="help" href="https://html.spec.whatwg.org/multipage/#dynamic-changes-to-base-urls" />
    <script src="/resources/testharness.js" id="s1"></script>
    <script src="/resources/testharnessreport.js"></script>
  </head>
  <body>
    <div id="log"></div>
    <div id="div" style="display:none" xml:base=""></div>
    <script>
      <![CDATA[
      var div = document.getElementById("div"),
          html = document.getElementById("h"),
          url =  document.location.href;

      var testData = [
        {elements: ["a", "link", "area"], set: "href", get: "href"},
        {elements: ["q", "blockquote", "ins", "del"], set: "cite", get: "cite"},
        {elements: ["img", "embed", "video", "iframe", "script", "source", "track"], set: "src", get: "src"},
        {elements: ["form"], set: "action", get: "action"},
        {elements: ["object"], set: "data", get: "data"},
        {elements: ["button"], set: "formaction", get: "formAction"}
      ];

      for (var i in testData) {
        var item = testData[i];
        for (var j in item.elements) {
          test(function () {
            var ele = document.createElement(item.elements[j]);

            ele.setAttribute(item.set, "test.txt");
            div.appendChild(ele);

            html.setAttribute("xml:base", "");
            assert_equals(ele[item.get], url.substr(0, url.lastIndexOf("/")) +"/test.txt", "The '" + item.get + "' attribute is incorrect.");
            html.setAttribute("xml:base", "http://{{domains[www]}}:{{ports[http][0]}}");
            assert_equals(ele[item.get], "http://{{domains[www]}}:{{ports[http][0]}}/test.txt", "The '" + item.get + "' attribute is incorrect.");
          }, "The '" + item.set + "' attribute of the '" + item.elements[j] + "' element");
        }
      }

      test(function () {
        var s1 = document.getElementById("s1");
        var val1 = s1.src;
        var val2 = div.firstChild.href;

        div.setAttribute("xml:base", "http://{{domains[www2]}}:{{ports[http][0]}}");
        assert_equals(s1.src, val1, "The outer element must not be effected.");
        assert_not_equals(div.firstChild.href, val2, "The inner element must be effected.");
        assert_equals(div.firstChild.href, "http://{{domains[www2]}}:{{ports[http][0]}}/test.txt");
      }, "Change the base URL must effect the descendant elements only");
      ]]>
    </script>
  </body>
</html>