null evaluated as undefined in release mode on web (Chrome browser)

[russellwheatley]

This tracker is for issues related to:

• dart2js

Environment

• Dart SDK Version (dart --version) - Dart SDK version: 2.18.1 (stable)
• Whether you are using Windows, MacOSX, or Linux (if applicable) - Using MacOSX
• Whether you are using Chrome, Safari, Firefox, Edge (if applicable) - Using Chrome

There is a bug with how a null value is being evaluated, it is coming through as undefined on the web when ran in release mode.

For context, here is the pull request on FlutterFire that has a simple code illustration of the bug in the description.

In a nutshell:

//`media.first` will have the value of `null` in Dart. When ran in release mode, it is being evaluated in JavaScript as `undefined` 
final List<String?> media = List<String?>.filled(1, null);

If you wish to see a demonstration. Follow these steps:

1. Clone FlutterFire repo
2. Run melos bootstrap within project so all packages are linked together.
3. From root of project, navigate to packages/cloud_firestore/cloud_firestore/example in your terminal.
4. Run flutter pub get
5. Paste the following code into packages/cloud_firestore/cloud_firestore/example/lib/main.dart:

import 'package:cloud_firestore_example/firebase_config.dart';
import 'package:flutter/material.dart';
import 'package:firebase_core/firebase_core.dart';
import 'package:cloud_firestore/cloud_firestore.dart';



Future<void> main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await Firebase.initializeApp(options: DefaultFirebaseConfig.platformOptions);

  runApp(FirestoreExampleApp());
}

class FirestoreExampleApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Bug Report',
      theme: ThemeData.dark(),
      home: Scaffold(
        body: Center(child: Column(children: [
          ElevatedButton(
            onPressed: () async {
              DocumentReference users = FirebaseFirestore.instance.collection('flutter-tests').doc('1');

              final List<String?> media = List<String?>.filled(1, null);

              // This will error even though `media.first` is a `null` object
              await users.set({'greatField2': media.first});
            },
            child: const Text('Press to see exception using `media.first`'),
          ),
          ElevatedButton(
            onPressed: () async {
              DocumentReference users = FirebaseFirestore.instance.collection('flutter-tests').doc('1');

              // This will not error when using explicit `null` value
              await users.set({'greatField2': null});

              //
            },
            child: const Text('Press to see no exception with explicit `null` value'),
          ),
        ],),),
      ),
    );
  }
}

6. From packages/cloud_firestore/cloud_firestore/example directory, run flutter run --no-pub -d chrome --release.
7. Open terminal in chrome to see the exception. The top button will throw exception, the bottom will not.
8. if you want to see the final value (null) before it goes to the interop layer for JavaScript, you can add some logging here. data will be the value that is passed into set() API.

I think I'm in the right place 😅, but let me know if it should be elsewhere or if you need any further information. Thanks.