Firebase v6 & dynamic imports (#577)

jamesdaniels · web-flow · commit a06dc6183547 · 2019-05-31T14:45:45.000+03:00
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -4,6 +4,7 @@ module.exports = {
       ecmaVersion: 2017,
       sourceType: 'module'
     },
+    parser: 'babel-eslint',
     plugins: [
       'ember'
     ],
diff --git a/.nvmrc b/.nvmrc
@@ -1 +1 @@
-8.12.0
+lts/*
diff --git a/README.md b/README.md
@@ -35,7 +35,7 @@ import FirestoreAdapter from 'emberfire/adapters/firestore';
 
 export default FirestoreAdapter.extend({
     enablePersistence: true,
-    persistenceSettings: { experimentalTabSynchronization: true }
+    persistenceSettings: { synchronizeTabs: true }
 });
 ```
 
diff --git a/addon/adapters/firestore.ts b/addon/adapters/firestore.ts
@@ -92,7 +92,7 @@ export default class FirestoreAdapter extends DS.Adapter.extend({
      *
      * export default FirestoreAdapter.extend({
      *   enablePersistence: true,
-     *   persistenceSettings: { experimentalTabSynchronization: true }
+     *   persistenceSettings: { synchronizeTabs: true }
      * });
      * ```
      * 
@@ -299,7 +299,7 @@ const getFirestore = (adapter: FirestoreAdapter) => {
         });
         set(adapter, 'firestore', cachedFirestoreInstance);
     }
-    return cachedFirestoreInstance;
+    return cachedFirestoreInstance!;
 };
 
 declare module 'ember-data' {
diff --git a/addon/adapters/realtime-database.ts b/addon/adapters/realtime-database.ts
@@ -238,7 +238,7 @@ const databaseInstance = (adapter: RealtimeDatabaseAdapter) => {
         database = app.database(databaseURL);
         set(adapter, 'database', database);
     }
-    return database;
+    return database!;
 }
 
 declare module 'ember-data' {
diff --git a/addon/initializers/emberfire.ts b/addon/initializers/emberfire.ts
@@ -1,11 +1,14 @@
-import * as firebase from 'firebase/app';
+// @ts-ignore export for Node problem
+import _firebase from 'firebase/app';
 import FirebaseAppService from '../services/firebase-app';
 import RealtimeListenerService from '../services/realtime-listener';
 import FirestoreAdapter from '../adapters/firestore';
 import FirestoreSerializer from '../serializers/firestore';
 import RealtimeDatabaseAdapater from '../adapters/realtime-database';
 import RealtimeDatabaseSerializer from '../serializers/realtime-database';
 
+const firebase = _firebase as typeof import('firebase/app');
+
 const initialize = (application: any) => {
     const environment = application.resolveRegistration('config:environment');
     if (!environment || typeof environment.firebase !== 'object') {
diff --git a/addon/serializers/firestore.ts b/addon/serializers/firestore.ts
@@ -1,5 +1,5 @@
 import DS from 'ember-data';
-import { firestore } from 'firebase';
+import { firestore } from 'firebase/app';
 
 export type DocumentSnapshot = firestore.DocumentSnapshot | firestore.QueryDocumentSnapshot;
 export type Snapshot = firestore.DocumentSnapshot | firestore.QuerySnapshot;
diff --git a/addon/serializers/realtime-database.ts b/addon/serializers/realtime-database.ts
@@ -1,6 +1,6 @@
 import DS from 'ember-data';
 
-import { database } from 'firebase';
+import { database } from 'firebase/app';
 
 export default class RealtimeDatabaseSerializer extends DS.JSONSerializer {
 
diff --git a/addon/services/firebase-app.ts b/addon/services/firebase-app.ts
@@ -7,18 +7,7 @@ import FirebaseService from './firebase';
 import RSVP from 'rsvp';
 const { resolve } = RSVP;
 
-// TODO move these over to dynamic imports
-import 'firebase/auth';
-import 'firebase/database';
-import 'firebase/firestore';
-import 'firebase/functions';
-import 'firebase/messaging';
-import 'firebase/storage';
-
-// @ts-ignore
-import { app, auth, database, firestore, functions, messaging, storage } from 'firebase/app';
-
-const getApp = (service: FirebaseAppService): app.App => {
+const getApp = (service: FirebaseAppService) => {
     const firebase = get(service, 'firebase');
     const name = get(service, 'name');
     return firebase.app(name);
@@ -37,12 +26,16 @@ export default class FirebaseAppService extends Service.extend({
     options?: object;
 
     delete = () => getApp(this).delete();
-    auth = () => resolve(getApp(this).auth());
-    database = (databaseURL?: string) => resolve(getApp(this).database(databaseURL));
-    firestore = () => resolve(getApp(this).firestore());
-    functions = (region?: string) => resolve(getApp(this).functions(region));
-    messaging = () => resolve(getApp(this).messaging());
-    storage = (storageBucket?: string) => resolve(getApp(this).storage(storageBucket));
+
+    auth        = () => resolve(import('firebase/auth')     ).then(() => getApp(this).auth());
+    firestore   = () => resolve(import('firebase/firestore')).then(() => getApp(this).firestore());
+    messaging   = () => resolve(import('firebase/messaging')).then(() => getApp(this).messaging());
+    database    = (url?: string)    => resolve(import('firebase/database') ).then(() => getApp(this).database(url));
+    functions   = (region?: string) => resolve(import('firebase/functions')).then(() => getApp(this).functions(region));
+
+    // TODO: drop the <any> once firebase-js-sdk #1792 and #1812 and patched in, they were missing typings
+    performance = ()                => resolve(import(<any>'firebase/performance')).then(() => getApp(this).performance());
+    storage     = (url?: string)    => resolve(import(<any>'firebase/storage')    ).then(() => getApp(this).storage(url));
 
     init() {
         this._super(...arguments);
@@ -56,4 +49,4 @@ declare module '@ember/service' {
   interface Registry {
     "firebase-app": FirebaseAppService;
   }
-}
+}
diff --git a/addon/services/firebase.ts b/addon/services/firebase.ts
@@ -1,16 +1,19 @@
-import * as firebase from 'firebase/app';
+// @ts-ignore Node.js issues
+import _firebase from 'firebase/app';
 import Service from '@ember/service';
 
+const firebase = _firebase as typeof import('firebase/app');
+
 export default class FirebaseService extends Service {
 
   app = (name?: string) => firebase.app(name);
   apps = firebase.apps;
-  initializeApp = (options: Object, nameOrConfig?: string|Object) => firebase.initializeApp(options, nameOrConfig as string|undefined);
+  initializeApp = (options: Object, nameOrConfig?: string|Object) => firebase.initializeApp(options, nameOrConfig as string | undefined);
 
 }
 
 declare module '@ember/service' {
   interface Registry {
     firebase: FirebaseService;
   }
-}
+}
diff --git a/blueprints/emberfire/files/app/adapters/application.js b/blueprints/emberfire/files/app/adapters/application.js
@@ -3,5 +3,5 @@ import FirestoreAdapter from 'emberfire/adapters/firestore';
 export default FirestoreAdapter.extend({
     // Uncomment the following lines to enable offline persistence and multi-tab support
     // enablePersistence: true,
-    // persistenceSettings: { experimentalTabSynchronization: true }
+    // persistenceSettings: { synchronizeTabs: true }
 });
diff --git a/docs/guide/installation.md b/docs/guide/installation.md
@@ -28,7 +28,7 @@ import FirestoreAdapter from 'emberfire/adapters/firestore';
 export default FirestoreAdapter.extend({
   // Uncomment the following lines to enable offline persistence and multi-tab support
   // enablePersistence: true,
-  // persistenceSettings: { experimentalTabSynchronization: true }
+  // persistenceSettings: { synchronizeTabs: true }
 });
 ```
 
diff --git a/docs/quickstart.md b/docs/quickstart.md
@@ -28,7 +28,7 @@ import FirestoreAdapter from 'emberfire/adapters/firestore';
 export default FirestoreAdapter.extend({
   // Uncomment the following lines to enable offline persistence and multi-tab support
   // enablePersistence: true,
-  // persistenceSettings: { experimentalTabSynchronization: true }
+  // persistenceSettings: { synchronizeTabs: true }
 });
 ```
 
diff --git a/docs/reference/classes/firestoreadapter.md b/docs/reference/classes/firestoreadapter.md
@@ -123,7 +123,7 @@ import FirestoreAdapter from 'emberfire/adapters/firestore';
 
 export default FirestoreAdapter.extend({
   enablePersistence: true,
-  persistenceSettings: { experimentalTabSynchronization: true }
+  persistenceSettings: { synchronizeTabs: true }
 });
 ```
 
diff --git a/ember-cli-build.js b/ember-cli-build.js
@@ -6,6 +6,7 @@ const EmberAddon = require('ember-cli/lib/broccoli/ember-addon');
 module.exports = function(defaults) {
   let app = new EmberAddon(defaults, {
     babel: {
+      plugins: [ require.resolve('ember-auto-import/babel-plugin') ],
       sourceMaps: 'inline'
     }
   });
diff --git a/index.js b/index.js
@@ -14,6 +14,9 @@ module.exports = {
     autoImport:{
       exclude: [],
       webpack: {}
+    },
+    babel: {
+      plugins: [ require.resolve('ember-auto-import/babel-plugin') ]
     }
   },
 
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
diff --git a/tests/dummy/app/adapters/application.js b/tests/dummy/app/adapters/application.js
diff --git a/tsconfig.json b/tsconfig.json

Original file line number	Diff line number	Diff line change
`@@ -92,7 +92,7 @@ export default class FirestoreAdapter extends DS.Adapter.extend({`
`92`	`92`	`*`
`93`	`93`	`* export default FirestoreAdapter.extend({`
`94`	`94`	`* enablePersistence: true,`
`95`		`- * persistenceSettings: { experimentalTabSynchronization: true }`
	`95`	`+ * persistenceSettings: { synchronizeTabs: true }`
`96`	`96`	`* });`
`97`	`97`	* ```
`98`	`98`	`*`
`@@ -299,7 +299,7 @@ const getFirestore = (adapter: FirestoreAdapter) => {`
`299`	`299`	`});`
`300`	`300`	`set(adapter, 'firestore', cachedFirestoreInstance);`
`301`	`301`	`}`
`302`		`- return cachedFirestoreInstance;`
	`302`	`+ return cachedFirestoreInstance!;`
`303`	`303`	`};`
`304`	`304`
`305`	`305`	`declare module 'ember-data' {`
Original file line number	Diff line number	Diff line change
`@@ -238,7 +238,7 @@ const databaseInstance = (adapter: RealtimeDatabaseAdapter) => {`
`238`	`238`	`database = app.database(databaseURL);`
`239`	`239`	`set(adapter, 'database', database);`
`240`	`240`	`}`
`241`		`- return database;`
	`241`	`+ return database!;`
`242`	`242`	`}`
`243`	`243`
`244`	`244`	`declare module 'ember-data' {`