Bug 1409920 - Add status-codes, partial status-codes as filter options in the network panel. r=rickychien draft
authorabhinav <abhinav.koppula@gmail.com>
Sun, 12 Nov 2017 01:16:43 +0530
changeset 704235 036049884c61169cb3b5531a4e4e1cbaa57390aa
parent 702247 960f50c2e0a991ab2ab313132e69fb2c96cb7866
child 742043 5645ff80ed108eb1b9506156c92ab4c5c4320cad
push id91122
push userbmo:abhinav.koppula@gmail.com
push dateTue, 28 Nov 2017 12:11:42 +0000
reviewersrickychien
bugs1409920
milestone59.0a1
Bug 1409920 - Add status-codes, partial status-codes as filter options in the network panel. r=rickychien MozReview-Commit-ID: L9t090w2yQU
devtools/client/netmonitor/src/constants.js
devtools/client/netmonitor/src/utils/filter-autocomplete-provider.js
devtools/client/netmonitor/src/utils/filter-text-utils.js
devtools/client/netmonitor/src/utils/mdn-utils.js
--- a/devtools/client/netmonitor/src/constants.js
+++ b/devtools/client/netmonitor/src/constants.js
@@ -1,14 +1,66 @@
 /* This Source Code Form is subject to the terms of the Mozilla Public
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
 "use strict";
 
+/**
+ * A mapping of HTTP status codes to external documentation. Any code included
+ * here will show a MDN link alongside it.
+ */
+const SUPPORTED_HTTP_CODES = [
+    "100",
+    "101",
+    "200",
+    "201",
+    "202",
+    "203",
+    "204",
+    "205",
+    "206",
+    "300",
+    "301",
+    "302",
+    "303",
+    "304",
+    "307",
+    "308",
+    "400",
+    "401",
+    "403",
+    "404",
+    "405",
+    "406",
+    "407",
+    "408",
+    "409",
+    "410",
+    "411",
+    "412",
+    "413",
+    "414",
+    "415",
+    "416",
+    "417",
+    "426",
+    "428",
+    "429",
+    "431",
+    "451",
+    "500",
+    "501",
+    "502",
+    "503",
+    "504",
+    "505",
+    "511"
+];
+
 const actionTypes = {
   ADD_REQUEST: "ADD_REQUEST",
   ADD_TIMING_MARKER: "ADD_TIMING_MARKER",
   BATCH_ACTIONS: "BATCH_ACTIONS",
   BATCH_ENABLE: "BATCH_ENABLE",
   CLEAR_REQUESTS: "CLEAR_REQUESTS",
   CLEAR_TIMING_MARKERS: "CLEAR_TIMING_MARKERS",
   CLONE_SELECTED_REQUEST: "CLONE_SELECTED_REQUEST",
@@ -305,12 +357,13 @@ const general = {
   UPDATE_PROPS,
   HEADERS,
   RESPONSE_HEADERS,
   FILTER_FLAGS,
   FILTER_TAGS,
   SOURCE_EDITOR_SYNTAX_HIGHLIGHT_MAX_SIZE: 51200, // 50 KB in bytes
   REQUESTS_WATERFALL,
   PANELS,
+  SUPPORTED_HTTP_CODES,
 };
 
 // flatten constants
 module.exports = Object.assign({}, general, actionTypes);
--- a/devtools/client/netmonitor/src/utils/filter-autocomplete-provider.js
+++ b/devtools/client/netmonitor/src/utils/filter-autocomplete-provider.js
@@ -1,15 +1,15 @@
 /* This Source Code Form is subject to the terms of the Mozilla Public
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
 "use strict";
 
-const { FILTER_FLAGS } = require("../constants");
+const { FILTER_FLAGS, SUPPORTED_HTTP_CODES } = require("../constants");
 
 /*
  * Generates a value for the given filter
  * ie. if flag = status-code, will generate "200" from the given request item.
  * For flags related to cookies, it might generate an array based on the request
  * ie. ["cookie-name-1", "cookie-name-2", ...]
  *
  * @param {string} flag - flag specified in filter, ie. "status-code"
@@ -152,21 +152,34 @@ function autocompleteProvider(filter, re
     return [];
   }
 
   let autocompleteList;
   let availableValues = getLastTokenFlagValues(lastToken, requests);
   if (availableValues.length > 0) {
     autocompleteList = availableValues;
   } else {
-    autocompleteList = baseList
+    let filteredStatusCodes = [];
+    let isNegativeFlag = lastToken.startsWith("-");
+    filteredStatusCodes = SUPPORTED_HTTP_CODES.filter((item) => {
+      item = isNegativeFlag ? item.substr(1) : item;
+      return item.toLowerCase().startsWith(lastToken.toLowerCase());
+    });
+
+    if (filteredStatusCodes.length > 0) {
+      autocompleteList = isNegativeFlag ?
+        filteredStatusCodes.map((item) => `-status-code:${item}`) :
+        filteredStatusCodes.map((item) => `status-code:${item}`);
+    } else {
+      autocompleteList = baseList
       .filter((item) => {
         return item.toLowerCase().startsWith(lastToken.toLowerCase())
           && item.toLowerCase() !== lastToken.toLowerCase();
       });
+    }
   }
 
   return autocompleteList
     .sort()
     .map(item => ({
       value: [...previousTokens, item].join(" "),
       displayValue: item,
     }));
--- a/devtools/client/netmonitor/src/utils/filter-text-utils.js
+++ b/devtools/client/netmonitor/src/utils/filter-text-utils.js
@@ -25,17 +25,17 @@
  * DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
  * THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
  * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
  * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  */
 
 "use strict";
 
-const { FILTER_FLAGS } = require("../constants");
+const { FILTER_FLAGS, SUPPORTED_HTTP_CODES } = require("../constants");
 const { getFormattedIPAndPort } = require("./format-utils");
 
 /*
   The function `parseFilters` is from:
   https://github.com/ChromeDevTools/devtools-frontend/
 
   front_end/network/FilterSuggestionBuilder.js#L138-L163
   Commit f340aefd7ec9b702de9366a812288cfb12111fce
@@ -47,16 +47,30 @@ function parseFilters(query) {
   let parts = query.split(/\s+/);
 
   for (let part of parts) {
     if (!part) {
       continue;
     }
     let colonIndex = part.indexOf(":");
     if (colonIndex === -1) {
+      let negative = part.startsWith("-");
+      let filteredStatusCodes = SUPPORTED_HTTP_CODES.filter((item) => {
+        item = negative ? item.substr(1) : item;
+        return item.toLowerCase().startsWith(part.toLowerCase());
+      });
+      if (filteredStatusCodes.length > 0) {
+        flags.push({
+          type: "status-code",
+          value: negative ? part.substring(1) : part,
+          negative,
+        });
+        continue;
+      }
+
       text.push(part);
       continue;
     }
     let key = part.substring(0, colonIndex);
     let negative = key.startsWith("-");
     if (negative) {
       key = key.substring(1);
     }
@@ -108,17 +122,17 @@ function isFlagFilterMatch(item, { type,
     return true;
   }
 
   let match = true;
   let { responseCookies = { cookies: [] } } = item;
   responseCookies = responseCookies.cookies || responseCookies;
   switch (type) {
     case "status-code":
-      match = item.status === value;
+      match = item.status !== undefined && item.status.toString().startsWith(value);
       break;
     case "method":
       match = item.method.toLowerCase() === value;
       break;
     case "protocol":
       let protocol = item.httpVersion;
       match = typeof protocol === "string" ?
                 protocol.toLowerCase().includes(value) : false;
--- a/devtools/client/netmonitor/src/utils/mdn-utils.js
+++ b/devtools/client/netmonitor/src/utils/mdn-utils.js
@@ -1,14 +1,16 @@
 /* This Source Code Form is subject to the terms of the Mozilla Public
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
 "use strict";
 
+const { SUPPORTED_HTTP_CODES } = require("../constants");
+
 /**
  * A mapping of header names to external documentation. Any header included
  * here will show a MDN link alongside it.
  */
 const SUPPORTED_HEADERS = [
   "Accept",
   "Accept-Charset",
   "Accept-Encoding",
@@ -83,68 +85,16 @@ const SUPPORTED_HEADERS = [
   "X-DNS-Prefetch-Control",
   "X-Forwarded-For",
   "X-Forwarded-Host",
   "X-Forwarded-Proto",
   "X-Frame-Options",
   "X-XSS-Protection"
 ];
 
-/**
- * A mapping of HTTP status codes to external documentation. Any code included
- * here will show a MDN link alongside it.
- */
-const SUPPORTED_HTTP_CODES = [
-    "100",
-    "101",
-    "200",
-    "201",
-    "202",
-    "203",
-    "204",
-    "205",
-    "206",
-    "300",
-    "301",
-    "302",
-    "303",
-    "304",
-    "307",
-    "308",
-    "400",
-    "401",
-    "403",
-    "404",
-    "405",
-    "406",
-    "407",
-    "408",
-    "409",
-    "410",
-    "411",
-    "412",
-    "413",
-    "414",
-    "415",
-    "416",
-    "417",
-    "426",
-    "428",
-    "429",
-    "431",
-    "451",
-    "500",
-    "501",
-    "502",
-    "503",
-    "504",
-    "505",
-    "511"
-];
-
 const MDN_URL = "https://developer.mozilla.org/docs/";
 const GA_PARAMS =
   "?utm_source=mozilla&utm_medium=devtools-netmonitor&utm_campaign=default";
 
 /**
  * Get the MDN URL for the specified header.
  *
  * @param {string} header Name of the header for the baseURL to use.