Bug 1440388 - Adapt JSONViewer to the new Reps bundle; r=Honza.
authorNicolas Chevobbe <nchevobbe@mozilla.com>
Fri, 09 Mar 2018 15:30:40 +0100
changeset 462250 03b4dbb07486620cc1d75f7d01369f56adadfeea
parent 462249 6b359e9acbf4aec0586335aa11a69bbc48447fbc
child 462251 fed69455a83257de1364e97085e3e30badcbb0ab
push id9165
push userasasaki@mozilla.com
push dateThu, 26 Apr 2018 21:04:54 +0000
treeherdermozilla-beta@064c3804de2e [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersHonza
bugs1440388
milestone61.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1440388 - Adapt JSONViewer to the new Reps bundle; r=Honza. We don't populate the href attribute on links anymore and reps require that we pass an openLink function to handle them. This had an impact on the test where we are testing those links. MozReview-Commit-ID: Hj2PBX79HZu
devtools/client/jsonview/components/JsonPanel.js
devtools/client/jsonview/test/browser_jsonview_url_linkification.js
--- a/devtools/client/jsonview/components/JsonPanel.js
+++ b/devtools/client/jsonview/components/JsonPanel.js
@@ -83,17 +83,17 @@ define(function(require, exports, module
       if (isObject(member.value) && member.hasChildren && member.open) {
         return null;
       }
 
       // Render the value (summary) using Reps library.
       return Rep(Object.assign({}, props, {
         cropLimit: 50,
         noGrip: true,
-        omitLinkHref: false,
+        openLink: url => window.open(url, "_blank"),
       }));
     }
 
     renderTree() {
       // Append custom column for displaying values. This column
       // Take all available horizontal space.
       let columns = [{
         id: "value",
--- a/devtools/client/jsonview/test/browser_jsonview_url_linkification.js
+++ b/devtools/client/jsonview/test/browser_jsonview_url_linkification.js
@@ -7,45 +7,72 @@
 
 const {ELLIPSIS} = require("devtools/shared/l10n");
 
 add_task(async function() {
   info("Test short URL linkification JSON started");
 
   let url = "http://example.com/";
   let tab = await addJsonViewTab("data:application/json," + JSON.stringify([url]));
-
-  // eslint-disable-next-line no-shadow
-  await ContentTask.spawn(tab.linkedBrowser, {url}, function({url}) {
-    let {document} = content;
+  await testLinkNavigation({ browser: tab.linkedBrowser, url });
 
-    let link = document.querySelector(".jsonPanelBox .treeTable .treeValueCell a");
-    is(link.href, url, "The URL was linkified.");
-    is(link.textContent, url, "The full URL is displayed.");
+  info("Switch back to the JSONViewer");
+  await BrowserTestUtils.switchTab(gBrowser, tab);
 
-    // Click the label
-    document.querySelector(".jsonPanelBox .treeTable .treeLabel").click();
-    is(link.href, url, "The link target didn't change.");
-    is(link.textContent, url, "The link text didn't change.");
-  });
+  await testLinkNavigation({ browser: tab.linkedBrowser, url, clickLabel: true });
 });
 
 add_task(async function() {
   info("Test long URL linkification JSON started");
 
   let url = "http://example.com/" + "a".repeat(100);
   let tab = await addJsonViewTab("data:application/json," + JSON.stringify([url]));
 
-  // eslint-disable-next-line no-shadow
-  await ContentTask.spawn(tab.linkedBrowser, {url, ELLIPSIS}, function({url, ELLIPSIS}) {
-    let croppedUrl = url.slice(0, 24) + ELLIPSIS + url.slice(-24);
+  await testLinkNavigation({ browser: tab.linkedBrowser, url });
+
+  info("Switch back to the JSONViewer");
+  await BrowserTestUtils.switchTab(gBrowser, tab);
+
+  await testLinkNavigation({
+    browser: tab.linkedBrowser,
+    url,
+    urlText: url.slice(0, 24) + ELLIPSIS + url.slice(-24),
+    clickLabel: true,
+  });
+});
+
+/**
+ * Assert that the expected link is displayed and that clicking on it navigates to the
+ * expected url.
+ *
+ * @param {Object} option object containing:
+ *        - browser (mandatory): the browser the tab will be opened in.
+ *        - url (mandatory): The url we should navigate to.
+ *        - urlText: The expected displayed text of the url.
+ *                   Falls back to `url` if not filled
+ *        - clickLabel: Should we click the label before doing assertions.
+ */
+async function testLinkNavigation({
+  browser,
+  url,
+  urlText,
+  clickLabel = false
+}) {
+  let onTabLoaded = BrowserTestUtils.waitForNewTab(gBrowser, url);
+
+  ContentTask.spawn(browser, [urlText || url, clickLabel], (args) => {
+    const [expectedURL, shouldClickLabel] = args;
     let {document} = content;
 
+    if (shouldClickLabel === true) {
+      document.querySelector(".jsonPanelBox .treeTable .treeLabel").click();
+    }
+
     let link = document.querySelector(".jsonPanelBox .treeTable .treeValueCell a");
-    is(link.href, url, "The URL was linkified.");
-    is(link.textContent, url, "The full URL is displayed.");
+    is(link.textContent, expectedURL, "The expected URL is displayed.");
+    link.click();
+  });
 
-    // Click the label, this crops the value.
-    document.querySelector(".jsonPanelBox .treeTable .treeLabel").click();
-    is(link.href, url, "The link target didn't change.");
-    is(link.textContent, croppedUrl, "The link text was cropped.");
-  });
-});
+  let newTab = await onTabLoaded;
+  // We only need to check that newTab is truthy since
+  // BrowserTestUtils.waitForNewTab checks the URL.
+  ok(newTab, "The expected tab was opened.");
+}