Im developing a chrome extension (developer tool) and injection some code directly in the website:
(function (send) {
XMLHttpRequest.prototype.send = function (method, url, async) {
send.call(this, method, url, false);
document.dispatchEvent(new CustomEvent('data', {
detail: {
data_1: 'hello world'
}
}));
};
})(XMLHttpRequest.prototype.send);
This code listens for GET requests from the websites and then sends a message (through the content script) to my message script. The problem is that the messages pile up. So on the first request I get 1 message, on the second I get 2 messages resulting in 3 messages total, then 6 and so on. Why does it pile up that way?
The message goes through the "content" script:
document.addEventListener('data_2', function(e) {
sendObjectToDevTools({data_3: e.detail.data_1 });
});
And then finally received by "message" script:
port.onMessage.addListener(function(message) {
...
if (message.data_3) {
//do stuff
...
PS. This is not an iframe problem or scripts being loaded more than once.