devtools/client/netmonitor/test/browser_net_raw_headers.js

   1 /* Any copyright is dedicated to the Public Domain.
   2    http://creativecommons.org/publicdomain/zero/1.0/ */
   3
   4 "use strict";
   5
   6 /**
   7  * Tests if showing raw headers works.
   8  */
   9
  10 add_task(async function () {
  11   const { tab, monitor } = await initNetMonitor(POST_DATA_URL, {
  12     requestCount: 1,
  13   });
  14   info("Starting test... ");
  15
  16   const { document, store, windowRequire } = monitor.panelWin;
  17   const Actions = windowRequire("devtools/client/netmonitor/src/actions/index");
  18   const { getSortedRequests } = windowRequire(
  19     "devtools/client/netmonitor/src/selectors/index"
  20   );
  21
  22   store.dispatch(Actions.batchEnable(false));
  23
  24   // Execute requests.
  25   await performRequests(monitor, tab, 2);
  26
  27   let wait = waitForDOM(document, "#headers-panel .accordion-item", 2);
  28   EventUtils.sendMouseEvent(
  29     { type: "mousedown" },
  30     document.querySelectorAll(".request-list-item")[0]
  31   );
  32   await wait;
  33
  34   wait = waitForDOM(document, "#responseHeaders textarea.raw-headers", 1);
  35   EventUtils.sendMouseEvent({ type: "click" }, getRawHeadersToggle("RESPONSE"));
  36   await wait;
  37
  38   wait = waitForDOM(document, "#requestHeaders textarea.raw-headers", 1);
  39   EventUtils.sendMouseEvent({ type: "click" }, getRawHeadersToggle("REQUEST"));
  40   await wait;
  41
  42   testRawHeaderToggleStyle(true);
  43   testShowRawHeaders(getSortedRequests(store.getState())[0]);
  44
  45   EventUtils.sendMouseEvent({ type: "click" }, getRawHeadersToggle("RESPONSE"));
  46   EventUtils.sendMouseEvent({ type: "click" }, getRawHeadersToggle("REQUEST"));
  47
  48   testRawHeaderToggleStyle(false);
  49   testHideRawHeaders(document);
  50
  51   return teardown(monitor);
  52
  53   /**
  54    * Tests that checked is applied correctly
  55    *
  56    * @param checked
  57    *        flag indicating whether toggle is checked or not
  58    */
  59   function testRawHeaderToggleStyle(checked) {
  60     const rawHeadersRequestToggle = getRawHeadersToggle("REQUEST");
  61     const rawHeadersResponseToggle = getRawHeadersToggle("RESPONSE");
  62
  63     if (checked) {
  64       is(
  65         rawHeadersRequestToggle.checked,
  66         true,
  67         "The 'Raw Request Headers' toggle should be 'checked'"
  68       );
  69       is(
  70         rawHeadersResponseToggle.checked,
  71         true,
  72         "The 'Raw Response Headers' toggle should be 'checked'"
  73       );
  74     } else {
  75       is(
  76         rawHeadersRequestToggle.checked,
  77         false,
  78         "The 'Raw Request Headers' toggle should NOT be 'checked'"
  79       );
  80       is(
  81         rawHeadersResponseToggle.checked,
  82         false,
  83         "The 'Raw Response Headers' toggle should NOT be 'checked'"
  84       );
  85     }
  86   }
  87
  88   /*
  89    * Tests that raw headers were displayed correctly
  90    */
  91   function testShowRawHeaders(data) {
  92     // Request headers are rendered first, so it is element with index 1
  93     const requestHeaders = document.querySelectorAll("textarea.raw-headers")[1]
  94       .value;
  95     for (const header of data.requestHeaders.headers) {
  96       ok(
  97         requestHeaders.includes(header.name + ": " + header.value),
  98         "textarea contains request headers"
  99       );
 100     }
 101     // Response headers are rendered first, so it is element with index 0
 102     const responseHeaders = document.querySelectorAll("textarea.raw-headers")[0]
 103       .value;
 104     for (const header of data.responseHeaders.headers) {
 105       ok(
 106         responseHeaders.includes(header.name + ": " + header.value),
 107         "textarea contains response headers"
 108       );
 109     }
 110   }
 111
 112   /*
 113    * Tests that raw headers textareas are hidden
 114    */
 115   function testHideRawHeaders() {
 116     ok(
 117       !document.querySelector(".raw-headers-container"),
 118       "raw request headers textarea is empty"
 119     );
 120   }
 121
 122   /**
 123    * Returns the 'Raw Headers' button
 124    */
 125   function getRawHeadersToggle(rawHeaderType) {
 126     if (rawHeaderType === "RESPONSE") {
 127       // Response header is first displayed
 128       return document.querySelectorAll(".devtools-checkbox-toggle")[0];
 129     }
 130     return document.querySelectorAll(".devtools-checkbox-toggle")[1];
 131   }
 132 });