1

When I try to run my flutter app on chrome, it crashes. It happens only after I installed Firebase_core and runs fine on Android or iOS. I am trying to connect my flutter web app, to the same Firebase Cloud, as my other app. I have follewed the instructions in the firebase console and added a new app. I tried adding a new web app, following the steps, and when that didn't work, I tried the same with adding a flutter app. (Here I talking about the firebase console).

I tried to initialize the app in my main file like this:

import "package:firebase_core/firebase_core.dart" as core;

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await core.Firebase.initializeApp(
    options: core.FirebaseOptions(
      apiKey: "apiKey", 
      appId: "appId", 
      messagingSenderId: "messagingSenderId", 
      projectId: " projectId"
    )
  );
  runApp(const MyApp());
}

And in my html I added this script to the body:

 <script type="module">
    // Import the functions you need from the SDKs you need
    import { initializeApp } from "firebase/app";
    import { getAnalytics } from "firebase/analytics";
    // TODO: Add SDKs for Firebase products that you want to use
    // https://firebase.google.com/docs/web/setup#available-libraries

    // Your web app's Firebase configuration
    // For Firebase JS SDK v7.20.0 and later, measurementId is optional
    const firebaseConfig = {
      apiKey: "my apikey",
      authDomain: "my authDomain",
      databaseURL: "databaseURL",
      projectId: "projectId",
      storageBucket: "storageBucket",
      messagingSenderId: "messagingSenderId",
      appId: "appId",
      measurementId: "measurementId"
    };

    // Initialize Firebase
    const app = initializeApp(firebaseConfig);
    const analytics = getAnalytics(app);
  </script>

My pubspec.yaml is very simple:

dependencies:
  flutter:
    sdk: flutter


  # The following adds the Cupertino Icons font to your application.
  # Use with the CupertinoIcons class for iOS style icons.
  cupertino_icons: ^1.0.2
  firebase_core: ^2.1.1

The error I am getting:

