cloud_firestore: TypeError: Cannot read properties of undefined (reading 'getFirestore')

[Bakti17]

Is there an existing issue for this?

• [X] I have searched the existing issues.

Which plugins are affected?

Cloud Functions

Which platforms are affected?

Web

Description

I have some problem with the cloud_firestore plugin for flutter web. The error is TypeError: Cannot read properties of undefined (reading 'getFirestore'). This problem appears when i want to use get the data from firestore

Reproducing the issue

1. Using Flutter and web for the platform
2. add cloud_firestore plugin
3. configure firebase using steps on the firebase documentation for flutter
4. try to get some data from firebase firestore
5. and the error appears TypeError: Cannot read properties of undefined (reading 'getFirestore')

Firebase Core version

3.2.0

Flutter Version

3.22.3

Relevant Log Output

No response

Flutter dependencies

Expand Flutter dependencies snippet

version: 1.0.0+1

environment:
  sdk: '>=3.4.1 <4.0.0'

# Dependencies specify other packages that your package needs in order to work.
# To automatically upgrade your package dependencies to the latest versions
# consider running `flutter pub upgrade --major-versions`. Alternatively,
# dependencies can be manually updated by changing the version numbers below to
# the latest version available on pub.dev. To see which dependencies have newer
# versions available, run `flutter pub outdated`.
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.6
  flutter_screenutil: ^5.9.3
  firebase_auth: ^5.1.2
  firebase_core: ^3.2.0  
  reactive_forms: ^17.0.1
  one_context: ^4.0.0
  firebase_storage: ^12.1.1
  two_dimensional_scrollables: ^0.3.1
  riverpod: ^2.5.1
  riverpod_annotation: ^2.3.5
  freezed: ^2.5.2
  freezed_annotation: ^2.4.4
  cloud_firestore: ^5.2.0
  json_annotation: ^4.8.1  
  flutter_riverpod: ^2.5.1
  
dev_dependencies:
  flutter_test:
    sdk: flutter

  # The "flutter_lints" package below contains a set of recommended lints to
  # encourage good coding practices. The lint set provided by the package is
  # activated in the `analysis_options.yaml` file located at the root of your
  # package. See that file for information about deactivating specific lint
  # rules and activating additional ones.
  flutter_lints: ^4.0.0
  build_runner: ^2.4.11  
  riverpod_generator: ^2.3.9
  riverpod_lint: ^2.3.7
  custom_lint: ^0.6.2
  json_serializable: ^6.7.1

Additional context and comments

Main.dart

import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:firebase_auth/firebase_auth.dart';
import 'package:firebase_core/firebase_core.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:flutter_web_plugins/url_strategy.dart';
import 'package:one_context/one_context.dart';
import 'extras/helper/firestore.dart';
import 'firebase_options.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';

late FirebaseApp app;
late FirebaseFireStore db;

void main() async {
  WidgetsFlutterBinding.ensureInitialized();

  // initialize firebase app
  app = await Firebase.initializeApp(
      options: DefaultFirebaseOptions.currentPlatform);  

  // ensure screen size for screenutil
  await ScreenUtil.ensureScreenSize();

  // use path url for web app  
  usePathUrlStrategy();

  db = FirebaseFirestore.instanceFor(app: app);

  // run application
  runApp(const ProviderScope(child: MyApp()));
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    ScreenUtil.init(context);
    ScreenUtil.configure(designSize: const Size(1280, 720), minTextAdapt: true);
    return MediaQuery(
      data: MediaQuery.of(context)
          .copyWith(textScaler: const TextScaler.linear(1.0)),
      child: MaterialApp(
        debugShowCheckedModeBanner: false,
        title: 'Admin Layanan Surat Online',
        initialRoute:  RoutesPath.login,
        // initialRoute: '/home',
        routes: routes,
        builder: OneContext().builder,
        navigatorKey: OneContext().key,
      ),
    );
  }
}

Firestore function

