Bug 1419336 - Update tests; r=nchevobbe

MozReview-Commit-ID: 4EEUWLufth8

--HG--
extra : rebase_source : 9d091b9efebdaebe7126da6a82abb1ee3ced31be

devtools/client/webconsole/new-console-output/test/mochitest/browser.ini

@@ -7,6 +7,7 @@ support-files =
   code_bundle_nosource.js
   code_bundle_nosource.js.map
   head.js
+  sjs_slow-response-test-server.sjs
   source-mapped.css
   source-mapped.css.map
   source-mapped.scss

devtools/client/webconsole/new-console-output/test/mochitest/browser_webconsole_network_messages_expand.js

@@ -17,53 +17,189 @@ registerCleanupFunction(() => {
   Services.prefs.clearUserPref(XHR_PREF);
 });
 
+let tabs = [{
+  id: "headers",
+  testEmpty: testEmptyHeaders,
+  testContent: testHeaders,
+}, {
+  id: "cookies",
+  testEmpty: testEmptyCookies,
+  testContent: testCookies,
+}, {
+  id: "params",
+  testEmpty: testEmptyParams,
+  testContent: testParams,
+}, {
+  id: "response",
+  testEmpty: testEmptyResponse,
+  testContent: testResponse,
+}, {
+  id: "timings",
+  testEmpty: testEmptyTimings,
+  testContent: testTimings,
+}, {
+  id: "stack-trace",
+  testEmpty: testEmptyStackTrace,
+  testContent: testStackTrace,
+}];
+
+/**
+ * Main test for checking HTTP logs in the Console panel.
+ */
 add_task(async function task() {
   const hud = await openNewTabAndConsole(TEST_URI);
-
   const currentTab = gBrowser.selectedTab;
   let target = TargetFactory.forTab(currentTab);
+
+  // Execute XHR and expand it after all network
+  // update events are received. Consequently,
+  // check out content of all (HTTP details) tabs.
+  await openRequestAfterUpdates(target, hud);
+
+  // Test proper UI update when request is opened.
+  // For every tab (with HTTP details):
+  // 1. Execute long-time request
+  // 2. Expand the net log before the request finishes (set default tab)
+  // 3. Check the default tab empty content
+  // 4. Wait till the request finishes
+  // 5. Check content of all tabs
+  for (let tab of tabs) {
+    await openRequestBeforeUpdates(target, hud, tab);
+  }
+});
+
+async function openRequestAfterUpdates(target, hud) {
   let toolbox = gDevTools.getToolbox(target);
 
+  let xhrUrl = TEST_PATH + "sjs_slow-response-test-server.sjs";
+  let message = waitForMessage(hud, xhrUrl);
+
   // Fire an XHR POST request.
-  await ContentTask.spawn(gBrowser.selectedBrowser, null, function () {
-    content.wrappedJSObject.testXhrPost();
+  ContentTask.spawn(gBrowser.selectedBrowser, null, function () {
+    content.wrappedJSObject.testXhrPostSlowResponse();
   });
 
-  info("XHR executed");
+  let { node: messageNode } = await message;
+
+  info("Network message found.");
 
   await waitForRequestUpdates(toolbox);
 
-  let xhrUrl = TEST_PATH + "test-data.json";
-  let messageNode = await waitFor(() => findMessage(hud, xhrUrl));
-  let urlNode = messageNode.querySelector(".url");
-  info("Network message found.");
-
-  let updates = waitForPayloadReady(toolbox);
+  let payload = waitForPayloadReady(toolbox);
 
   // Expand network log
+  let urlNode = messageNode.querySelector(".url");
   urlNode.click();
 
+  await payload;
+  await testNetworkMessage(toolbox, messageNode);
+}
+
+async function openRequestBeforeUpdates(target, hud, tab) {
+  let toolbox = gDevTools.getToolbox(target);
+
+  hud.jsterm.clearOutput(true);
+
+  let xhrUrl = TEST_PATH + "sjs_slow-response-test-server.sjs";
+  let message = waitForMessage(hud, xhrUrl);
+
+  // Fire an XHR POST request.
+  ContentTask.spawn(gBrowser.selectedBrowser, null, function () {
+    content.wrappedJSObject.testXhrPostSlowResponse();
+  });
+
+  let { node: messageNode } = await message;
+
+  info("Network message found.");
+
+  let updates = waitForRequestUpdates(toolbox);
+  let payload = waitForPayloadReady(toolbox);
+
+  // Set the default panel.
+  const state = hud.ui.newConsoleOutput.getStore().getState();
+  state.ui.networkMessageActiveTabId = tab.id;
+
+  // Expand network log
+  let urlNode = messageNode.querySelector(".url");
+  urlNode.click();
+
+  // Make sure the current tab is the expected one.
+  let currentTab = messageNode.querySelector(`#${tab.id}-tab`);
+  is(currentTab.getAttribute("aria-selected"), "true",
+    "The correct tab is selected");
+
+  // The tab should be empty now.
+  tab.testEmpty(messageNode);
+
+  // Wait till all updates and payload are received.
   await updates;
-  await testNetworkMessage(messageNode);
-});
+  await payload;
 
-async function testNetworkMessage(messageNode) {
+  // Test content of the default tab.
+  await tab.testContent(messageNode);
+
+  // Test all tabs in the network log.
+  await testNetworkMessage(toolbox, messageNode);
+}
+
+// Panel testing helpers
+
+async function testNetworkMessage(toolbox, messageNode) {
+  await testHeaders(messageNode);
+  await testCookies(messageNode);
+  await testParams(messageNode);
+  await testResponse(messageNode);
+  await testTimings(messageNode);
+  await testStackTrace(messageNode);
+  await waitForLazyRequests(toolbox);
+}
+
+// Headers
+
+function testEmptyHeaders(messageNode) {
+  let emptyNotice = messageNode.querySelector("#headers-panel .empty-notice");
+  ok(emptyNotice, "Headers tab is empty");
+}
+
+async function testHeaders(messageNode) {
   let headersTab = messageNode.querySelector("#headers-tab");
-  let cookiesTab = messageNode.querySelector("#cookies-tab");
-  let paramsTab = messageNode.querySelector("#params-tab");
-  let responseTab = messageNode.querySelector("#response-tab");
-  let timingsTab = messageNode.querySelector("#timings-tab");
-
   ok(headersTab, "Headers tab is available");
-  ok(cookiesTab, "Cookies tab is available");
-  ok(paramsTab, "Params tab is available");
-  ok(responseTab, "Response tab is available");
-  ok(timingsTab, "Timings tab is available");
 
-  // Headers tab should be selected by default, so just check its content.
-  let headersContent = messageNode.querySelector(
-    "#headers-panel .headers-overview");
-  ok(headersContent, "Headers content is available");
+  // Select Headers tab and check the content.
+  headersTab.click();
+  await waitUntil(() => {
+    return !!messageNode.querySelector("#headers-panel .headers-overview");
+  });
+}
+
+// Cookies
+
+function testEmptyCookies(messageNode) {
+  let emptyNotice = messageNode.querySelector("#cookies-panel .empty-notice");
+  ok(emptyNotice, "Cookies tab is empty");
+}
+
+async function testCookies(messageNode) {
+  let cookiesTab = messageNode.querySelector("#cookies-tab");
+  ok(cookiesTab, "Cookies tab is available");
+
+  // Select tab and check the content.
+  cookiesTab.click();
+  await waitUntil(() => {
+    return !!messageNode.querySelector("#cookies-panel .treeValueCell");
+  });
+}
+
+// Params
+
+function testEmptyParams(messageNode) {
+  let emptyNotice = messageNode.querySelector("#params-panel .empty-notice");
+  ok(emptyNotice, "Params tab is empty");
+}
+
+async function testParams(messageNode) {
+  let paramsTab = messageNode.querySelector("#params-tab");
+  ok(paramsTab, "Params tab is available");
 
   // Select Params tab and check the content. CodeMirror initialization
   // is delayed to prevent UI freeze, so wait for a little while.
@@ -74,6 +210,18 @@ async function testNetworkMessage(messageNode) {
     "#params-panel .panel-container .CodeMirror");
   ok(paramsContent, "Params content is available");
   ok(paramsContent.textContent.includes("Hello world!"), "Post body is correct");
+}
+
+// Response
+
+function testEmptyResponse(messageNode) {
+  let panel = messageNode.querySelector("#response-panel .tab-panel");
+  is(panel.textContent, "", "Cookies tab is empty");
+}
+
+async function testResponse(messageNode) {
+  let responseTab = messageNode.querySelector("#response-tab");
+  ok(responseTab, "Response tab is available");
 
   // Select Response tab and check the content. CodeMirror initialization
   // is delayed, so again wait for a little while.
@@ -84,6 +232,18 @@ async function testNetworkMessage(messageNode) {
     "#response-panel .editor-row-container .CodeMirror");
   ok(responseContent, "Response content is available");
   ok(responseContent.textContent, "Response text is available");
+}
+
+// Timings
+
+function testEmptyTimings(messageNode) {
+  let panel = messageNode.querySelector("#timings-panel .tab-panel");
+  is(panel.textContent, "", "Timings tab is empty");
+}
+
+async function testTimings(messageNode) {
+  let timingsTab = messageNode.querySelector("#timings-tab");
+  ok(timingsTab, "Timings tab is available");
 
   // Select Timings tab and check the content.
   timingsTab.click();
@@ -93,6 +253,26 @@ async function testNetworkMessage(messageNode) {
   ok(timingsContent.textContent, "Timings text is available");
 }
 
+// Stack Trace
+
+function testEmptyStackTrace(messageNode) {
+  let panel = messageNode.querySelector("#stack-trace-panel .stack-trace");
+  is(panel.textContent, "", "StackTrace tab is empty");
+}
+
+async function testStackTrace(messageNode) {
+  let stackTraceTab = messageNode.querySelector("#stack-trace-tab");
+  ok(stackTraceTab, "StackTrace tab is available");
+
+  // Select Timings tab and check the content.
+  stackTraceTab.click();
+  await waitUntil(() => {
+    return !!messageNode.querySelector("#stack-trace-panel .frame-link");
+  });
+}
+
+// Waiting helpers
+
 async function waitForPayloadReady(toolbox) {
   let {ui} = toolbox.getCurrentPanel().hud;
   return new Promise(resolve => {
@@ -118,3 +298,11 @@ async function waitForRequestUpdates(toolbox) {
     });
   });
 }
+
+async function waitForLazyRequests(toolbox) {
+  let {ui} = toolbox.getCurrentPanel().hud;
+  let proxy = ui.jsterm.hud.proxy;
+  return waitUntil(() => {
+    return !proxy.networkDataProvider.lazyRequestData.size;
+  });
+}

devtools/client/webconsole/new-console-output/test/mochitest/sjs_slow-response-test-server.sjs

@@ -0,0 +1,19 @@
+/* Any copyright is dedicated to the Public Domain.
+   http://creativecommons.org/publicdomain/zero/1.0/ */
+
+const { classes: Cc, interfaces: Ci } = Components;
+
+function handleRequest(request, response) {
+  response.processAsync();
+
+  let timer = Cc["@mozilla.org/timer;1"].createInstance(Ci.nsITimer);
+  timer.initWithCallback(() => {
+    // to avoid garbage collection
+    timer = null;
+    response.setStatusLine(request.httpVersion, 200, "OK");
+    response.setHeader("Content-Type", "text/plain", false);
+    response.setHeader("Set-Cookie", "foo=bar; Max-Age=10; HttpOnly", true);
+    response.write("Some response data");
+    response.finish();
+  }, 300, Ci.nsITimer.TYPE_ONE_SHOT); // Make sure this request takes a few hundred ms.
+}

devtools/client/webconsole/new-console-output/test/mochitest/test-network-request.html

@@ -7,7 +7,7 @@
     <meta charset="utf-8">
     <title>Console HTTP test page</title>
     <script type="text/javascript">
-      /* exported testXhrGet, testXhrWarn, testXhrPost */
+      /* exported testXhrGet, testXhrWarn, testXhrPost, testXhrPostSlowResponse */
       "use strict";
 
       function makeXhr(method, url, requestBody, callback) {
@@ -32,6 +32,10 @@
       function testXhrPost(callback) {
         makeXhr("post", "test-data.json", "Hello world!", callback);
       }
+
+      function testXhrPostSlowResponse(callback) {
+        makeXhr("post", "sjs_slow-response-test-server.sjs", "Hello world!", callback);
+      }
     </script>
   </head>
   <body>