Jonghakseo / chrome-extension-boilerplate-react-vite

Chrome Extension Boilerplate with React + Vite + Typescript

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Can't load content scripts in FireFox

moritzstingl65 opened this issue · comments

Describe the bug
In FireFox content and content-ui cant be loaded

To Reproduce
Steps to reproduce the behavior:

  1. run pnpm dev:firefox
  2. Open about:debugging#/runtime/this-firefox and Load the temporary Add-on
  3. Go to any website and give the extension permission to read and change data
  4. Open console and see errors (see screenshot)

Expected behavior
The content scripts should load

Screenshots
content_scripts_errors

Desktop:

  • OS: Windows 11
  • Browser: FireFox
  • Node Version 20.12.2

Thank you for your contribution. We will check and reply to you as soon as possible.

That's something with messaging i think so.

I spend 2 hours and i still can't solve it.

But here's link to stack:
https://stackoverflow.com/questions/9515704/access-variables-and-functions-defined-in-page-context-from-an-extension/9517879#9517879

Maybe you will find solution

First of all, we're need to localize which line is problematic

Needed to replace in manifest.js to make it work

 content_scripts: [
      {
        matches: ['http://*/*', 'https://*/*', '<all_urls>'],
        js: ['content/index.iife_dev.js'],
      },
      {
        matches: ['http://*/*', 'https://*/*', '<all_urls>'],
        js: ['content-ui/index.iife_dev.js'],
      },
      {
        matches: ['http://*/*', 'https://*/*', '<all_urls>'],
        css: ['content.css'], // public folder
      },
    ],

@govza

i have that with your approach
image

Other errors, but still xD

Overall the .dev file was imported by index.iife.js
image

The problem is located in other place IMO

I'm gonna reproduce in my local env.