Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fixed registration problem of service worker #1807

Merged
merged 7 commits into from
Feb 15, 2021
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
55 changes: 31 additions & 24 deletions examples/lib/cache.js
Original file line number Diff line number Diff line change
@@ -1,6 +1,8 @@
const { reject } = require("lodash");

var setupCache = function() {
let newWorker; // When sw.js is changed, this is the new service worker generated.

// Toggle a CSS class to display a popup prompting the user to fetch a new version.
function showUpdateModal() {
$('#update-prompt-modal').addClass('show');
Expand All @@ -22,31 +24,35 @@ var setupCache = function() {
registration.addEventListener('updatefound', () => {
// When sw.js has been changed, get a reference to the new service worker.
newWorker = registration.installing;

if(!newWorker){
return reject(new Error('error in installing service worker'));
}

newWorker.addEventListener('statechange', () => {
// Check if service worker state has changed.
switch(newWorker.state) {
case 'installed':
if(navigator.serviceWorker.controller) {
// New service worker available; prompt the user to update.
showUpdateModal();
$('#reload').on('click',(e) => {
e.preventDefault();
console.log('New Service Worker Installed Successfully');
location.reload();
return resolve();
})
}
// No updates available; do nothing.
break;
}
});
});

const installingWorker = registration.installing;
Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

this is happening bcoz we have already checked service worker state as installed and now this state installing will not come again. so it returns a null on which we have just added a statechange event listener which is meaningless.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I see, thank you!; this is so hard to track as maintainers; do you think it's possible to write a test for this?

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I have tried to write test for this but i don't know how to make this run 😅 ?

you can have a look this test -
https://github.com/vivek-30/image-sequencer/blob/5fc7fc8ecbb02ac989605a4d422b7b8d85d67aeb/test/core/sw.test.js#L1-L72

@jywarren, @harshkhandeparkar could you please suggest me what to do?

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actually @jywarren what i think is even if we don't build a test for this then also it will solve this problem.
No doubt that adding test will ensure more security and safety but don't think it will slow down image sequencer as to check a successful installation of sw .we have to remove existing sw and clear out the cache and then register a new updated sw (which i have done in my test) ?

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for giving it a try! If you add the test to the correct folder alongside others in this repo, it'll run within this PR. It's possible you need to add some more assertions -- like, see how this line confirms something we expect to be true about the test scenario:

t.equal(sequencer.steps.length, 1, 'Initial Step Created');

Want to try adding your test in this PR?

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@jywarren plz have a look now ,i have added a test for this. Hope you like it ☺️

installingWorker.onstatechange = () => {
console.log(installingWorker);
if (installingWorker.state === 'installed') {
location.reload();
}
};
console.log('Registration successful, scope is:', registration.scope);
})
.catch(function(error) {
console.log('Service worker registration failed, error:', error);
case 'redundant':
return reject(new Error('installing new service worker now became redundant'));
}
})
})
}).catch(err => {
console.log('Failed In Registering Service Worker: ',err);
});

/**
Expand All @@ -69,21 +75,22 @@ var setupCache = function() {
});
}

$('#clear-cache').click(function() {
const clearCache = () => {
if ('serviceWorker' in navigator) {
caches.keys().then(function(cacheNames) {
cacheNames.forEach(function(cacheName) {
caches.delete(cacheName);
});
return caches.keys()
.then(function(cache) {
return Promise.all(cache.map(function(cacheItem) {
return caches.delete(cacheItem);
}));
});
}
}

$('#clear-cache').click(function() {
clearCache();
location.reload();
});





};

module.exports = setupCache;
37 changes: 37 additions & 0 deletions test/core/sequencer/sw.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,37 @@
var setUpCache = new require('../../../examples/lib/cache')();
var test = require('tape');

function SWInstallation(){
return new Promise(() => {
return setupCache();
});
}

function UnRegisterSW(){

function unregister() {
return navigator.serviceWorker.getRegistrations()
.then(function(registrations) {
var unRegisteredWorker = registrations.map(function(registration) {
return registration.unregister();
});
return Promise.all(unRegisteredWorker);
});
}

return Promise.all([
unregister(),
setUpCache.clearCache()
]);
}

test('Register service worker',function(t) {

t.test('unregister service worker',function(st) {
st.equal(UnRegisterSW(),true,'unregistered successfully and cleared the cache')
})

t.test('install service worker',function(st) {
st.equal(SWInstallation(),true,'successfully installed new service worker')
});
});