          > Hi. I researched about the problem of the popup closing when the file selector window is opened. I found out that it has been a major bug in firefox and hasn't been resolved so far. [Link to the issue](https://bugzilla.mozilla.org/show_bug.cgi?id=1292701)

One workaround is to open the extension in sidebar instead of in popup. bitwarden/clients#3013 (comment)

Hey! Thanks for your time and research.

Yes, this is a typical behavior in Firefox, and it happens because the browser treats the opening of a file selector dialog as a focus shift away from the popup, thus closing the popup.

Instead of opening the extension in sidebar, we can:

1.

To resolve this, we have to keep the popup open even after the file selector is opened. Here's a suggested approach to mitigate this problem:

Background Script: Use a background script to handle the file uploading process. This will prevent the popup from being dismissed as the background script is not tied to the popup UI.
Message Passing: We'll need to use message passing between our popup script and the background script to facilitate this process.

background.js:

chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
  if (request.action === 'uploadFile') {
    // Call the upload function here. For example:
    // uploadToIPFS(request.file);
    // Then send a response back to the popup script.
    sendResponse({success: true, message: 'File uploaded successfully'});
  }
});

web3Storage.js (formerly qrcode.js): Instead of directly initiating the upload in the popup script when a file is selected, send a message to the background script to handle the upload:

$("#fileUpload").on("change", async function() {
  var files = fileUpload.files;
  if (files.length === 0) return;

  // Send a message to the background script to handle the file upload.
  chrome.runtime.sendMessage({action: 'uploadFile', file: files[0]}, function(response) {
    if (response.success) {
      // Handle successful upload in the popup script.
      // For example: update the UI, show a success message, etc.
    } else {
      // Handle any errors or issues.
    }
  });
});

manifest.json:

  "background": {
    "scripts": ["background.js"],
    "persistent": false
  },

2.

Instead of directly initiating the file selection from the popup, consider creating a new tab or window from our popup and have the file selection take place there. This way, even if the popup closes, the user will have a dedicated window or tab where they can choose the file and proceed with the upload.

We can use the chrome.tabs.create() method to open a new tab. Once the file is selected and the QR code is generated, we can either display the information in the tab itself or send it back to the popup (if reopened) or even save it in chrome.storage.local temporarily for retrieval.

example:

document.getElementById("UPLOAD_BUTTON").addEventListener("click", function() {
  chrome.tabs.create({ url: chrome.runtime.getURL("file.html") });
});

manifest.json would be:

{
  "permissions": ["tabs", ...other permissions]
}

⚠️ In both of these cases we need a new firefox branch?

We can also check how other open source add-ons are dealing with this issue. I'm always open to any better suggestions.

Originally posted by @akhileshthite in https://github.com/p2plabsxyz/dscan/issues/42#issuecomment-1772718981

p2plabsxyz / dscan

> Hi. I researched about the problem of the popup closing when the file selector window is opened. I found out that it has been a major bug in firefox and hasn't been resolved so far. [Link to the issue](https://bugzilla.mozilla.org/show_bug.cgi?id=1292701) #47

1.

2.