Convert relative url found in body into absolute url.

05f1e7de · Romain Courteaud · 3a87d366 · 05f1e7de · 05f1e7de · 05f1e7de
Commit 05f1e7de authored Jan 30, 2020 by Romain Courteaud
Show whitespace changes
Inline Side-by-side

Showing with 112 additions and 3 deletions

renderjs.js renderjs.js +31 -2

test/index.html test/index.html +1 -0

test/renderjs_test.js test/renderjs_test.js +80 -1

No files found.
--- a/renderjs.js
+++ b/renderjs.js
@@ -1385,7 +1385,8 @@
      (new DOMParser()).parseFromString(xhr.responseText, "text/html");
    parsed_html = renderJS.parseGadgetHTMLDocument(
      tmp_constructor.__template_element,
-      url
+      url,
+      true
    );
    for (key in parsed_html) {
      if (parsed_html.hasOwnProperty(key)) {
@@ -1490,7 +1491,8 @@
  // renderJS.parseGadgetHTMLDocument
  /////////////////////////////////////////////////////////////////
  renderJS.parseGadgetHTMLDocument =
-    function parseGadgetHTMLDocument(document_element, url) {
+    function parseGadgetHTMLDocument(document_element, url,
+                                     update_relative_url) {
      var settings = {
          title: "",
          interface_list: [],
@@ -1500,12 +1502,20 @@
        },
        i,
        element,
+        element_list,
+        j,
+        url_attribute_list = ['src', 'href', 'srcset'],
+        url_attribute,
        base_found = false;

      if (!url || !isAbsoluteOrDataURL.test(url)) {
        throw new Error("The url should be absolute: " + url);
      }

+      if (update_relative_url === undefined) {
+        update_relative_url = false;
+      }
+
      if (document_element.nodeType === 9) {
        settings.title = document_element.title;

@@ -1546,6 +1556,25 @@
            }
          }
        }
+
+        if (update_relative_url && (document_element.body !== null)) {
+          // Resolve all relativeurl configure in the dom as absolute from
+          // the gadget url
+          for (j = 0; j < url_attribute_list.length; j += 1) {
+            url_attribute = url_attribute_list[j];
+            element_list = document_element.body.querySelectorAll(
+              '[' + url_attribute + ']'
+            );
+            for (i = 0; i < element_list.length; i += 1) {
+              element = element_list[i];
+              element.setAttribute(url_attribute, renderJS.getAbsoluteURL(
+                element.getAttribute(url_attribute),
+                settings.path
+              ));
+            }
+          }
+        }
+
      } else {
        throw new Error("The first parameter should be an HTMLDocument");
      }

--- a/test/index.html
+++ b/test/index.html
@@ -39,5 +39,6 @@ See https://www.nexedi.com/licensing for rationale and options.
    <h2 id="qunit-userAgent"></h2>
    <ol id="qunit-tests"></ol>
    <div id="qunit-fixture">test markup, will be hidden</div>
+    <div id="check-relative-url" href='one' src='two' srcset='three'></div>
  </body>
 </html>
--- a/test/renderjs_test.js
+++ b/test/renderjs_test.js
@@ -698,6 +698,79 @@
      });
  });

+  test('Convert body relative url', function () {
+    // Check that declareGadgetKlass converts all relative url
+    var url = 'https://example.org/files/qunittest/test';
+
+    this.server.respondWith("GET", url, [200, {
+      "Content-Type": "text/html"
+    }, "<html><body><div href='a' src='b' srcset='c'></div></body></html>"]);
+
+    stop();
+    expect(4);
+    renderJS.declareGadgetKlass(url)
+      .then(function (Klass) {
+        var div;
+        equal(Klass.__template_element.nodeType, 9);
+        div = Klass.__template_element.body.querySelector('div');
+        equal(
+          div.getAttribute('href'),
+          'https://example.org/files/qunittest/a'
+        );
+        equal(
+          div.getAttribute('src'),
+          'https://example.org/files/qunittest/b'
+        );
+        equal(
+          div.getAttribute('srcset'),
+          'https://example.org/files/qunittest/c'
+        );
+      })
+      .fail(function (e) {
+        ok(false, e);
+      })
+      .always(function () {
+        start();
+      });
+  });
+
+  test('Convert body relative url with base', function () {
+    // Check that declareGadgetKlass converts all relative url
+    var url = 'https://example.org/files/qunittest/test';
+
+    this.server.respondWith("GET", url, [200, {
+      "Content-Type": "text/html"
+    }, "<html><head><base href='../'></base></head>" +
+       "<body><div href='a' src='b' srcset='c'></div></body></html>"]);
+
+    stop();
+    expect(4);
+    renderJS.declareGadgetKlass(url)
+      .then(function (Klass) {
+        var div;
+        equal(Klass.__template_element.nodeType, 9);
+        div = Klass.__template_element.body.querySelector('div');
+        equal(
+          div.getAttribute('href'),
+          'https://example.org/files/a'
+        );
+        equal(
+          div.getAttribute('src'),
+          'https://example.org/files/b'
+        );
+        equal(
+          div.getAttribute('srcset'),
+          'https://example.org/files/c'
+        );
+      })
+      .fail(function (e) {
+        ok(false, e);
+      })
+      .always(function () {
+        start();
+      });
+  });
+
  test('Klass is not reloaded if called twice', function () {
    // Check that declareGadgetKlass does not reload the gadget
    // if it has already been loaded
@@ -6233,7 +6306,7 @@
    }

    stop();
-    expect(25);
+    expect(28);
    root_gadget_defer.promise
      .then(function (root_gadget_list) {
        var root_gadget = root_gadget_list[0],
@@ -6292,6 +6365,12 @@
        ]);
        html = root_gadget.constructor.__template_element.outerHTML;
        ok(/^<div>\s*<h1 id="qunit-header">/.test(html), html);
+        html = root_gadget.constructor.__template_element
+                          .querySelector('#check-relative-url');
+        // relative url are not modified on the root gadget
+        equal(html.getAttribute('href'), 'one');
+        equal(html.getAttribute('src'), 'two');
+        equal(html.getAttribute('srcset'), 'three');
        ok(root_gadget instanceof RenderJSGadget);
        ok(root_gadget_klass, root_gadget.constructor);
        ok(root_gadget.__aq_parent !== undefined);