if tab switches before ajax call is complete, it effects other tabs. how can I prevent?

Question

I have 4 different tabs and each of them is making ajax request each time they are opened. But if I click one of them and its ajax request is not complete, newly opened tab is affected by old ajax request.

• One of them is opened(lets say first one)

• Before ajax request is returned, I click the second tab.

• Second tab makes ajax call

• The ajax call of first one is complete and it changes html content of first tab, and I open tabs content after ajax call is complete. So even if I am on the second tab, since ajax call of the first one is done late, it opens the first section. How can I prevent that? I want the ajax call of the old tabs dissappear, abort, not effecting etc.

I tried to add condition with boolean but it didnot work for me.

Answer 1

You could listen for browser.tabs.onActivated event and discard the old XMLHttpRequest Object and create a new one.

It's hard to discuss the details without seeing how you implemented the AJAX call.

https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API/tabs/onActivatedhttps://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest