Background sync replaying without background sync event

Question

I am new to the service workers and trying to develop one to take care of background image uploading. I am using Workbox and firefox for testing. The service worker is loaded and registered correctly and whenever I try to upload an image offline these logs appear in the console:

workbox Request for '/photoUpload' has been added to background sync queue 'PhotoQueue'

workbox Using NetworkOnly to respond to '/photoUpload'

after some seconds before I get online, the following are printed in the log, and the photo is not uploaded to the server:

workbox Background sync replaying without background sync event

workbox Request for '/photoUpload' has been replayed in queue 'PhotoQueue'

workbox All requests in queue 'PhotoQueue' have successfully replayed; the queue is now empty!

here is my serviceWorker.js:

const showNotification = () => {
  self.registration.showNotification('Post Sent', {
    body: 'You are back online and your post was successfully sent!',
  });
};


const bgSyncPlugin = new workbox.backgroundSync.Plugin('PhotoQueue', {
  maxRetentionTime: 24 * 60, // Retry for max of 24 Hours  

  callbacks: {
    queueDidReplay: showNotification
  }
});


workbox.routing.registerRoute(
  new RegExp('/photoUpload'),
  new workbox.strategies.NetworkOnly({
    plugins: [
      bgSyncPlugin
    ]
  }),
  'POST'
);

is there a way that I can trigger the background sync event? why the workbox removing the POST request from the Queue before the image is uploaded to the server.

Jeff Posnick Jeff Posnick · Accepted Answer · 2020-12-04T18:47:21

Firefox does not support the Background Sync API natively. workbox-background-sync will attempt to "polyfill" this missing API by automatically retrying the queue whenever the service worker starts up.

Chrome allows you to trigger the background sync event via its DevTools, but as mentioned, Firefox does not. There is no programmatic way to force a service worker to stop and then start again using DevTools in Firefox (as far as I know).

Are you sure that the photo isn't being uploaded to the server? Do you see anything in the Network panel of Firefox's DevTools corresponding to the upload attempt?

Background sync replaying without background sync event

1 Answers