Issue with Dart Content Script in Firefox Extension: browser and chrome Undefined

[mrtnetwork]

Hello everyone,

I'm currently working on a browser extension using Flutter and have run into an issue with Firefox. When I build my Dart file for the content script, both the browser and chrome objects are undefined in the content script. However, when I load a simple JavaScript file as the content script, these objects are available as expected.

Interestingly, the same setup works perfectly in Chrome—both the Dart content script and the JavaScript content script can access the chrome object without any issues.

Has anyone else encountered this problem, or does anyone have any suggestions for resolving it? Any help would be greatly appreciated!

Thanks in advance!

@JS()
extension type Chrome._(JSObject _) implements ChromeAPI {
  external factory Chrome();
}

@JS("chrome")
external Chrome? get chrome;

@JS("browser")
external Browser? get browser;

compile

  const String command = 'dart';
  final List<String> arguments = [
    'compile',
    'js',
    "--no-source-maps",
    // '-m',
    '-o',
    'mozila/content.js',
    'js/extention_content.dart'
  ];
  final process = await Process.start(command, arguments);

doctor -v

 Flutter (Channel stable, 3.24.0, on macOS 14.5 23F79 darwin-x64, locale en-US)
    • Flutter version 3.24.0 on channel stable at /Users/macbookpro/Documents/flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 80c2e84975 (2 weeks ago), 2024-07-30 23:06:49 +0700
    • Engine revision b8800d88be
    • Dart version 3.5.0
    • DevTools version 2.37.2

[dart-github-bot]

Summary: The user is experiencing an issue where the chrome and browser objects are undefined in a Dart content script running in a Firefox extension, while the same code works in Chrome. The user has confirmed that a simple JavaScript content script can access these objects in Firefox.

[mrtnetwork]

something like this in js code solved my problem

 main() {
      if(self.browser === undefined){
        self.browser = browser
      }
      .....
}

[srujzs]

Maybe this is a question of privilege and content scripts can access the API while the compiled Dart code can not?