supermemory icon indicating copy to clipboard operation
supermemory copied to clipboard

firefox support

Open Dhravya opened this issue 10 months ago • 3 comments

Dhravya avatar Feb 18 '25 23:02 Dhravya

well, this is a bit annoying and not exactly sure what's the best way to fix this - The window.runtime.sendmessage that we use for twitter bookmark import seems to work for chrome but not for firefox?

Everything else works... maybe I'll ship this with a disclaimer that twitter bookmark import is not supported in the firefox version (which is unfortunate)

if anyone would like to help with a way to somehow make sure that the message makes its way to the extension (literally just need to run a function in the extension on a button click) feel free to send help

Dhravya avatar Feb 19 '25 03:02 Dhravya

Hey @Dhravya , I took a look at the Firefox issue with window.runtime.sendMessage . It’s cool to see Firefox support in progress, and I’d love to help figure this out so we can avoid shipping with a disclaimer if possible!

From what I understand, the problem is that window.runtime.sendMessage works fine in Chrome but doesn’t trigger the extension function in Firefox. This makes sense because Firefox’s WebExtensions API has some quirks compared to Chrome’s—even though they’re mostly compatible, the messaging APIs can behave differently due to how Firefox scopes runtime and handles content script/extension communication.

Here’s an approach we could use to solve this:

  1. Switch to a Cross-Browser Messaging Pattern
    Instead of relying solely on window.runtime.sendMessage (which seems to be injected into the page context), we can use window.postMessage from the content script (injected into the Twitter page) to send a message to the extension’s background script. Firefox nd Chrome both support this properly... and it’s a common workaround for cross-browser messaging.

  2. Implementation Steps

    • Content Script): we should modify the button click handler to send a message via window.postMessage. Something like:
      document.getElementById('import-button').addEventListener('click', () => {
        window.postMessage({ type: 'SUPERMEMORY_IMPORT', action: 'triggerImport' }, '*');
      });
      
    • Background Script (e.g., background.js): Listen for the message and trigger the import function:
      window.addEventListener('message', (event) => {
        if (event.data.type === 'SUPERMEMORY_IMPORT' && event.data.action === 'triggerImport') {
          // Call your existing import function here
          triggerTwitterImport(); // Replace with actual function name
        }
      });
      
    • Manifest Update: but we should also ensure that the.. content_scripts section in manifest.json includes the Twitter URL pattern (e.g., "matches": ["*://*.twitter.com/*"]) and that background.js is properly registered.
  3. Why This Works

    • window.postMessage is a standard DOM API, so it’s not tied to browser-specific extension quirks like runtime.sendMessage.
    • It keeps the communication simple: the content script just needs to notify the background script to run a function, which aligns with your goal.

I’m happy to dig into the codebase and submit a PR with this fix if you’re cool with the approach! Alternatively, if there’s a specific reason runtime.sendMessage is preferred (e.g., security or architecture), let me know, and we can tweak this. What do you think?

PS : it was great to meet you in person in Mumabi meetup !!

shwetd19 avatar Feb 22 '25 12:02 shwetd19

aaaa this seems like a lot of work, because right now all messaging is through the background script. We need to redirect the messages from client script -> background script.

On it.

Dhravya avatar Feb 28 '25 02:02 Dhravya