workbox: v3 bgSync replayRequests unsupported

Library Affected: workbox-backgroundSync

Browser & Platform: Google Chrome v63.0.3

I’m trying to set up background sync with Workbox v3. After #1222, I have basic functionality, and I’ve added the queueDidReplay callback to show a notification when bg sync occurs:

const showNotification = () => {
  self.registration.showNotification('Background sync success!', {
    body: '🎉`🎉`🎉`'
  });
};

const bgSyncPlugin = new workbox.backgroundSync.Plugin(
  'dashboardr-queue',
  {
    callbacks: {
      queueDidReplay: showNotification
    }
  }
);

const networkWithBackgroundSync = new workbox.strategies.NetworkOnly({
  plugins: [bgSyncPlugin],
});

const addEventRoute = new workbox.routing.Route(
  ({url}) => url.pathname === '/api/add',
  networkWithBackgroundSync,
  'POST'
);

workbox.routing.registerRoute(addEventRoute);

This currently works, but bg sync takes about 5 minutes to happen in Chrome, and I’d like to replay the queued requests immediately. To achieve this I tried calling

bgSyncPlugin.replayRequests()

But this doesn’t appear to work, as replayRequests is not a method of backgroundSync.Plugin:

Uncaught (in promise) TypeError: bgSyncPlugin.replayRequests is not a function
    at Object.replayAndReturn [as handle] (sw.js:110)
    at DefaultRouter.handleRequest (workbox-routing.dev.js:365)
    at workbox.routing.self.addEventListener.event (workbox-routing.dev.js:817)

So I changed backgroundSync.Plugin to backgroundsync.Queue, and that allows me to call replayRequests. But after switching to backgroundsync.Queue, failed requests are no longer being queued, and I’m not getting any console errors to indicate what’s going wrong.

I understand that I might not be able to just swap Plugin & Queue interchangably, but if using Queue is not that solution, then how would I implement this functionality with Plugin? If Queue is the answer, what am I doing wrong?

Separate but related issues: #1247 & #1249

About this issue

  • Original URL
  • State: closed
  • Created 6 years ago
  • Comments: 18 (1 by maintainers)

Most upvoted comments

Yeah, for sure. To re-iterate/summarize, I know that

  • my above code works, except for replayRequests
  • replayRequests isn’t supported in Plugin

Given that, my questions are:

  1. Why doesn’t the replayRequest API exist on Plugin?

In addition to the Queue class, Workbox Background Sync also provides a Plugin class, so it can easily integrate with Workbox strategy classes that takes plugins as options, as well as Workbox routes, which respond to requests using Workbox strategies.

  1. If we are certain that Queue should be used, how would I use it to implement my desired functionality?
  • I’m currently trying based on the existing documentation and can’t figure out how - as noted in my original post I am not getting any error logs when attempting to use Queue.
  • Whatever the resolution, I’d request documentation updates. If I’m confused about how and why to use Queue, other developers might be as well.

If I’m just out in left field and not making any sense, I’m always open to hearing that as well 😉

@philipwalton should we just expose replayRequests from the plugin as well?

I don’t think so. The reason we originally changed the Plugin class to not inherit from the Queue class was to avoid unintentional naming clashes. I think it mixes concerns too much to have plugin classes implement anything other than plugin lifecycle methods.

It sounds to me like @DavidScales should be using the Queue class directly and creating his own fetchDidFail method in an object to pass as the plugin (the same way the Plugin class does currently).