Web client receiving duplicate test messages from Firebase Cloud Messaging console

Question

Just getting started using Firebase and their Cloud Messaging solution, and I am getting a weird occurrence of two push notifications being received whenever I use the Firebase console to send a test message to my client.

I am following the steps on this page: https://firebase.google.com/docs/cloud-messaging/js/first-message?authuser=0#send_a_test_notification_message

In my code, I replace the notification with generic copy (just as described here: https://firebase.google.com/docs/cloud-messaging/js/receive#setting_notification_options_in_the_service_worker), but I receive one notification with the generic copy (Background Message Title and Background Message body.) and one with the actual copy sent from the Firebase console.

I'm not sure what I am doing wrong and any help would be appreciated. I see in the service worker console that only one message is being received by the service worker (via the console log I have added in there)

Firebase console

firebase-messaging-sw.js

messaging.onBackgroundMessage(function(payload) {
  console.log('[firebase-messaging-sw.js] Received background message ', JSON.stringify(payload));
  const notificationTitle = 'Background Message Title';
  const notificationOptions = {
    body: 'Background Message body.',
  };

  self.registration.showNotification(notificationTitle, notificationOptions);
});