title: Firebase Push Notification sent, but onMessage() not firing
body: <p>I am sending a push notification from Postman.</p>
  
  <p>I've got the Authorization and Content-Type headers set and my Body looks like this:</p>
  
  <pre><code>{
      "to" : "faecDTf47y4:APA91bEsGFDeKQtifs-XXXXXXXXXXXXXXXXXXXXXXXXXXX", 
  
      "notification": {
          "title": "Hello",
          "body": "World!",
          "icon": "/images/favicon.png"
    }
  
  }
  </code></pre>
  
  <p>When I submit the post request, I get the following JSON response:</p>
  
  <pre><code>{
      "multicast_id": XXXXXXXXXXXXX,
      "success": 1,
      "failure": 0,
      "canonical_ids": 0,
      "results": [
          {
              "message_id": "0:XXXXXXXXXXXXXXXXXXXXXXXX"
          }
      ]
  }
  </code></pre>
  
  <p>So, it looks like it was sent successfully, but it seems like the notification isn't actually fired.</p>
  
  <p>I'm following this tutorial: <a href="https://youtu.be/BsCBCudx58g?t=337" rel="nofollow noreferrer">https://youtu.be/BsCBCudx58g?t=337</a>
  And so far everything is working up until I get to reading the notification with the onMessage() function.</p>
  
  <p>My Service Worker looks like this:</p>
  
  <pre><code>importScripts('https://www.gstatic.com/firebasejs/4.12.1/firebase-app.js');
  importScripts('https://www.gstatic.com/firebasejs/4.12.1/firebase-messaging.js');
  
  // Initialize Firebase
  var config = {
      apiKey: "AIzaSyDRXXXXXXXXXXXXXXXXXXXXX",
      authDomain: "XXXXXXXXXXXXXX.firebaseapp.com",
      databaseURL: "https://XXXXXXXXXX.firebaseio.com",
      projectId: "XXXXXXXXXXXXXX",
      storageBucket: "XXXXXXXXXXXXXX.appspot.com",
      messagingSenderId: "XXXXXXXXXXXXX"
  };
  firebase.initializeApp(config);
  
  const messaging = firebase.messaging();
  </code></pre>
  
  <p>and my main.js looks like this: </p>
  
  <pre><code>// Initialize Firebase
  var config = {
      apiKey: "AIzaSyDRXXXXXXXXXXXXXXXXXXXXX",
      authDomain: "XXXXXXXXXXXXXX.firebaseapp.com",
      databaseURL: "https://XXXXXXXXXXXXXX.firebaseio.com",
      projectId: "XXXXXXXXXXXXXX",
      storageBucket: "XXXXXXXXXXXXXX.appspot.com",
      messagingSenderId: "XXXXXXXXXXXXXX"
  };
  firebase.initializeApp(config);
  
  navigator.serviceWorker
  .register('/site/serviceworker-firebase-messaging.js', { scope: '/site/' })
  .then(function(registration) {
  
  console.log("◕◡◕ Firebase Service Worker Registered");
  const messaging = firebase.messaging();
  messaging.useServiceWorker(registration);
  messaging.requestPermission()
  .then(function() {
      console.log('Firebase has permission.');
      return messaging.getToken();
  }).
  then (function(token) {
      console.log('Firebase messaging Token', token);
  })
  .catch(function(err) {
      console.log('Firebase has encountered an error.', err);
  });
  
  messaging.onMessage(function(payload) {
      console.log('onMessage: ', payload);
  });
  
  });
  </code></pre>
  
  <p>I'm testing in Chrome.</p>
  
  <p><strong>EDIT</strong></p>
  
  <p>When I am not on the tab where my web application is, I do get a notification when I submit from Postman.  It just pops up and says <strong>"This site has been updated in the background."</strong>  But it doesn't have my message/title/icon.</p>