Future getOnProgressLetters() async {
    print('getOnProgressLetters');
    String today = dateToMonthFormat(DateTime.now());
    QuerySnapshot letters;
    try {
    if (state.isEmpty) {
      print('empty state');      
      letters = await db
          .collection('letter')
          .where('letter_status', isEqualTo: LetterStatus.onProgress.name)          
          .get().catchError((err) => print(err));
      print('after get firestore');
      print(letters.toString());
    } else {
      letters = await db
          .collection('letter')
          .where('letter_status', isEqualTo: LetterStatus.onProgress.name)          
          .startAfterDocument(lastData!)
          .get();
    }
    print(letters);
    lastData = letters.docs.last;
    for (var data in letters.docs) {
      state.add(LetterModel.fromJson(data.data() as Map<String, Object?>));
    }
    inspect(state);
    } catch (e) {
      print(e);
    }
  }

my index.html

<!DOCTYPE html>
<html>
<head>
  <!--
    If you are serving your web app in a path other than the root, change the
    href value below to reflect the base path you are serving from.

    The path provided below has to start and end with a slash "/" in order for
    it to work correctly.

    For more details:
    * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/base

    This is a placeholder for base href that will be replaced by the value of
    the `--base-href` argument provided to `flutter build`.
  -->
  <base href="$FLUTTER_BASE_HREF">

  <meta charset="UTF-8">
  <meta content="IE=Edge" http-equiv="X-UA-Compatible">
  <meta name="description" content="A new Flutter project.">

  <!-- iOS meta tags & icons -->
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="black">
  <meta name="apple-mobile-web-app-title" content="admin_layanan_online">
  <link rel="apple-touch-icon" href="icons/Icon-192.png">

  <!-- Favicon -->
  <link rel="icon" type="image/png" href="favicon.png"/>h

  <title>admin_layanan_online</title>
  <link rel="manifest" href="manifest.json">
</head>
<body>
  <script src="flutter_bootstrap.js" async></script>
  <script>
    window.flutterfire_ignore_scripts = ['analytics', 'firestore'];
  </script>
</body>
</html>

[Lyokone]

Hello @Bakti17, I cannot reproduce this on my end. Can you share a complete sample reproducing this? Thanks

[samaralii]

I'm facing the same issue. My Flutter web app was working fine until I upgraded to the latest Flutter version and Firebase Firestore package.

Firebase Core version 3.3.0

Firebase Firestore version 5.2.1

Flutter Version 3.24.0

[Bakti17]

i don't know how to reproduce it again, i already try to make a new project using different firebase project and it not show any error like my previous firebase project. i only have this log error when using my previous firebase project

Exception has occurred.
TypeError: Cannot read properties of undefined (reading 'getFirestore')
packages/cloud_firestore_web/src/interop/firestore.dart 48:27                     getFirestoreInstance
packages/cloud_firestore_web/cloud_firestore_web.dart 38:48                       get [_delegate]
packages/cloud_firestore_web/cloud_firestore_web.dart 63:41                       collection
packages/cloud_firestore/src/firestore.dart 104:53                                collection

[Paroca72]

Same issue here after upgraded to 3.24 but the "reading" package name vary on time to time so i think is a Flutter issue.

[Lyokone]

Can you try to regenerate your web folder using the latest flutter version?

flutter create . --platforms web

[Paroca72]

First thing I did.. but without success. I already downgrade on version 3.22.x because I cannot find a quick solution and I cannot stuck with the project. With 3.22.x all work proper.

[RyanCarrier]

It SEEMS to work okay when building release, and if you refresh the page in debug (that is refresh in the browser, not in flutter).

[Paroca72]

As I supposed is a Flutter issue https://github.com/flutter/flutter/issues/153222

[spydon]

Should be fixed by https://github.com/flutter/flutter/issues/152953 I tried with main and the issue is indeed solved there!

[google-oss-bot]

Hey @Bakti17. We need more information to resolve this issue but there hasn't been an update in 7 weekdays. I'm marking the issue as stale and if there are no new updates in the next 7 days I will close it automatically.

If you have more information that will help us get to the bottom of this, just add a comment!

[google-oss-bot]

Since there haven't been any recent updates here, I am going to close this issue.

@Bakti17 if you're still experiencing this problem and want to continue the discussion just leave a comment here and we are happy to re-open this.