../../../flutter/.pub-cache/hosted/pub.dartlang.org/firebase_core_web-2.0.1/lib/firebase_core_web.dart:46:15: Error: Method not found:
'getProperty'.
  if (js_util.getProperty(e, 'name') == 'FirebaseError') {
              ^^^^^^^^^^^
../../../flutter/.pub-cache/hosted/pub.dartlang.org/firebase_core_web-2.0.1/lib/firebase_core_web.dart:47:20: Error: Method not found:
'getProperty'.
    return js_util.getProperty(e, 'code') ?? '';
                   ^^^^^^^^^^^
../../../flutter/.pub-cache/hosted/pub.dartlang.org/firebase_core_web-2.0.1/lib/firebase_core_web.dart:59:15: Error: Method not found:
'getProperty'.
  if (js_util.getProperty(e, 'name') == 'FirebaseError') {
              ^^^^^^^^^^^
../../../flutter/.pub-cache/hosted/pub.dartlang.org/firebase_core_web-2.0.1/lib/firebase_core_web.dart:60:30: Error: Method not found:
'getProperty'.
    String rawCode = js_util.getProperty(e, 'code');
                             ^^^^^^^^^^^
../../../flutter/.pub-cache/hosted/pub.dartlang.org/firebase_core_web-2.0.1/lib/firebase_core_web.dart:62:30: Error: Method not found:
'getProperty'.
    String message = js_util.getProperty(e, 'message') ?? '';
                             ^^^^^^^^^^^
../../../flutter/packages/flutter_web_plugins/lib/src/navigation/js_url_strategy.dart:48:14: Error: Method not found: 'allowInterop'.
    getPath: allowInterop(strategy.getPath),
             ^^^^^^^^^^^^
../../../flutter/packages/flutter_web_plugins/lib/src/navigation/js_url_strategy.dart:49:15: Error: Method not found: 'allowInterop'.
    getState: allowInterop(strategy.getState),
              ^^^^^^^^^^^^
../../../flutter/packages/flutter_web_plugins/lib/src/navigation/js_url_strategy.dart:50:26: Error: Method not found: 'allowInterop'.
    addPopStateListener: allowInterop(strategy.addPopStateListener),
                         ^^^^^^^^^^^^
../../../flutter/packages/flutter_web_plugins/lib/src/navigation/js_url_strategy.dart:51:25: Error: Method not found: 'allowInterop'.
    prepareExternalUrl: allowInterop(strategy.prepareExternalUrl),
                        ^^^^^^^^^^^^
../../../flutter/packages/flutter_web_plugins/lib/src/navigation/js_url_strategy.dart:52:16: Error: Method not found: 'allowInterop'.
    pushState: allowInterop(strategy.pushState),
               ^^^^^^^^^^^^
../../../flutter/packages/flutter_web_plugins/lib/src/navigation/js_url_strategy.dart:53:19: Error: Method not found: 'allowInterop'.
    replaceState: allowInterop(strategy.replaceState),
                  ^^^^^^^^^^^^
../../../flutter/packages/flutter_web_plugins/lib/src/navigation/js_url_strategy.dart:54:9: Error: Method not found: 'allowInterop'.
    go: allowInterop(strategy.go),
        ^^^^^^^^^^^^
../../../flutter/.pub-cache/hosted/pub.dartlang.org/firebase_core_web-2.0.1/lib/src/interop/utils/js_interop.dart:25:12: Error: Method not
found: 'hasProperty'.
  if (util.hasProperty(jsObject, 'toDateString')) {
           ^^^^^^^^^^^
../../../flutter/.pub-cache/hosted/pub.dartlang.org/firebase_core_web-2.0.1/lib/src/interop/utils/utils.dart:45:31: Error: Method not found:
'getProperty'.
      map[key] = dartify(util.getProperty(jsObject, key), customDartify);
                              ^^^^^^^^^^^
../../../flutter/.pub-cache/hosted/pub.dartlang.org/firebase_core_web-2.0.1/lib/src/interop/utils/utils.dart:81:22: Error: Method not found:
'newObject'.
    var jsMap = util.newObject();
                     ^^^^^^^^^
../../../flutter/.pub-cache/hosted/pub.dartlang.org/firebase_core_web-2.0.1/lib/src/interop/utils/utils.dart:83:12: Error: Method not found:
'setProperty'.
      util.setProperty(jsMap, key, jsify(value, customJsify));
           ^^^^^^^^^^^
../../../flutter/.pub-cache/hosted/pub.dartlang.org/firebase_core_web-2.0.1/lib/src/interop/utils/utils.dart:89:12: Error: Method not found:
'allowInterop'.
    return allowInterop(dartObject);
           ^^^^^^^^^^^^
../../../flutter/.pub-cache/hosted/pub.dartlang.org/firebase_core_web-2.0.1/lib/src/interop/utils/utils.dart:103:10: Error: Method not found:
'callMethod'.
    util.callMethod(jsObject, method, args);
         ^^^^^^^^^^
../../../flutter/.pub-cache/hosted/pub.dartlang.org/firebase_core_web-2.0.1/lib/src/interop/utils/utils.dart:116:15: Error: Method not found:
'promiseToFuture'.
  return util.promiseToFuture(thenable);
              ^^^^^^^^^^^^^^^
../../../flutter/.pub-cache/hosted/pub.dartlang.org/firebase_core_web-2.0.1/lib/src/interop/utils/utils.dart:124:27: Error: Method not found:
'allowInterop'.
  return PromiseJsImpl<S>(allowInterop((

I have tried to find and follow various tutorial on how to add firebase to a Flutter web app. Non of them helped me, since the problem seems to come from the firebase_core package. I have tried to add the firebase_core_web package. I also downgraded various firebase packages and tried with diffrent combinations based on what recommendations I could find online. I always got the same error.

I have upgraded flutter to the newest version.

The error can be simply recreated by creating af new flutter project, and install firebase_core. If you then run the app on chrome, the error will show up in the terminal. At least, that is what happens to me ...

!!! SOLVED !!!

I solved the problem with simply repairing the pub-cache folder using the " flutter pub cache repair " command. Hallelujah !

Timmophe
  • 11
  • 2

0 Answers0