summaryrefslogtreecommitdiffstats
path: root/devtools/client/framework/browser-toolbox/test/browser_browser_toolbox_netmonitor.js
blob: 56e38998cef30bfed728fe5b2d1fe51b00db75c8 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
/* Any copyright is dedicated to the Public Domain.
   http://creativecommons.org/publicdomain/zero/1.0/ */

"use strict";

/* global gToolbox */

add_task(async function () {
  // Disable several prefs to avoid network requests.
  await pushPref("browser.safebrowsing.blockedURIs.enabled", false);
  await pushPref("browser.safebrowsing.downloads.enabled", false);
  await pushPref("browser.safebrowsing.malware.enabled", false);
  await pushPref("browser.safebrowsing.phishing.enabled", false);
  await pushPref("privacy.query_stripping.enabled", false);
  await pushPref("extensions.systemAddon.update.enabled", false);

  await pushPref("services.settings.server", "invalid://err");

  // Define a set list of visible columns
  await pushPref(
    "devtools.netmonitor.visibleColumns",
    JSON.stringify(["file", "url", "status"])
  );

  // Force observice all processes to see the content process requests
  await pushPref("devtools.browsertoolbox.scope", "everything");

  const ToolboxTask = await initBrowserToolboxTask();

  await ToolboxTask.importFunctions({
    waitUntil,
  });

  await ToolboxTask.spawn(null, async () => {
    const { resourceCommand } = gToolbox.commands;

    // Assert that the toolbox is not listening to network events
    // before the netmonitor panel is opened.
    is(
      resourceCommand.isResourceWatched(resourceCommand.TYPES.NETWORK_EVENT),
      false,
      "The toolox is not watching for network event resources"
    );

    await gToolbox.selectTool("netmonitor");
    const monitor = gToolbox.getCurrentPanel();
    const { document, store, windowRequire } = monitor.panelWin;

    const Actions = windowRequire(
      "devtools/client/netmonitor/src/actions/index"
    );

    store.dispatch(Actions.batchEnable(false));

    await waitUntil(
      () => !!document.querySelector(".request-list-empty-notice")
    );

    is(
      resourceCommand.isResourceWatched(resourceCommand.TYPES.NETWORK_EVENT),
      true,
      "The network panel is now watching for network event resources"
    );

    const emptyListNotice = document.querySelector(
      ".request-list-empty-notice"
    );

    ok(
      !!emptyListNotice,
      "An empty notice should be displayed when the frontend is opened."
    );

    is(
      emptyListNotice.innerText,
      "Perform a request to see detailed information about network activity.",
      "The reload and perfomance analysis details should not be visible in the browser toolbox"
    );

    is(
      store.getState().requests.requests.length,
      0,
      "The requests should be empty when the frontend is opened."
    );

    ok(
      !document.querySelector(".requests-list-network-summary-button"),
      "The perfomance analysis button should not be visible in the browser toolbox"
    );
  });

  info("Trigger request in parent process and check that it shows up");
  await fetch("https://example.org/document-builder.sjs?html=fromParent");

  await ToolboxTask.spawn(null, async () => {
    const monitor = gToolbox.getCurrentPanel();
    const { document, store } = monitor.panelWin;

    await waitUntil(
      () => !document.querySelector(".request-list-empty-notice")
    );
    ok(true, "The empty notice is no longer displayed");
    is(
      store.getState().requests.requests.length,
      1,
      "There's 1 request in the store"
    );

    const requests = Array.from(
      document.querySelectorAll("tbody .requests-list-column.requests-list-url")
    );
    is(requests.length, 1, "One request displayed");
    is(
      requests[0].textContent,
      "https://example.org/document-builder.sjs?html=fromParent",
      "Expected request is displayed"
    );
  });

  info("Trigger content process requests");
  const urlImg = `${URL_ROOT_SSL}test-image.png?fromContent&${Date.now()}-${Math.random()}`;
  await addTab(
    `https://example.com/document-builder.sjs?html=${encodeURIComponent(
      `<img src='${urlImg}'>`
    )}`
  );

  await ToolboxTask.spawn(urlImg, async innerUrlImg => {
    const monitor = gToolbox.getCurrentPanel();
    const { document, store } = monitor.panelWin;

    await waitUntil(() => store.getState().requests.requests.length >= 3);
    ok(true, "Expected content requests are displayed");

    const requests = Array.from(
      document.querySelectorAll("tbody .requests-list-column.requests-list-url")
    );
    is(requests.length, 3, "Three requests displayed");
    ok(
      requests[1].textContent.includes(
        `https://example.com/document-builder.sjs`
      ),
      "Request for the tab is displayed"
    );
    is(
      requests[2].textContent,
      innerUrlImg,
      "Request for image image in tab is displayed"
    );
  });
});