[cloud_firestore, cloud_firestore_web] Update Firestore web documenta…

…tion. (firebase#1982) * [flutterfire] Mark cloud_firestore and cloud_functions as available for Web in the main feature matrix. * [cloud_firestore] Add Web integration instructions to README. * [cloud_firestore_web] Add post-endorsement web integration instructions.
DEVSOG12 · Feb 11, 2020 · 424b5d0 · 424b5d0
1 parent 1d55c96
commit 424b5d0
Show file tree

Hide file tree

Showing 7 changed files with 77 additions and 29 deletions.
diff --git a/README.md b/README.md
@@ -14,8 +14,8 @@ that enable Flutter apps to use [Firebase](https://firebase.google.com/) service
 
 | Plugin | Version | Firebase feature | Source code | Web? |
 |---|---|---|---|---|
-| [cloud_firestore][firestore_pub] | ![pub package][firestore_badge] | [Cloud Firestore][firestore_product] | [`cloud_firestore`][firestore_code] | |
-| [cloud_functions][functions_pub] | ![pub package][functions_badge] | [Cloud Functions][functions_product] | [`cloud_functions`][functions_code] | |
+| [cloud_firestore][firestore_pub] | ![pub package][firestore_badge] | [Cloud Firestore][firestore_product] | [`cloud_firestore`][firestore_code] | <img src="https://user-images.githubusercontent.com/394889/70172910-9174c880-1686-11ea-8e2e-3d8c1cc78cce.png" alt="hummingbird" width="25"> |
+| [cloud_functions][functions_pub] | ![pub package][functions_badge] | [Cloud Functions][functions_product] | [`cloud_functions`][functions_code] | <img src="https://user-images.githubusercontent.com/394889/70172910-9174c880-1686-11ea-8e2e-3d8c1cc78cce.png" alt="hummingbird" width="25"> |
 | [firebase_admob][admob_pub] | ![pub package][admob_badge] | [Firebase AdMob][admob_product] | [`firebase_admob`][admob_code] | |
 | [firebase_analytics][analytics_pub] | ![pub package][analytics_badge] | [Firebase Analytics][analytics_product] | [`firebase_analytics`][analytics_code] | |
 | [firebase_auth][auth_pub] | ![pub package][auth_badge] | [Firebase Authentication][auth_product] | [`firebase_auth`][auth_code] | <img src="https://user-images.githubusercontent.com/394889/70172910-9174c880-1686-11ea-8e2e-3d8c1cc78cce.png" alt="hummingbird" width="25"> |

diff --git a/packages/cloud_firestore/cloud_firestore/CHANGELOG.md b/packages/cloud_firestore/cloud_firestore/CHANGELOG.md
@@ -1,3 +1,7 @@
+## 0.13.2+1
+
+* Add Web integration documentation to README.
+
 ## 0.13.2
 
 * Add web support by default.

diff --git a/packages/cloud_firestore/cloud_firestore/README.md b/packages/cloud_firestore/cloud_firestore/README.md
@@ -10,16 +10,28 @@ For Flutter plugins for other Firebase products, see [README.md](https://github.
 
 To use this plugin:
 
-1. Using the [Firebase Console](http://console.firebase.google.com/), add an Android app to your project:
-Follow the assistant, download the generated google-services.json file and place it inside android/app. Next,
-modify the android/build.gradle file and the android/app/build.gradle file to add the Google services plugin
-as described by the Firebase assistant. Ensure that your `android/build.gradle` file contains the
+1. Add `cloud_firestore` as a [dependency in your pubspec.yaml file](https://flutter.dev/docs/development/packages-and-plugins/using-packages).
+
+### Android
+
+1. Using the [Firebase Console](http://console.firebase.google.com/), add an Android app to your project.
+2. Follow the assistant, and download the generated `google-services.json` file and place it inside `android/app`.
+3. Modify the `android/build.gradle` file and the `android/app/build.gradle` file to add the Google services plugin as described by the Firebase assistant. Ensure that your `android/build.gradle` file contains the
 `maven.google.com` as [described here](https://firebase.google.com/docs/android/setup#add_the_sdk).
-1. Using the [Firebase Console](http://console.firebase.google.com/), add an iOS app to your project:
-Follow the assistant, download the generated GoogleService-Info.plist file, open ios/Runner.xcworkspace
-with Xcode, and within Xcode place the file inside ios/Runner. Don't follow the steps named
-"Add Firebase SDK" and "Add initialization code" in the Firebase assistant.
-1. Add `cloud_firestore` as a [dependency in your pubspec.yaml file](https://flutter.io/platform-plugins/).
+
+### iOS
+
+1. Using the [Firebase Console](http://console.firebase.google.com/), add an iOS app to your project.
+2. Follow the assistant, download the generated `GoogleService-Info.plist` file. Do **NOT** follow the steps named _"Add Firebase SDK"_ and _"Add initialization code"_ in the Firebase assistant.
+3. Open `ios/Runner.xcworkspace` with Xcode, and **within Xcode** place the `GoogleService-Info.plist` file inside `ios/Runner`.
+
+### Web
+
+In addition to the `cloud_firestore` dependency, you'll need to modify the `web/index.html` of your app following the Firebase setup instructions:
+
+* [Add Firebase to your JavaScript project](https://firebase.google.com/docs/web/setup#from-the-cdn).
+
+Read more in the [`cloud_firestore_web` README](https://github.com/FirebaseExtended/flutterfire/blob/master/packages/cloud_firestore/cloud_firestore_web/README.md).
 
 ## Usage
 

diff --git a/packages/cloud_firestore/cloud_firestore/pubspec.yaml b/packages/cloud_firestore/cloud_firestore/pubspec.yaml
@@ -3,7 +3,7 @@ description:
   Flutter plugin for Cloud Firestore, a cloud-hosted, noSQL database with
   live synchronization and offline support on Android and iOS.
 homepage: https://github.com/FirebaseExtended/flutterfire/tree/master/packages/cloud_firestore/cloud_firestore
-version: 0.13.2
+version: 0.13.2+1
 
 flutter:
   plugin:

diff --git a/packages/cloud_firestore/cloud_firestore_web/CHANGELOG.md b/packages/cloud_firestore/cloud_firestore_web/CHANGELOG.md
@@ -1,3 +1,7 @@
+## 0.1.0+2
+
+- Update documentation about this package being the endorsed platform for web.
+
 ## 0.1.0+1
 
 - Fix `fileName` prop in pubspec.yaml

diff --git a/packages/cloud_firestore/cloud_firestore_web/README.md b/packages/cloud_firestore/cloud_firestore_web/README.md
@@ -6,47 +6,75 @@ The web implementation of [`cloud_firestore`][1].
 
 ### Import the package
 
-To use this plugin in your Flutter app on the web, simply add it as a
-dependency in your `pubspec.yaml` alongside the base `cloud_firestore`
-plugin.
+This package is the endorsed implementation of `cloud_firestore` for the web platform since version `0.13.2`, so it gets automatically added to your application by depending on `cloud_firestore: ^0.13.2`.
 
-_(This is only temporary: in the future we hope to make this package
-an "endorsed" implementation of `cloud_firestore`, so it will automatically
-be included in your app when you run your Flutter app on the web.)_
-
-Add this to your `pubspec.yaml`:
+No further modifications to your `pubspec.yaml` should be required in a recent enough version of Flutter (`>=1.12.13+hotfix.4`):
 
 ```yaml
 ...
 dependencies:
   ...
-  cloud_firestore: ^0.13.1
-  cloud_firestore_web: ^0.1.0
+  cloud_firestore: ^0.13.2
   ...
 ```
 
-### Updating `index.html`
+### Update `index.html`
 
 Due to [this bug in dartdevc][2], you will need to manually add the Firebase
 JavaScript files to your `index.html` file.
 
-In your app directory, edit `web/index.html` to add the line:
+In your app directory, edit `web/index.html` to add the following:
 
 ```html
 <html>
     ...
     <body>
         <script src="https://www.gstatic.com/firebasejs/7.5.0/firebase-app.js"></script>
         <script src="https://www.gstatic.com/firebasejs/7.5.0/firebase-firestore.js"></script>
+        <!-- Other firebase SDKs/config here -->
         <script src="main.dart.js"></script>
     </body>
 </html>
 ```
 
-### Using the plugin
+### Initialize Firebase
+
+If your app is using the "default" Firebase app _(this means that you're not doing any `package:firebase_core` initialization yourself)_,
+you'll need to initialize it now, following the steps in the [Firebase Web Setup][3] docs.
+
+Specifically, you'll want to add the following lines to your `web/index.html` file:
+
+```html
+<body>
+  <!-- Previously loaded Firebase SDKs -->
+
+  <!-- ADD THIS BEFORE YOUR main.dart.js SCRIPT -->
+  <script>
+    // TODO: Replace the following with your app's Firebase project configuration.
+    // See: https://support.google.com/firebase/answer/7015592
+    var firebaseConfig = {
+      apiKey: "...",
+      authDomain: "[YOUR_PROJECT].firebaseapp.com",
+      databaseURL: "https://[YOUR_PROJECT].firebaseio.com",
+      projectId: "[YOUR_PROJECT]",
+      storageBucket: "[YOUR_PROJECT].appspot.com",
+      messagingSenderId: "...",
+      appId: "1:...:web:...",
+      measurementId: "G-..."
+    };
+    // Initialize Firebase
+    firebase.initializeApp(firebaseConfig);
+  </script>
+  <!-- END OF FIREBASE INIT CODE -->
+
+  <script src="main.dart.js"></script>
+</body>
+```
+
+### Use the plugin
 
-Once you have added the `cloud_firebase_web` dependency to your pubspec,
-you can use `package:cloud_firebase` as normal.
+Once you have modified your `web/index.html` file, you should be able to use `package:cloud_firestore` as normal. Refer to the [`cloud_firestore` documentation][1] for more details.
 
-[1]: ../cloud_firestore
+[1]: https://pub.dev/packages/cloud_firestore
 [2]: https://github.com/dart-lang/sdk/issues/33979
+[3]: https://firebase.google.com/docs/web/setup#add-sdks-initialize
diff --git a/packages/cloud_firestore/cloud_firestore_web/pubspec.yaml b/packages/cloud_firestore/cloud_firestore_web/pubspec.yaml
@@ -1,7 +1,7 @@
 name: cloud_firestore_web
 description: The web implementation of cloud_firestore
 homepage: https://github.com/FirebaseExtended/flutterfire/tree/master/packages/cloud_firestore/cloud_firestore_web
-version: 0.1.0+1
+version: 0.1.0+2
 
 flutter:
   plugin: