summaryrefslogtreecommitdiffstats
path: root/devtools/client/netmonitor/test/browser_net_filter-02.js
diff options
context:
space:
mode:
Diffstat (limited to 'devtools/client/netmonitor/test/browser_net_filter-02.js')
-rw-r--r--devtools/client/netmonitor/test/browser_net_filter-02.js307
1 files changed, 307 insertions, 0 deletions
diff --git a/devtools/client/netmonitor/test/browser_net_filter-02.js b/devtools/client/netmonitor/test/browser_net_filter-02.js
new file mode 100644
index 0000000000..2e2b7752da
--- /dev/null
+++ b/devtools/client/netmonitor/test/browser_net_filter-02.js
@@ -0,0 +1,307 @@
+/* Any copyright is dedicated to the Public Domain.
+ http://creativecommons.org/publicdomain/zero/1.0/ */
+
+"use strict";
+
+/**
+ * Test if filtering items in the network table works correctly with new requests.
+ */
+
+const BASIC_REQUESTS = [
+ { url: "sjs_content-type-test-server.sjs?fmt=html&res=undefined" },
+ { url: "sjs_content-type-test-server.sjs?fmt=xhtml" },
+ { url: "sjs_content-type-test-server.sjs?fmt=css" },
+ { url: "sjs_content-type-test-server.sjs?fmt=js" },
+];
+
+const REQUESTS_WITH_MEDIA = BASIC_REQUESTS.concat([
+ { url: "sjs_content-type-test-server.sjs?fmt=font" },
+ { url: "sjs_content-type-test-server.sjs?fmt=image" },
+ { url: "sjs_content-type-test-server.sjs?fmt=audio" },
+ { url: "sjs_content-type-test-server.sjs?fmt=video" },
+]);
+
+const REQUESTS_WITH_MEDIA_AND_FLASH = REQUESTS_WITH_MEDIA.concat([
+ { url: "sjs_content-type-test-server.sjs?fmt=flash" },
+]);
+
+const REQUESTS_WITH_MEDIA_AND_FLASH_AND_WS =
+ REQUESTS_WITH_MEDIA_AND_FLASH.concat([
+ /* "Upgrade" is a reserved header and can not be set on XMLHttpRequest */
+ { url: "sjs_content-type-test-server.sjs?fmt=ws" },
+ ]);
+
+const EXPECTED_REQUESTS = [
+ {
+ method: "GET",
+ url: CONTENT_TYPE_SJS + "?fmt=html",
+ data: {
+ fuzzyUrl: true,
+ status: 200,
+ statusText: "OK",
+ type: "html",
+ fullMimeType: "text/html; charset=utf-8",
+ },
+ },
+ {
+ method: "GET",
+ url: CONTENT_TYPE_SJS + "?fmt=xhtml",
+ data: {
+ fuzzyUrl: true,
+ status: 200,
+ statusText: "OK",
+ type: "xhtml",
+ fullMimeType: "application/xhtml+xml; charset=utf-8",
+ },
+ },
+ {
+ method: "GET",
+ url: CONTENT_TYPE_SJS + "?fmt=css",
+ data: {
+ fuzzyUrl: true,
+ status: 200,
+ statusText: "OK",
+ type: "css",
+ fullMimeType: "text/css; charset=utf-8",
+ },
+ },
+ {
+ method: "GET",
+ url: CONTENT_TYPE_SJS + "?fmt=js",
+ data: {
+ fuzzyUrl: true,
+ status: 200,
+ statusText: "OK",
+ type: "js",
+ fullMimeType: "application/javascript; charset=utf-8",
+ },
+ },
+ {
+ method: "GET",
+ url: CONTENT_TYPE_SJS + "?fmt=font",
+ data: {
+ fuzzyUrl: true,
+ status: 200,
+ statusText: "OK",
+ type: "woff",
+ fullMimeType: "font/woff",
+ },
+ },
+ {
+ method: "GET",
+ url: CONTENT_TYPE_SJS + "?fmt=image",
+ data: {
+ fuzzyUrl: true,
+ status: 200,
+ statusText: "OK",
+ type: "png",
+ fullMimeType: "image/png",
+ },
+ },
+ {
+ method: "GET",
+ url: CONTENT_TYPE_SJS + "?fmt=audio",
+ data: {
+ fuzzyUrl: true,
+ status: 200,
+ statusText: "OK",
+ type: "ogg",
+ fullMimeType: "audio/ogg",
+ },
+ },
+ {
+ method: "GET",
+ url: CONTENT_TYPE_SJS + "?fmt=video",
+ data: {
+ fuzzyUrl: true,
+ status: 200,
+ statusText: "OK",
+ type: "webm",
+ fullMimeType: "video/webm",
+ },
+ },
+ {
+ method: "GET",
+ url: CONTENT_TYPE_SJS + "?fmt=flash",
+ data: {
+ fuzzyUrl: true,
+ status: 200,
+ statusText: "OK",
+ type: "x-shockwave-flash",
+ fullMimeType: "application/x-shockwave-flash",
+ },
+ },
+ {
+ method: "GET",
+ url: CONTENT_TYPE_SJS + "?fmt=ws",
+ data: {
+ fuzzyUrl: true,
+ status: 101,
+ statusText: "Switching Protocols",
+ },
+ },
+];
+
+add_task(async function () {
+ const { monitor } = await initNetMonitor(FILTERING_URL, { requestCount: 1 });
+ info("Starting test... ");
+
+ // It seems that this test may be slow on Ubuntu builds running on ec2.
+ requestLongerTimeout(2);
+
+ const { document, store, windowRequire } = monitor.panelWin;
+ const Actions = windowRequire("devtools/client/netmonitor/src/actions/index");
+ const { getDisplayedRequests, getSelectedRequest, getSortedRequests } =
+ windowRequire("devtools/client/netmonitor/src/selectors/index");
+
+ store.dispatch(Actions.batchEnable(false));
+
+ let wait = waitForNetworkEvents(monitor, 10);
+ await performRequestsInContent(REQUESTS_WITH_MEDIA_AND_FLASH_AND_WS);
+ await wait;
+
+ EventUtils.sendMouseEvent(
+ { type: "mousedown" },
+ document.querySelectorAll(".request-list-item")[0]
+ );
+
+ isnot(
+ getSelectedRequest(store.getState()),
+ null,
+ "There should be a selected item in the requests menu."
+ );
+ is(
+ getSelectedIndex(store.getState()),
+ 0,
+ "The first item should be selected in the requests menu."
+ );
+ is(
+ !!document.querySelector(".network-details-bar"),
+ true,
+ "The network details panel should be visible after toggle button was pressed."
+ );
+
+ testFilterButtons(monitor, "all");
+ await testContents([1, 1, 1, 1, 1, 1, 1, 1, 1, 1]);
+
+ info("Testing html filtering.");
+ EventUtils.sendMouseEvent(
+ { type: "click" },
+ document.querySelector(".requests-list-filter-html-button")
+ );
+ testFilterButtons(monitor, "html");
+ await testContents([1, 1, 0, 0, 0, 0, 0, 0, 0, 0]);
+
+ info("Performing more requests.");
+ // As the view is filtered and there is only one request for which we fetch event timings
+ wait = waitForNetworkEvents(monitor, 10, { expectedEventTimings: 1 });
+ await performRequestsInContent(REQUESTS_WITH_MEDIA_AND_FLASH_AND_WS);
+ await wait;
+
+ info("Testing html filtering again.");
+ testFilterButtons(monitor, "html");
+ await testContents([
+ 1, 1, 0, 0, 0, 0, 0, 0, 0, 0, 1, 1, 0, 0, 0, 0, 0, 0, 0, 0,
+ ]);
+
+ info("Performing more requests.");
+ wait = waitForNetworkEvents(monitor, 10, { expectedEventTimings: 1 });
+ await performRequestsInContent(REQUESTS_WITH_MEDIA_AND_FLASH_AND_WS);
+ await wait;
+
+ info("Testing html filtering again.");
+ testFilterButtons(monitor, "html");
+ await testContents([
+ 1, 1, 0, 0, 0, 0, 0, 0, 0, 0, 1, 1, 0, 0, 0, 0, 0, 0, 0, 0, 1, 1, 0, 0, 0,
+ 0, 0, 0, 0, 0,
+ ]);
+
+ info("Resetting filters.");
+ EventUtils.sendMouseEvent(
+ { type: "click" },
+ document.querySelector(".requests-list-filter-all-button")
+ );
+ testFilterButtons(monitor, "all");
+ await testContents([
+ 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1,
+ 1, 1, 1, 1, 1,
+ ]);
+
+ await teardown(monitor);
+
+ function getSelectedIndex(state) {
+ if (!state.requests.selectedId) {
+ return -1;
+ }
+ return getSortedRequests(state).findIndex(
+ r => r.id === state.requests.selectedId
+ );
+ }
+
+ async function testContents(visibility) {
+ const requestItems = document.querySelectorAll(".request-list-item");
+ for (const requestItem of requestItems) {
+ requestItem.scrollIntoView();
+ const requestsListStatus = requestItem.querySelector(".status-code");
+ EventUtils.sendMouseEvent({ type: "mouseover" }, requestsListStatus);
+ await waitUntil(() => requestsListStatus.title);
+ }
+
+ isnot(
+ getSelectedRequest(store.getState()),
+ null,
+ "There should still be a selected item after filtering."
+ );
+ is(
+ getSelectedIndex(store.getState()),
+ 0,
+ "The first item should be still selected after filtering."
+ );
+ is(
+ !!document.querySelector(".network-details-bar"),
+ true,
+ "The network details panel should still be visible after filtering."
+ );
+
+ const items = getSortedRequests(store.getState());
+ const visibleItems = getDisplayedRequests(store.getState());
+
+ is(
+ items.length,
+ visibility.length,
+ "There should be a specific amount of items in the requests menu."
+ );
+ is(
+ visibleItems.length,
+ visibility.filter(e => e).length,
+ "There should be a specific amount of visible items in the requests menu."
+ );
+
+ for (let i = 0; i < visibility.length; i++) {
+ const itemId = items[i].id;
+ const shouldBeVisible = !!visibility[i];
+ const isThere = visibleItems.some(r => r.id == itemId);
+ is(
+ isThere,
+ shouldBeVisible,
+ `The item at index ${i} has visibility=${shouldBeVisible}`
+ );
+ }
+
+ for (let i = 0; i < EXPECTED_REQUESTS.length; i++) {
+ const { method, url, data } = EXPECTED_REQUESTS[i];
+ for (let j = i; j < visibility.length; j += EXPECTED_REQUESTS.length) {
+ if (visibility[j]) {
+ verifyRequestItemTarget(
+ document,
+ getDisplayedRequests(store.getState()),
+ getSortedRequests(store.getState())[i],
+ method,
+ url,
+ data
+ );
+ }
+ }
+ }
+ }
+});