function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
Sean Parker 31Sean Parker 31 

manifest.json and serviceworker.js for Visualforce Site - check that the service worker for the current page also controls the start URL from the manifest

Hi 
We are building a Progressive Web App on Salesforce Sites and are having an issue:

The manifest.json file loads correctly and the serviceworker.js also loads correctly...

However when you click inspect element>Application>Add to Homescreen it gives the following error:

"Site cannot be installed: no matching service worker detected. You may need to reload the page, or check that the service worker for the current page also controls the start URL from the manifest"
 
Yogesh Malbhage 18Yogesh Malbhage 18
Hi,

Have you got the solution for this?
Because I am implementing the same in lightning components and facing the same problem.
Sean Parker 31Sean Parker 31
This is a very complicated problem to solve. We contacted Salesforce Dev Support and had various options provided. I have tried to summarise it as best possible:

I have received a confirmation from the R&D Team regarding the service workers. "/" or "/IQOSFriends" points to the force.com home and it falls outside the scope of service works built within /resource/ or /apex/pageName - hence this "Add to home screen" functionality is not working. 

Work-around such as specifying scope in manifest.json or pro-grammatically including the scope as follows - 

navigator.serviceWorker.register('/resource/serviceWorker/service-worker.js', { scope: '/' } ).then(function(registration) { 
// Registration was successful 
}).catch(function(err) { 
// registration failed 
console.log('ServiceWorker registration failed: ', err); 
}); 

Would not work as expected , Because these work-arounds involve modifications of response headers. Since we do not have the option to modify the response headers while serving /resource/server-worker.js , This cant be achieved. So when the scope of the service worker does not match with the serving scope - this functionality would not work and it is not supported. 

============== 
Also in terms of css - lightning:container is a just a space which contains the entire project structure ( html, css , & js ) - and it is for developer for building PWA's and MVA's like react , angular , vue etc . So accommodating your custom css should not be a problem in this case.
 
They recommend using lightning components:
Feedback2
For lightning , they need to use lightning components not vf pages. 

Here are some links that can be helpful . Please check with salesforce developers internally how this can be implemented.

http://sfdcmonkey.com/2017/02/06/use-css-lightning-component/

https://developer.salesforce.com/blogs/developer-relations/2015/06/styling-css-component-bundle.html
 
Feedback3
CSS developers need to accommodate there css in lightning as vf will not support this. 

Reference for lightning container :- 

https://developer.salesforce.com/docs/component-library/bundle/lightning:container/documentation

https://developer.salesforce.com/blogs/2018/04/lightning-container-component-building-components-with-react-angular-and-other-libraries.html
 
 
Feedback4
“Also in terms of css - lightning:container is a just a space which contains the entire project structure ( html, css , & js ) - and it is for developer for building PWA's and MVA's like react , angular , vue etc . So accommodating your custom css should not be a problem in this case. “ 

https://medium.com/@ennoucas/salesforce-lightning-application-with-vue-js-and-webpack-part-2-af0071347274