FCM Pre Modularization (#3234)

* FCM Pre Modualization

* Refactor FCM typing

* Polish javascript doc

* Update index.d.ts

* Add Changeset

* Fix changeset from major to minor

* Add to changeset

* Polished index.d.ts based on Arthur's feedback

* Polish PR based on feedbacks

* Update Changeset

* Fix wording

* Polishing

.changeset/strange-crabs-tell.md

@@ -0,0 +1,10 @@
+---
+'firebase': minor
+'@firebase/messaging': minor,
+'@firebase/messaging-types': minor
+---
+
+Add `getToken(options:{serviceWorkerRegistration, vapidKey})`,`onBackgroundMessage`.
+Deprecate `setBackgroundMessageHandler`, `onTokenRefresh`, `useVapidKey`, `useServiceWorker`, `getToken`.
+
+Add Typing `MessagePayload`, `NotificationPayload`, `FcmOptions`.

integration/messaging/download-browsers.js

@@ -18,8 +18,9 @@
 const seleniumAssistant = require('selenium-assistant');
 
 console.log('Starting browser download - this may take some time.');
-// TODO: enable firefox testing once figure out how to give notification permission with SE webdriver.
-// TODO: Run the integration test against multiple major chrome versions to ensure backward compatibility
+// TODO: enable firefox testing once figure out how to give notification permission with SE
+// webdriver. TODO: Run the integration test against multiple major chrome versions to ensure
+// backward compatibility
 Promise.all([seleniumAssistant.downloadLocalBrowser('chrome', 'stable', 80)])
   .then(() => {
     console.log('Browser download complete.');

integration/messaging/manual-test-server.js

@@ -1,6 +1,6 @@
 /**
  * @license
- * Copyright 2017 Google Inc.
+ * Copyright 2017 Google LLC
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.

integration/messaging/test/static/helpers.js

@@ -0,0 +1,52 @@
+/**
+ * @license
+ * Copyright 2020 Google LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+async function addPayloadToDb(payload) {
+  const dbOpenReq = indexedDB.open(TEST_DB);
+
+  dbOpenReq.onupgradeneeded = () => {
+    const db = dbOpenReq.result;
+
+    // store creation is a synchronized call
+    console.log('creating object store...');
+    db.createObjectStore(BACKGROUND_MESSAGES_OBJECT_STORE, {
+      keyPath: BACKGROUND_MESSAGES_OBJECT_STORE_PRIMARY_KEY
+    });
+  };
+
+  dbOpenReq.onsuccess = () => {
+    const db = dbOpenReq.result;
+
+    addPayloadToDbInternal(db, {
+      ...payload,
+      // ndx is required as the primary key of the store. It doesn't have any other testing purpose
+      ndx: BACKGROUND_MESSAGES_OBJECT_STORE_DEFAULT_NDX
+    });
+  };
+}
+
+async function addPayloadToDbInternal(db, payload) {
+  // onsuccess might race with onupgradeneeded. Consequently causing "object stores was not found"
+  // error. Therefore, wait briefly for db.createObjectStore to complete
+  const delay = ms => new Promise(res => setTimeout(res, ms));
+  await delay(/* milliseconds= */ 30000);
+
+  tx = db.transaction(BACKGROUND_MESSAGES_OBJECT_STORE, 'readwrite');
+
+  console.log('adding message payload to db: ' + JSON.stringify(payload));
+  addReq = tx.objectStore(BACKGROUND_MESSAGES_OBJECT_STORE).add(payload);
+}

integration/messaging/test/static/sw-base.js

@@ -16,6 +16,7 @@
  */
 
 importScripts('../constants.js');
+importScripts('../helpers.js');
 
 // HEAD targets served through express
 importScripts('/firebase-app.js');
@@ -27,45 +28,10 @@ const messaging = firebase.messaging();
 messaging.setBackgroundMessageHandler(payload => {
   console.log(
     TAG +
-      'a background message is received: ' +
+      'a background message is received in the background handler hook: ' +
       JSON.stringify(payload) +
       '. Storing it into idb for tests to read...'
   );
 
   addPayloadToDb(payload);
 });
-
-async function addPayloadToDb(payload) {
-  const dbOpenReq = indexedDB.open(TEST_DB);
-
-  dbOpenReq.onupgradeneeded = () => {
-    const db = dbOpenReq.result;
-
-    // store creation is a synchronized call
-    console.log('creating object store...');
-    db.createObjectStore(BACKGROUND_MESSAGES_OBJECT_STORE, {
-      keyPath: BACKGROUND_MESSAGES_OBJECT_STORE_PRIMARY_KEY
-    });
-  };
-
-  dbOpenReq.onsuccess = () => {
-    const db = dbOpenReq.result;
-
-    addPayloadToDbInternal(db, {
-      ...payload,
-      // ndx is required as the primary key of the store. It doesn't have any other testing purpose
-      ndx: BACKGROUND_MESSAGES_OBJECT_STORE_DEFAULT_NDX
-    });
-  };
-}
-
-async function addPayloadToDbInternal(db, payload) {
-  // onsuccess might race with onupgradeneeded. Consequently causing " object stores was not found" error. Therefore, wait briefly for db.createObjectStore to complete
-  const delay = ms => new Promise(res => setTimeout(res, ms));
-  await delay(/* milliseconds= */ 30000);
-
-  tx = db.transaction(BACKGROUND_MESSAGES_OBJECT_STORE, 'readwrite');
-
-  console.log('adding message payload to db: ' + JSON.stringify(payload));
-  addReq = tx.objectStore(BACKGROUND_MESSAGES_OBJECT_STORE).add(payload);
-}

integration/messaging/test/static/valid-vapid-key-modern-sw/index.html

@@ -0,0 +1,28 @@
+<html>
+  <head>
+    <title>FCM Demo</title>
+    <meta name="viewport" content="width=device-width,initial-scale=1" />
+  </head>
+  <body>
+    <h1>Valid <strong>WITH</strong> VAPID Key - Modern SW</h1>
+
+    <script src="/firebase-app.js"></script>
+    <script src="/firebase-messaging.js"></script>
+    <script src="../app.js"></script>
+    <script src="../constants.js"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/sinon.js/4.1.3/sinon.min.js"></script>
+    <script>
+      navigator.serviceWorker
+        .register('./sw.js')
+        .then(reg => {
+          window.__test = new window.DemoApp(FIREBASE_CONFIG, {
+            swReg: reg,
+            vapidKey: PUBLIC_VAPID_KEY
+          });
+        })
+        .catch(error => {
+          console.log('Error registering FCM SW: ' + error);
+        });
+    </script>
+  </body>
+</html>

packages/messaging/src/interfaces/internal-message.ts → integration/messaging/test/static/valid-vapid-key-modern-sw/sw.js

@@ -15,16 +15,23 @@
  * limitations under the License.
  */
 
-import { MessagePayload } from './message-payload';
+importScripts('../constants.js');
+importScripts('../helpers.js');
 
-export enum MessageType {
-  PUSH_RECEIVED = 'push-received',
-  NOTIFICATION_CLICKED = 'notification-clicked'
-}
+// HEAD targets served through express
+importScripts('/firebase-app.js');
+importScripts('/firebase-messaging.js');
 
-export interface InternalMessage {
-  firebaseMessaging: {
-    type: MessageType;
-    payload: MessagePayload;
-  };
-}
+firebase.initializeApp(FIREBASE_CONFIG);
+const messaging = firebase.messaging();
+
+messaging.onBackgroundMessage(payload => {
+  console.log(
+    TAG +
+      'a background message is received in the onBackgroundMessage hook: ' +
+      JSON.stringify(payload) +
+      '. Storing it into idb for tests to read...'
+  );
+
+  addPayloadToDb(payload);
+});

integration/messaging/test/test-deleteToken.js

@@ -41,7 +41,7 @@ describe('Firebase Messaging Integration Tests > get and delete token', function
 
   const availableBrowsers = seleniumAssistant.getLocalBrowsers();
   availableBrowsers.forEach(assistantBrowser => {
-    //TODO: enable testing for firefox
+    // TODO: enable testing for firefox
     if (assistantBrowser.getId() !== 'chrome') {
       return;
     }