diff --git a/src/devtools/panel.js b/src/devtools/panel.js index c134831..bda346d 100644 --- a/src/devtools/panel.js +++ b/src/devtools/panel.js @@ -562,10 +562,14 @@ window.Omnibug = (() => { * * @param requestId */ - function updateRedirectedEntries(requestId) { + function updateRedirectedEntries(requestId, multipleEntriesPerRequest) { let redirectedEntries = d.querySelectorAll(`.request[data-request-id="${requestId}"]`); redirectedEntries.forEach((entry) => { - entry.classList.add("redirected"); + if (multipleEntriesPerRequest) { + entry.classList.add("multipled"); + } else { + entry.classList.add("redirected"); + } }); } @@ -630,7 +634,7 @@ window.Omnibug = (() => { body = createElement("div"); // Update any redirected entries - updateRedirectedEntries(request.request.id); + updateRedirectedEntries(request.request.id, request.multipleEntriesPerRequest); // Setup parent details element if (settings.alwaysExpand) { @@ -654,6 +658,16 @@ window.Omnibug = (() => { }, "children": [colTitleRedirectIcon] }), + colTitleMultipleIcon = createElement("i", { + "classes": ["fas", "fa-table"] + }), + colTitleMultiple = createElement("small", { + "classes": ["multiple", "multiple-icon"], + "attributes": { + "title": "This entry was part of a single request." + }, + "children": [colTitleMultipleIcon] + }), colAccount = createElement("div", { "classes": ["column", "col-3", "col-lg-4", "col-md-4", "col-sm-5"] }), @@ -680,7 +694,7 @@ window.Omnibug = (() => { let colTitleWrapper = createElement("div", { "classes": ["column", "col-3", "col-lg-4", "col-md-4", "col-sm-5"], - "children": [requestTypeEl, colTitleSpan, colTitleRedirect], + "children": [requestTypeEl, colTitleSpan, colTitleRedirect, colTitleMultiple], "attributes": { "title": `${request.provider.name} ${requestTypeValue.value}` } diff --git a/src/devtools/panel.scss b/src/devtools/panel.scss index 9f3165a..d152d8e 100644 --- a/src/devtools/panel.scss +++ b/src/devtools/panel.scss @@ -157,6 +157,9 @@ nav.navbar { .request:not(.redirected) .redirect { display: none; } +.request:not(.multipled) .multiple { + display: none; +} .request.redirected { .redirect-icon { margin-left: .5em; @@ -171,6 +174,20 @@ nav.navbar { color: $warning-color; } } +.request.multipled { + .multiple-icon { + margin-left: .5em; + color: $gray-color; + } + .request-note { + margin-top: 0.4rem; + } +} +.request.redirected:hover { + .redirect-icon { + color: $warning-color; + } +} .request-details { > summary { font-weight: 600; diff --git a/src/eventPage.js b/src/eventPage.js index 68a84b1..d7cb9d9 100644 --- a/src/eventPage.js +++ b/src/eventPage.js @@ -99,14 +99,23 @@ } } - // Parse the URL and join our request info to the parsed data - data = Object.assign( - data, - OmnibugProvider.parseUrl(data.request.url, data.request.postData) - ); - - console.log("Matched URL, sending data to devtools", data); - tabs[details.tabId].port.postMessage(data); + let providerDataArray = OmnibugProvider.parseUrl(data.request.url, data.request.postData); + if (!Array.isArray(providerDataArray)) { + providerDataArray = [providerDataArray]; + } else { + data.multipleEntriesPerRequest = true; + } + + providerDataArray.forEach(providerData => { + // Parse the URL and join our request info to the parsed data + let finalData = Object.assign( + data, + providerData + ); + console.log("Matched URL, sending data to devtools", finalData); + tabs[details.tabId].port.postMessage(finalData); + }); + }, { urls: [""] }, ["requestBody"]