Событие onstatechange Service Worker равно нулю - PullRequest
0 голосов
/ 07 мая 2018

Я бы хотел протестировать несколько состояний моего сервисного работника, но мое событие onstatechange равно нулю:

if (navigator.serviceWorker.controller) {
  console.log("[PWA] Active Service Worker found, no need to register");
} else {
  // Register the ServiceWorker
  navigator.serviceWorker
    .register("{{ path('sw.js')|raw }}", { scope: "{{ path('homepage')|raw }}" })
    .then(reg => {
      if (!reg.installing) {
        return;
      }

      const worker = reg.installing;
      const { state } = worker;
      console.log(worker);

      worker.addEventListener("onstatechange", () => {
        console.log('testtt');
        switch (true) {
          case state === "installing":
            console.log("[PWA] Service Worker is installing...");            
            break;
          case state === "installed":
            console.log("[PWA] Service Worker Install successful");
            break;
          case state === "redundant":
            console.log("[PWA] Service Worker Install failed");            
            break;
          case state === "activated" && !navigator.serviceWorker.controller:
            console.log('[PWA] Service Worker is offline')
            // Show an offline style
            // showOfflineToast();
            break;
        }
      });
    })
    .catch(error => console.log(`[PWA] Error during service worker registration : ${error}`));
}

Если я зарегистрирую свой state, это будет только installing текущий статус.

Ответы [ 2 ]

0 голосов
/ 08 мая 2018

Условное if (!reg.installing) вызывает преждевременный выход из блока кода. Попробуйте это:

navigator.serviceWorker
.register("{{ path('sw.js')|raw }}", { scope: "{{ path('homepage')|raw }}" 
.then(reg => {
    const sw = reg.installing || reg.waiting || reg.active;
    if (sw) {
        logSwState(sw.state)
        sw.addEventListener('statechange', function(e) {
            logSwState(e.target.state);
        })
    }

})

// logs Service Worker state to console
function logSwState(swState) {
    switch (swState) {
        case 'installing':
            console.log('[PWA] Service Worker state: installing');
            break;
        case 'installed':
            console.log('[PWA] Service Worker state: installed');
            break;
        case 'activating':
            console.log('[PWA] Service Worker state: activating');
            break;
        case 'activated':
            console.log('[PWA] Service Worker state: activated');
            break;
        case 'redundant':
            console.log('[PWA] Service Worker state: redundant');
            break;
        default:
            console.log('[PWA] Service Worker state: UNKNOWN');
    }
}
0 голосов
/ 07 мая 2018

Вы должны изменить свой оператор switch на этот

switch (state ) {
      case ("installing"):
        console.log("[PWA] Service Worker is installing...");            
        break;
      case ("installed"):
        console.log("[PWA] Service Worker Install successful");
        break;
      case ("redundant"):
        console.log("[PWA] Service Worker Install failed");            
        break;
      case ("activated"):
        if (navigator.serviceWorker.controller) {
            break;
        }
        console.log('[PWA] Service Worker is offline')
        // Show an offline style
        // showOfflineToast();
        break;
    }
...