Bug 1409920 - Add status-codes, partial status-codes as filter options in the network panel. r=rickychien
MozReview-Commit-ID: L9t090w2yQU
--- 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.