From 3df16dac14695a5f8175ab312f0d3fb5e5c5cdd1 Mon Sep 17 00:00:00 2001 From: Justin <57725347+juskek@users.noreply.github.com> Date: Wed, 19 Jul 2023 10:32:11 +0100 Subject: [PATCH 1/9] Added chrome.debugger to monitor network requests --- public/manifest.json | 3 +- src/background/background.ts | 116 +++++++++++++++++++++----- src/background/webRequestListeners.ts | 2 +- 3 files changed, 97 insertions(+), 24 deletions(-) diff --git a/public/manifest.json b/public/manifest.json index 3e7bf0e3..97846170 100644 --- a/public/manifest.json +++ b/public/manifest.json @@ -9,7 +9,8 @@ "permissions": [ "webRequest", "tabs", - "storage" + "storage", + "debugger" ], "host_permissions": [ "*://*/*/" diff --git a/src/background/background.ts b/src/background/background.ts index 1838d333..188e9590 100644 --- a/src/background/background.ts +++ b/src/background/background.ts @@ -1,5 +1,6 @@ import { IBytesRepository } from "../data/bytes/IBytesRepository"; import { + addBytesTransferred, catchPostRequestBodySize, catchRequestHeaderSize, catchResponseSize, @@ -15,33 +16,104 @@ chrome.runtime.onMessage.addListener((message, sender, sendResponse) => { if (message.command === "startRecordingBytesTransferred") { IBytesRepository.instance.clearBytesTransferred(); - chrome.webRequest.onBeforeRequest.addListener( - catchPostRequestBodySize, - { urls: [""], tabId }, - ["requestBody"] - ); - chrome.webRequest.onBeforeSendHeaders.addListener( - catchRequestHeaderSize, - { urls: [""], tabId }, - ["requestHeaders"] - ); - chrome.webRequest.onCompleted.addListener( - catchResponseSize, - { urls: [""], tabId }, - ["responseHeaders"] - ); + chrome.debugger.attach({ tabId: tabId }, "1.2", function () { + chrome.debugger.sendCommand( + { tabId: tabId }, + "Network.enable", + {}, + function () { + if (chrome.runtime.lastError) { + console.error(chrome.runtime.lastError); + } + } + ); + }); + sendResponse(true); } if (message.command === "stopRecordingBytesTransferred") { - chrome.webRequest.onCompleted.removeListener(catchResponseSize); - chrome.webRequest.onBeforeRequest.removeListener( - catchPostRequestBodySize - ); - chrome.webRequest.onBeforeSendHeaders.removeListener( - catchRequestHeaderSize - ); + chrome.debugger.detach({ tabId: tabId }); sendResponse(true); } return true; }); + +chrome.debugger.onEvent.addListener(function (source, method, params) { + switch (method) { + case "Network.responseReceived": { + const { encodedDataLength } = params as { + encodedDataLength?: number; + }; + console.log("Network.responseReceived:", encodedDataLength); + if (encodedDataLength) { + addBytesTransferred(encodedDataLength); + } + break; + } + case "Network.dataReceived": { + const { encodedDataLength } = params as { + encodedDataLength?: number; + }; + console.log("Network.dataReceived:", encodedDataLength); + if (encodedDataLength) { + addBytesTransferred(encodedDataLength); + } + break; + } + case "Network.loadingFinished": { + const { encodedDataLength } = params as { + encodedDataLength?: number; + }; + console.log("Network.loadingFinished:", encodedDataLength); + if (encodedDataLength) { + addBytesTransferred(encodedDataLength); + } + break; + } + case "Network.loadingFailed": { + const { encodedDataLength } = params as { + encodedDataLength?: number; + }; + console.log("Network.loadingFailed:", encodedDataLength); + if (encodedDataLength) { + addBytesTransferred(encodedDataLength); + } + break; + } + + case "Network.signedExchangeReceived": { + const { encodedDataLength } = params as { + encodedDataLength?: number; + }; + console.log("Network.signedExchangeReceived:", encodedDataLength); + if (encodedDataLength) { + addBytesTransferred(encodedDataLength); + } + break; + } + + case "Network.webSocketClosed": { + const { encodedDataLength } = params as { + encodedDataLength?: number; + }; + console.log("Network.webSocketClosed:", encodedDataLength); + if (encodedDataLength) { + addBytesTransferred(encodedDataLength); + } + break; + } + case "Network.webTransportClosed": { + const { encodedDataLength } = params as { + encodedDataLength?: number; + }; + console.log("Network.webTransportClosed:", encodedDataLength); + if (encodedDataLength) { + addBytesTransferred(encodedDataLength); + } + break; + } + default: + break; + } +}); diff --git a/src/background/webRequestListeners.ts b/src/background/webRequestListeners.ts index 70e6750f..3f9111d8 100644 --- a/src/background/webRequestListeners.ts +++ b/src/background/webRequestListeners.ts @@ -6,7 +6,7 @@ import { getResponseHeaderSize, } from "./getWebRequestSizeHelpers"; -const addBytesTransferred = async (bytes: number) => { +export const addBytesTransferred = async (bytes: number) => { IBytesRepository.instance.addBytesTransferred(bytes); try { From eb579aea87436282159290c7fa5fa992742c0d45 Mon Sep 17 00:00:00 2001 From: Justin <57725347+juskek@users.noreply.github.com> Date: Thu, 20 Jul 2023 15:30:43 +0100 Subject: [PATCH 2/9] refactor: Record bytes transferred using Network.loadingFinished event Github accurate Stack overflow accurate Theodo -4% error Youtube accurate Trello -13% error --- src/background/background.ts | 122 +++++++++++++++++++++-------------- 1 file changed, 73 insertions(+), 49 deletions(-) diff --git a/src/background/background.ts b/src/background/background.ts index 188e9590..36f32fd1 100644 --- a/src/background/background.ts +++ b/src/background/background.ts @@ -1,10 +1,5 @@ import { IBytesRepository } from "../data/bytes/IBytesRepository"; -import { - addBytesTransferred, - catchPostRequestBodySize, - catchRequestHeaderSize, - catchResponseSize, -} from "./webRequestListeners"; +import { addBytesTransferred } from "./webRequestListeners"; chrome.runtime.onMessage.addListener((message, sender, sendResponse) => { if (message === "getBytesTransferred") { @@ -42,75 +37,104 @@ chrome.runtime.onMessage.addListener((message, sender, sendResponse) => { chrome.debugger.onEvent.addListener(function (source, method, params) { switch (method) { case "Network.responseReceived": { - const { encodedDataLength } = params as { - encodedDataLength?: number; - }; - console.log("Network.responseReceived:", encodedDataLength); - if (encodedDataLength) { - addBytesTransferred(encodedDataLength); - } + // const { response } = params as { + // response?: { + // encodedDataLength?: number; + // }; + // }; + // // console.log("Network.responseReceived:", response); + // if (response?.encodedDataLength) { + // addBytesTransferred(response.encodedDataLength); + // } break; } case "Network.dataReceived": { - const { encodedDataLength } = params as { - encodedDataLength?: number; - }; - console.log("Network.dataReceived:", encodedDataLength); - if (encodedDataLength) { - addBytesTransferred(encodedDataLength); - } + // const { encodedDataLength } = params as { + // encodedDataLength?: number; + // }; + // // console.log("Network.dataReceived:", encodedDataLength); + // if (encodedDataLength) { + // addBytesTransferred(encodedDataLength); + // } break; } case "Network.loadingFinished": { + // console.log("Network.loadingFinished:", source, params); const { encodedDataLength } = params as { encodedDataLength?: number; }; - console.log("Network.loadingFinished:", encodedDataLength); + // console.log("Network.loadingFinished:", encodedDataLength); if (encodedDataLength) { addBytesTransferred(encodedDataLength); } break; } case "Network.loadingFailed": { - const { encodedDataLength } = params as { - encodedDataLength?: number; - }; - console.log("Network.loadingFailed:", encodedDataLength); - if (encodedDataLength) { - addBytesTransferred(encodedDataLength); - } + // console.log("Network.loadingFailed:", params); + // const { encodedDataLength } = params as { + // encodedDataLength?: number; + // }; + // console.log("Network.loadingFailed:", encodedDataLength); + // if (encodedDataLength) { + // addBytesTransferred(encodedDataLength); + // } break; } case "Network.signedExchangeReceived": { - const { encodedDataLength } = params as { - encodedDataLength?: number; - }; - console.log("Network.signedExchangeReceived:", encodedDataLength); - if (encodedDataLength) { - addBytesTransferred(encodedDataLength); - } + // const { encodedDataLength } = params as { + // encodedDataLength?: number; + // }; + // // console.log("Network.signedExchangeReceived:", encodedDataLength); + // if (encodedDataLength) { + // addBytesTransferred(encodedDataLength); + // } break; } case "Network.webSocketClosed": { - const { encodedDataLength } = params as { - encodedDataLength?: number; - }; - console.log("Network.webSocketClosed:", encodedDataLength); - if (encodedDataLength) { - addBytesTransferred(encodedDataLength); - } + // console.log("Network.webSocketClosed:", params); + // const { encodedDataLength } = params as { + // encodedDataLength?: number; + // }; + // console.log("Network.webSocketClosed:", encodedDataLength); + // if (encodedDataLength) { + // addBytesTransferred(encodedDataLength); + // } break; } case "Network.webTransportClosed": { - const { encodedDataLength } = params as { - encodedDataLength?: number; - }; - console.log("Network.webTransportClosed:", encodedDataLength); - if (encodedDataLength) { - addBytesTransferred(encodedDataLength); - } + // console.log("Network.webTransportClosed:", params); + // const { encodedDataLength } = params as { + // encodedDataLength?: number; + // }; + // console.log("Network.webTransportClosed:", encodedDataLength); + // if (encodedDataLength) { + // addBytesTransferred(encodedDataLength); + // } + break; + } + case "Network.requestWillBeSent": { + // console.log("Network.requestWillBeSent:", params); + // const { request } = params as { + // request?: { + // url?: string; + // }; + // }; + // if (request?.url) { + // console.log( + // "Network.requestWillBeSent: redirect detected", + // params, + // request.url + // ); + // } + // const { encodedDataLength } = params as { + // encodedDataLength?: number; + // }; + // console.log("Network.requestWillBeSent:", encodedDataLength); + // if (encodedDataLength) { + // addBytesTransferred(encodedDataLength); + // } break; } default: From e9f6c6995a34a727ef869aa3fa4802ec58123d26 Mon Sep 17 00:00:00 2001 From: Justin <57725347+juskek@users.noreply.github.com> Date: Thu, 20 Jul 2023 17:42:41 +0100 Subject: [PATCH 3/9] refactor: record bytes using on a request by request basis (does not update view) --- src/background/background.ts | 155 +++++++++--------- .../NetworkRequestManager.ts | 55 +++++++ 2 files changed, 134 insertions(+), 76 deletions(-) create mode 100644 src/background/network_request_manager/NetworkRequestManager.ts diff --git a/src/background/background.ts b/src/background/background.ts index 36f32fd1..d0bd46fa 100644 --- a/src/background/background.ts +++ b/src/background/background.ts @@ -1,5 +1,6 @@ import { IBytesRepository } from "../data/bytes/IBytesRepository"; -import { addBytesTransferred } from "./webRequestListeners"; +import { NetworkRequestManager } from "./network_request_manager/NetworkRequestManager"; +import { formatBytesString } from "../view/popup/utils/formatBytesString"; chrome.runtime.onMessage.addListener((message, sender, sendResponse) => { if (message === "getBytesTransferred") { @@ -37,104 +38,106 @@ chrome.runtime.onMessage.addListener((message, sender, sendResponse) => { chrome.debugger.onEvent.addListener(function (source, method, params) { switch (method) { case "Network.responseReceived": { - // const { response } = params as { - // response?: { - // encodedDataLength?: number; - // }; - // }; - // // console.log("Network.responseReceived:", response); - // if (response?.encodedDataLength) { - // addBytesTransferred(response.encodedDataLength); - // } + const { requestId, response } = params as { + requestId?: string; + response?: { + encodedDataLength?: number; + }; + }; + if ( + requestId === undefined || + response === undefined || + response.encodedDataLength === undefined + ) { + throw new Error( + `requestId or encodedDataLength is undefined: \nrequestId: ${requestId} \nencodedDataLength: ${response?.encodedDataLength}` + ); + } + NetworkRequestManager.setRequestTransferSize( + requestId, + response.encodedDataLength + ); + break; } case "Network.dataReceived": { - // const { encodedDataLength } = params as { - // encodedDataLength?: number; - // }; - // // console.log("Network.dataReceived:", encodedDataLength); - // if (encodedDataLength) { - // addBytesTransferred(encodedDataLength); - // } + const { requestId, encodedDataLength } = params as { + requestId?: string; + encodedDataLength?: number; + }; + if (requestId === undefined || encodedDataLength === undefined) { + throw new Error( + `requestId or encodedDataLength is undefined: \nrequestId: ${requestId} \nencodedDataLength: ${encodedDataLength}` + ); + } + NetworkRequestManager.increaseRequestTransferSize( + requestId, + encodedDataLength + ); + break; } case "Network.loadingFinished": { - // console.log("Network.loadingFinished:", source, params); - const { encodedDataLength } = params as { + const { requestId, encodedDataLength } = params as { + requestId?: string; encodedDataLength?: number; }; - // console.log("Network.loadingFinished:", encodedDataLength); - if (encodedDataLength) { - addBytesTransferred(encodedDataLength); + if (requestId === undefined || encodedDataLength === undefined) { + throw new Error( + `requestId or encodedDataLength is undefined: \nrequestId: ${requestId} \nencodedDataLength: ${encodedDataLength}` + ); } + NetworkRequestManager.setRequestTransferSize( + requestId, + encodedDataLength + ); + break; } case "Network.loadingFailed": { - // console.log("Network.loadingFailed:", params); - // const { encodedDataLength } = params as { - // encodedDataLength?: number; - // }; - // console.log("Network.loadingFailed:", encodedDataLength); - // if (encodedDataLength) { - // addBytesTransferred(encodedDataLength); - // } - break; - } + const { requestId } = params as { + requestId?: string; + }; + if (requestId === undefined) { + throw new Error("requestId is undefined"); + } + NetworkRequestManager.setRequestTransferSize(requestId, -1); - case "Network.signedExchangeReceived": { - // const { encodedDataLength } = params as { - // encodedDataLength?: number; - // }; - // // console.log("Network.signedExchangeReceived:", encodedDataLength); - // if (encodedDataLength) { - // addBytesTransferred(encodedDataLength); - // } break; } case "Network.webSocketClosed": { - // console.log("Network.webSocketClosed:", params); - // const { encodedDataLength } = params as { - // encodedDataLength?: number; - // }; - // console.log("Network.webSocketClosed:", encodedDataLength); - // if (encodedDataLength) { - // addBytesTransferred(encodedDataLength); - // } + const { requestId } = params as { + requestId?: string; + }; + if (requestId === undefined) { + throw new Error("requestId is undefined"); + } + NetworkRequestManager.setRequestTransferSize(requestId, -1); + break; } case "Network.webTransportClosed": { - // console.log("Network.webTransportClosed:", params); - // const { encodedDataLength } = params as { - // encodedDataLength?: number; - // }; - // console.log("Network.webTransportClosed:", encodedDataLength); - // if (encodedDataLength) { - // addBytesTransferred(encodedDataLength); - // } + const { requestId } = params as { + requestId?: string; + }; + if (requestId === undefined) { + throw new Error("requestId is undefined"); + } + NetworkRequestManager.setRequestTransferSize(requestId, -1); + break; } case "Network.requestWillBeSent": { - // console.log("Network.requestWillBeSent:", params); - // const { request } = params as { - // request?: { - // url?: string; - // }; - // }; - // if (request?.url) { - // console.log( - // "Network.requestWillBeSent: redirect detected", - // params, - // request.url - // ); - // } - // const { encodedDataLength } = params as { - // encodedDataLength?: number; - // }; - // console.log("Network.requestWillBeSent:", encodedDataLength); - // if (encodedDataLength) { - // addBytesTransferred(encodedDataLength); - // } + const { requestId } = params as { + requestId?: string; + }; + if (requestId === undefined) { + throw new Error("requestId is undefined"); + } + + NetworkRequestManager.addRequest(requestId); + break; } default: diff --git a/src/background/network_request_manager/NetworkRequestManager.ts b/src/background/network_request_manager/NetworkRequestManager.ts new file mode 100644 index 00000000..e8e5afb7 --- /dev/null +++ b/src/background/network_request_manager/NetworkRequestManager.ts @@ -0,0 +1,55 @@ +export abstract class NetworkRequestManager { + private static networkRequests: Map = new Map< + string, + number + >(); + + static clearNetworkRequests(): void { + NetworkRequestManager.networkRequests = new Map(); + } + + static getTransferredBytes(): number { + let bytesTransferred = 0; + NetworkRequestManager.networkRequests.forEach((value) => { + if (value > 0) { + bytesTransferred += value; + } + }); + return bytesTransferred; + } + + static addRequest(requestId: string): void { + if (NetworkRequestManager.networkRequests.has(requestId)) { + NetworkRequestManager.networkRequests.set(requestId, 0); + return; + } + NetworkRequestManager.networkRequests.set(requestId, 0); + } + + static setRequestTransferSize( + requestId: string, + encodedDataLength: number + ): void { + NetworkRequestManager.networkRequests.set(requestId, encodedDataLength); + } + + static increaseRequestTransferSize( + requestId: string, + encodedDataLength: number + ): void { + if (!NetworkRequestManager.networkRequests.has(requestId)) { + throw new Error("Request not found"); + } + + const previous = NetworkRequestManager.networkRequests.get(requestId); + + if (previous === undefined) { + throw new Error("Request not found"); + } + + NetworkRequestManager.networkRequests.set( + requestId, + previous + encodedDataLength + ); + } +} From a1da0aac31f95621b8fd49ca1f56d25d894633f7 Mon Sep 17 00:00:00 2001 From: Justin <57725347+juskek@users.noreply.github.com> Date: Thu, 20 Jul 2023 17:49:49 +0100 Subject: [PATCH 4/9] revert: use loadingFinished instead, removed unnecessary functions --- src/background/background.ts | 103 +----------------- src/background/backgroundHelpers.ts | 27 +++++ src/background/getWebRequestSizeHelpers.ts | 48 -------- .../NetworkRequestManager.ts | 55 ---------- src/background/webRequestListeners.ts | 65 ----------- 5 files changed, 31 insertions(+), 267 deletions(-) create mode 100644 src/background/backgroundHelpers.ts delete mode 100644 src/background/getWebRequestSizeHelpers.ts delete mode 100644 src/background/network_request_manager/NetworkRequestManager.ts delete mode 100644 src/background/webRequestListeners.ts diff --git a/src/background/background.ts b/src/background/background.ts index d0bd46fa..7046fd0f 100644 --- a/src/background/background.ts +++ b/src/background/background.ts @@ -1,6 +1,5 @@ import { IBytesRepository } from "../data/bytes/IBytesRepository"; -import { NetworkRequestManager } from "./network_request_manager/NetworkRequestManager"; -import { formatBytesString } from "../view/popup/utils/formatBytesString"; +import { addBytesTransferred } from "./backgroundHelpers"; chrome.runtime.onMessage.addListener((message, sender, sendResponse) => { if (message === "getBytesTransferred") { @@ -37,107 +36,13 @@ chrome.runtime.onMessage.addListener((message, sender, sendResponse) => { chrome.debugger.onEvent.addListener(function (source, method, params) { switch (method) { - case "Network.responseReceived": { - const { requestId, response } = params as { - requestId?: string; - response?: { - encodedDataLength?: number; - }; - }; - if ( - requestId === undefined || - response === undefined || - response.encodedDataLength === undefined - ) { - throw new Error( - `requestId or encodedDataLength is undefined: \nrequestId: ${requestId} \nencodedDataLength: ${response?.encodedDataLength}` - ); - } - NetworkRequestManager.setRequestTransferSize( - requestId, - response.encodedDataLength - ); - - break; - } - case "Network.dataReceived": { - const { requestId, encodedDataLength } = params as { - requestId?: string; - encodedDataLength?: number; - }; - if (requestId === undefined || encodedDataLength === undefined) { - throw new Error( - `requestId or encodedDataLength is undefined: \nrequestId: ${requestId} \nencodedDataLength: ${encodedDataLength}` - ); - } - NetworkRequestManager.increaseRequestTransferSize( - requestId, - encodedDataLength - ); - - break; - } case "Network.loadingFinished": { - const { requestId, encodedDataLength } = params as { - requestId?: string; + const { encodedDataLength } = params as { encodedDataLength?: number; }; - if (requestId === undefined || encodedDataLength === undefined) { - throw new Error( - `requestId or encodedDataLength is undefined: \nrequestId: ${requestId} \nencodedDataLength: ${encodedDataLength}` - ); - } - NetworkRequestManager.setRequestTransferSize( - requestId, - encodedDataLength - ); - - break; - } - case "Network.loadingFailed": { - const { requestId } = params as { - requestId?: string; - }; - if (requestId === undefined) { - throw new Error("requestId is undefined"); + if (encodedDataLength) { + addBytesTransferred(encodedDataLength); } - NetworkRequestManager.setRequestTransferSize(requestId, -1); - - break; - } - - case "Network.webSocketClosed": { - const { requestId } = params as { - requestId?: string; - }; - if (requestId === undefined) { - throw new Error("requestId is undefined"); - } - NetworkRequestManager.setRequestTransferSize(requestId, -1); - - break; - } - case "Network.webTransportClosed": { - const { requestId } = params as { - requestId?: string; - }; - if (requestId === undefined) { - throw new Error("requestId is undefined"); - } - NetworkRequestManager.setRequestTransferSize(requestId, -1); - - break; - } - case "Network.requestWillBeSent": { - const { requestId } = params as { - requestId?: string; - }; - if (requestId === undefined) { - throw new Error("requestId is undefined"); - } - - NetworkRequestManager.addRequest(requestId); - break; } default: diff --git a/src/background/backgroundHelpers.ts b/src/background/backgroundHelpers.ts new file mode 100644 index 00000000..286d12b8 --- /dev/null +++ b/src/background/backgroundHelpers.ts @@ -0,0 +1,27 @@ +import { IBytesRepository } from "../data/bytes/IBytesRepository"; + +export const addBytesTransferred = async (bytes: number) => { + IBytesRepository.instance.addBytesTransferred(bytes); + + try { + await chrome.runtime.sendMessage({ + command: { + bytesTransferredChanged: + IBytesRepository.instance.getBytesTransferred(), + }, + }); + } catch (e: unknown) { + if (e instanceof Error) { + if ( + e.message === + "Could not establish connection. Receiving end does not exist." + ) { + console.log( + `Error Caught: ${e}\nIf popup is open and this error is seen in the console, debugging is required.` + ); + } + } else { + throw e; + } + } +}; diff --git a/src/background/getWebRequestSizeHelpers.ts b/src/background/getWebRequestSizeHelpers.ts deleted file mode 100644 index 6aaf15a9..00000000 --- a/src/background/getWebRequestSizeHelpers.ts +++ /dev/null @@ -1,48 +0,0 @@ -export const getRequestHeaderSize = ( - details: chrome.webRequest.WebRequestHeadersDetails -): number => { - return ( - details.requestHeaders?.reduce((acc, header) => { - const encoder = new TextEncoder(); - const headerLength = encoder.encode( - header.name + ": " + (header.value ?? "") - ).length; - return acc + headerLength; - }, 0) ?? 0 - ); -}; - -export const getBodySize = ( - details: chrome.webRequest.WebRequestBodyDetails -): number => { - return details.requestBody?.raw?.[0].bytes?.byteLength ?? 0; -}; - -export const getBodySizeFromContentLengthHeader = ( - details: chrome.webRequest.WebResponseHeadersDetails -): number => { - const contentLengthHeader = details.responseHeaders?.find( - (header) => header.name.toLowerCase() === "content-length" - ); - - const bodySize = - contentLengthHeader?.value !== undefined - ? parseInt(contentLengthHeader.value, 10) - : 0; - - return bodySize; -}; - -export const getResponseHeaderSize = ( - details: chrome.webRequest.WebResponseHeadersDetails -): number => { - return ( - details.responseHeaders?.reduce((acc, header) => { - const encoder = new TextEncoder(); - const headerLength = encoder.encode( - header.name + ": " + (header.value ?? "") - ).length; - return acc + headerLength; - }, 0) ?? 0 - ); -}; diff --git a/src/background/network_request_manager/NetworkRequestManager.ts b/src/background/network_request_manager/NetworkRequestManager.ts deleted file mode 100644 index e8e5afb7..00000000 --- a/src/background/network_request_manager/NetworkRequestManager.ts +++ /dev/null @@ -1,55 +0,0 @@ -export abstract class NetworkRequestManager { - private static networkRequests: Map = new Map< - string, - number - >(); - - static clearNetworkRequests(): void { - NetworkRequestManager.networkRequests = new Map(); - } - - static getTransferredBytes(): number { - let bytesTransferred = 0; - NetworkRequestManager.networkRequests.forEach((value) => { - if (value > 0) { - bytesTransferred += value; - } - }); - return bytesTransferred; - } - - static addRequest(requestId: string): void { - if (NetworkRequestManager.networkRequests.has(requestId)) { - NetworkRequestManager.networkRequests.set(requestId, 0); - return; - } - NetworkRequestManager.networkRequests.set(requestId, 0); - } - - static setRequestTransferSize( - requestId: string, - encodedDataLength: number - ): void { - NetworkRequestManager.networkRequests.set(requestId, encodedDataLength); - } - - static increaseRequestTransferSize( - requestId: string, - encodedDataLength: number - ): void { - if (!NetworkRequestManager.networkRequests.has(requestId)) { - throw new Error("Request not found"); - } - - const previous = NetworkRequestManager.networkRequests.get(requestId); - - if (previous === undefined) { - throw new Error("Request not found"); - } - - NetworkRequestManager.networkRequests.set( - requestId, - previous + encodedDataLength - ); - } -} diff --git a/src/background/webRequestListeners.ts b/src/background/webRequestListeners.ts deleted file mode 100644 index 3f9111d8..00000000 --- a/src/background/webRequestListeners.ts +++ /dev/null @@ -1,65 +0,0 @@ -import { IBytesRepository } from "../data/bytes/IBytesRepository"; -import { - getBodySize, - getBodySizeFromContentLengthHeader, - getRequestHeaderSize, - getResponseHeaderSize, -} from "./getWebRequestSizeHelpers"; - -export const addBytesTransferred = async (bytes: number) => { - IBytesRepository.instance.addBytesTransferred(bytes); - - try { - await chrome.runtime.sendMessage({ - command: { - bytesTransferredChanged: - IBytesRepository.instance.getBytesTransferred(), - }, - }); - } catch (e: unknown) { - if (e instanceof Error) { - if ( - e.message === - "Could not establish connection. Receiving end does not exist." - ) { - console.log( - `Error Caught: ${e}\nIf popup is open and this error is seen in the console, debugging is required.` - ); - } - } else { - throw e; - } - } -}; - -export const catchResponseSize = ( - details: chrome.webRequest.WebResponseCacheDetails -) => { - const headerSize = getResponseHeaderSize(details); - - const bodySize = getBodySizeFromContentLengthHeader(details); - - addBytesTransferred(headerSize + bodySize); -}; - -export const catchPostRequestBodySize = ( - details: chrome.webRequest.WebRequestBodyDetails -) => { - if (details.method === "POST") { - const bodySize = getBodySize(details); - - if (bodySize > 0) { - addBytesTransferred(bodySize); - } - } -}; - -export const catchRequestHeaderSize = ( - details: chrome.webRequest.WebRequestHeadersDetails -) => { - const headerSize = getRequestHeaderSize(details); - - if (headerSize > 0) { - addBytesTransferred(headerSize); - } -}; From 7de7b2d862a7d77522d581fc3f86709d14809d32 Mon Sep 17 00:00:00 2001 From: Justin <57725347+juskek@users.noreply.github.com> Date: Fri, 21 Jul 2023 09:41:48 +0100 Subject: [PATCH 5/9] fix(chrome.debugger): Error: Debugger is not attached to the tab with id: 1812797494. --- src/background/background.ts | 21 +++++++++++++++++---- src/background/backgroundHelpers.ts | 2 +- 2 files changed, 18 insertions(+), 5 deletions(-) diff --git a/src/background/background.ts b/src/background/background.ts index 7046fd0f..f2af8ec3 100644 --- a/src/background/background.ts +++ b/src/background/background.ts @@ -1,7 +1,7 @@ import { IBytesRepository } from "../data/bytes/IBytesRepository"; import { addBytesTransferred } from "./backgroundHelpers"; -chrome.runtime.onMessage.addListener((message, sender, sendResponse) => { +chrome.runtime.onMessage.addListener(async (message, sender, sendResponse) => { if (message === "getBytesTransferred") { sendResponse(IBytesRepository.instance.getBytesTransferred()); } @@ -11,12 +11,12 @@ chrome.runtime.onMessage.addListener((message, sender, sendResponse) => { if (message.command === "startRecordingBytesTransferred") { IBytesRepository.instance.clearBytesTransferred(); - chrome.debugger.attach({ tabId: tabId }, "1.2", function () { + chrome.debugger.attach({ tabId: tabId }, "1.2", () => { chrome.debugger.sendCommand( { tabId: tabId }, "Network.enable", {}, - function () { + () => { if (chrome.runtime.lastError) { console.error(chrome.runtime.lastError); } @@ -28,7 +28,20 @@ chrome.runtime.onMessage.addListener((message, sender, sendResponse) => { } if (message.command === "stopRecordingBytesTransferred") { - chrome.debugger.detach({ tabId: tabId }); + try { + await chrome.debugger.detach({ tabId: tabId }); + } catch (e: unknown) { + if (e instanceof Error) { + if ( + e.message === + `Debugger is not attached to the tab with id: ${tabId}.` + ) { + console.warn( + `Tried to detach debugger from tab (tabId: ${tabId}) when there was none attached. This is expected when a calculation starts, but should not be expected when a calculation is stopped.` + ); + } + } + } sendResponse(true); } return true; diff --git a/src/background/backgroundHelpers.ts b/src/background/backgroundHelpers.ts index 286d12b8..9d9bb32b 100644 --- a/src/background/backgroundHelpers.ts +++ b/src/background/backgroundHelpers.ts @@ -16,7 +16,7 @@ export const addBytesTransferred = async (bytes: number) => { e.message === "Could not establish connection. Receiving end does not exist." ) { - console.log( + console.warn( `Error Caught: ${e}\nIf popup is open and this error is seen in the console, debugging is required.` ); } From 315e91f2be81f9651fa770e98e3f6f2ad6b26f47 Mon Sep 17 00:00:00 2001 From: Justin <57725347+juskek@users.noreply.github.com> Date: Fri, 21 Jul 2023 10:22:19 +0100 Subject: [PATCH 6/9] Removed chrome.webRequest permissions --- public/manifest.json | 1 - 1 file changed, 1 deletion(-) diff --git a/public/manifest.json b/public/manifest.json index 97846170..9ed77517 100644 --- a/public/manifest.json +++ b/public/manifest.json @@ -7,7 +7,6 @@ "default_popup": "popup.html" }, "permissions": [ - "webRequest", "tabs", "storage", "debugger" From 75dc4e10f5c0134977ed3db74f2d2f19725ffe59 Mon Sep 17 00:00:00 2001 From: Justin <57725347+juskek@users.noreply.github.com> Date: Fri, 21 Jul 2023 11:01:40 +0100 Subject: [PATCH 7/9] refactor:Added typing --- src/background/background.ts | 27 +++++++++++++++------------ 1 file changed, 15 insertions(+), 12 deletions(-) diff --git a/src/background/background.ts b/src/background/background.ts index f2af8ec3..6f22d429 100644 --- a/src/background/background.ts +++ b/src/background/background.ts @@ -47,18 +47,21 @@ chrome.runtime.onMessage.addListener(async (message, sender, sendResponse) => { return true; }); -chrome.debugger.onEvent.addListener(function (source, method, params) { - switch (method) { - case "Network.loadingFinished": { - const { encodedDataLength } = params as { - encodedDataLength?: number; - }; - if (encodedDataLength) { - addBytesTransferred(encodedDataLength); +type NetworkParamsType = { + encodedDataLength?: number; +}; + +chrome.debugger.onEvent.addListener( + (source, method: string, params: NetworkParamsType | undefined) => { + switch (method) { + case "Network.loadingFinished": { + if (params?.encodedDataLength && params.encodedDataLength > 0) { + addBytesTransferred(params.encodedDataLength); + } + break; } - break; + default: + break; } - default: - break; } -}); +); From 2d42293c729f63dce9c0b4930b797343621a7087 Mon Sep 17 00:00:00 2001 From: Justin <57725347+juskek@users.noreply.github.com> Date: Fri, 21 Jul 2023 11:59:30 +0100 Subject: [PATCH 8/9] fix: stop throwing error "Debugger is not attached" when calculation starts --- src/background/background.ts | 5 ++++- src/view/popup/usePopup.ts | 1 - 2 files changed, 4 insertions(+), 2 deletions(-) diff --git a/src/background/background.ts b/src/background/background.ts index 6f22d429..c16f7948 100644 --- a/src/background/background.ts +++ b/src/background/background.ts @@ -37,10 +37,13 @@ chrome.runtime.onMessage.addListener(async (message, sender, sendResponse) => { `Debugger is not attached to the tab with id: ${tabId}.` ) { console.warn( - `Tried to detach debugger from tab (tabId: ${tabId}) when there was none attached. This is expected when a calculation starts, but should not be expected when a calculation is stopped.` + `Tried to detach debugger from tab (tabId: ${tabId}) when there was none attached. ` ); + return; } + throw e; } + throw e; } sendResponse(true); } diff --git a/src/view/popup/usePopup.ts b/src/view/popup/usePopup.ts index b65d436c..6817eb63 100644 --- a/src/view/popup/usePopup.ts +++ b/src/view/popup/usePopup.ts @@ -83,7 +83,6 @@ export const usePopup = () => { } try { await calculationsRepository.setOngoingCalculation(true); - backgroundStopRecordingBytes(); } catch (e: unknown) { if (e instanceof Error) { setError(e.message); From 69b6924f2e32a091ec79c82602adcdd4c92c9320 Mon Sep 17 00:00:00 2001 From: Justin <57725347+juskek@users.noreply.github.com> Date: Fri, 21 Jul 2023 12:58:18 +0100 Subject: [PATCH 9/9] refactor: type cast error instead of conditional check --- src/background/background.ts | 19 ++++++++----------- src/background/backgroundHelpers.ts | 16 +++++++--------- 2 files changed, 15 insertions(+), 20 deletions(-) diff --git a/src/background/background.ts b/src/background/background.ts index c16f7948..e15dd822 100644 --- a/src/background/background.ts +++ b/src/background/background.ts @@ -31,17 +31,14 @@ chrome.runtime.onMessage.addListener(async (message, sender, sendResponse) => { try { await chrome.debugger.detach({ tabId: tabId }); } catch (e: unknown) { - if (e instanceof Error) { - if ( - e.message === - `Debugger is not attached to the tab with id: ${tabId}.` - ) { - console.warn( - `Tried to detach debugger from tab (tabId: ${tabId}) when there was none attached. ` - ); - return; - } - throw e; + if ( + (e as Error).message === + `Debugger is not attached to the tab with id: ${tabId}.` + ) { + console.warn( + `Tried to detach debugger from tab (tabId: ${tabId}) when there was none attached. ` + ); + return; } throw e; } diff --git a/src/background/backgroundHelpers.ts b/src/background/backgroundHelpers.ts index 9d9bb32b..7061dcae 100644 --- a/src/background/backgroundHelpers.ts +++ b/src/background/backgroundHelpers.ts @@ -11,15 +11,13 @@ export const addBytesTransferred = async (bytes: number) => { }, }); } catch (e: unknown) { - if (e instanceof Error) { - if ( - e.message === - "Could not establish connection. Receiving end does not exist." - ) { - console.warn( - `Error Caught: ${e}\nIf popup is open and this error is seen in the console, debugging is required.` - ); - } + if ( + (e as Error).message === + "Could not establish connection. Receiving end does not exist." + ) { + console.warn( + `Error Caught: ${e}\nIf popup is open and this error is seen in the console, debugging is required.` + ); } else { throw e; }