No matching service worker detected: webapp running in sub-directory - service-worker

I'm getting the follow error-msg in the console when I try to 'add to homescreen'
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
Register the service-worker did went fine and seems to be ok:
chrome application-Service Worker
It must something to do with the scop since I'm running my site in a sub-domain(/webconnect/):
The manifest has the following values for scope and start_url:
"scope": "/webconnect/"
"start_url": "/webconnect/index.html"
I've gone through the troubleshoot section but this didn't helped me a lot:
Troubleshooting
If after testing you are getting the following error in your console:
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
Then please make sure that 1. Your service worker is functioning properly and without errors, and 2. Your start_url matches an actual url of your website that loads. Else, you will never get the prompt to show!
Is there a specific trcik I'm missing to add the site to the homepage?

Place the service worker script file at the root of your website (/webconnect/), or place it wherever you want and use the scope property and the Service-Worker-Allowed HTTP header as in my other answer.

Related

Getting a cross origin error when running my Cypress tests in Jenkins

I'm running my Cypress locally and they are always pass, but when I'm running them in jenkins, I keep getting this error:
> Blocked a frame with origin "http://localhost:3000" from accessing a cross-origin frame.
Before the page load, you were bound to the origin policy:
> http://localhost:3000
A cross origin error happens when your application navigates to a new superdomain which does not match the origin policy above.
This typically happens in one of three ways:
1. You clicked an <a> that routed you outside of your application
2. You submitted a form and your server redirected you outside of your application
3. You used a javascript redirect to a page outside of your application
Cypress does not allow you to change superdomains within a single test.
You may need to restructure some of your test code to avoid this problem.
Alternatively you can also disable Chrome Web Security which will turn off this restriction by setting { chromeWebSecurity: false } in your 'cypress.json' file.
https://on.cypress.io/cross-origin-violation
sometimes one of them passes
I tried to add chromeWebSecurity: false to my cypress.json
but got "data:" in my url after logging in the test
(I'm logging out w/ api call that doesn't do a redirect)
Most likely there is some javascript that is calling window.top.location or some other form of redirect. We call this framebusting, when your app busts out of its iframe into the cypress top level frame. Cypress attempts to strip out this framebusting code via a regex but it's possible for code to slip through.
You should either:
find and disable/remove the framebusting javascript
submit an issue with more specifics to the cypress team here
here's some similar issues to yours: https://github.com/cypress-io/cypress/issues?utf8=%E2%9C%93&q=is%3Aissue+is%3Aopen+sort%3Aupdated-desc+framebust

Issue trying to launch sample project che-ide-server-extension

With Eclipse Che, I've recently been able to deploy the docker container without any issue as provided in the instructions.
I'm at the point where am trying to learn a bit more about extension development for Che, and I'm going through the small introduction on "developing your first plugin" located on the following page:
https://www.eclipse.org/che/docs/che-in-che-quickstart.html
I'm stuck at the point where I can successfully build and deploy the sample project by executing the Traefik Start, Tomcat8-IDE Start, Deploy IDE and Deploy Workspace Agent commands.
But when it comes time to navigate to the newly created 2nd workspace by clicking on the link provided in the IDE to go to the newly created 2nd workplace instance...:
... I end up getting redirected to the following error page:
I suspect that there may be some kind of configuration problem with the sample plugin project, or configuration problem with keycloak, but I'm at the point where I don't really know how to proceed in terms of troubleshooting.
(Update: 2018/07/31)
At request of #kalrsson for more information, below is a screenshot of the che-public client configuration in my Keycloak instance.
(SOLUTION Update: 2018/08/01)
Thanks to #kalrsson for pointing me in the right direction.
At first I tried only adding the needed URL to the "Valid Redirect URIs" list. Doing so allowed me to get past the issue were I was receiving the error "Invalid parameter: redirect_uri". However, this only presented me with a blank page. On this blank page, when I inspect the web browser console, I noticed the following error:
From there, I also tried to add the needed URL to WebOrigins in KeyCloak as seen below.
Doing this finally allowed me to fully load and render the secondary workspace
Can you go to keycloak_ip:5050/auth, login as admin/admin, clients, che-public, and the IP you use to redirect urls and webOrigins?
So, you need to previewURL:port both to redirectURIs and webOrigins

For how long will a browser remember to look for serviceworker.js?

Long story short: I have a website that used to have a service worker. I removed it. All is working well. Fine.
However, checking nginx error logs I can see how many returning visitors' browsers are checking for serviceworker.js file (probably trying to refresh the file). Since the file is no more, this makes a line in the error log saying how the resource serviceworker.js was not found.
So, is this a problem? How long will their browsers do this?
Can I "tell" any visiting browser that serviceworker.js is no more so purge any old references you have that make your browser shoot the question.

Using browserSync, the websocket connection does not initialize until after files have changed

Essentially the problem is that BrowserSync isn't "syncing" until after I change a file for the first time, thus the first "refresh" doesn't come for free.
Background:
I'm setting up a very simple repository where we have a gulp process that generates static files to be served by browserSync. Gulp watches those files, and when they change causes browserSync to reload.
Even though the index page serves seemingly fine, the automatic refresh does not work until AFTER you've both changed a watched file for the first time and then refreshed the browser manually.
I've confirmed this by watching the network tab in Chrome's developer tools, and can see that on first load, there is no websocket present until I manually change a file. Then, after I refresh the browser I can see a proper websocket running. It doesn't matter how many times you refresh the page before you change a file, the websocket will simply not initialize.
I've asked in the BrowserSync slack, checked their issues and read the source code and still can't figure out why this is happening.
If needed I can update the question with the relevant parts of my various related files:
Dockerfile
docker-compose.yml
gulpfule.js
I created a screencast gif, but the whole thing is about 20mb - so I didn't upload it.
Thanks in advance for any help.
BrowserSync in terminal on first load:
Network tab on first load - no websocket:
After I change a file:
Network tab after first changed file - with websocket:
Solved
I created a loader.html with a simple javascript that would do a pre-flight request against my local docker IP/port (3000) associated with my BrowserSync project. On the catch, I would just let it loop every 1000ms and on success, I would redirect.
This is where the problem was introduced.
I was doing the pre-flight request on the same IP/port that I was redirecting to, and for some reason the "websocket" was getting "cached" from my pre-flight check and then wouldn't re-initialize on the redirect or any subsequent refreshes.
My solution was to pre-flight check for BrowserSync's UI port which is 3001 not 3000. Once that was up, I could redirect to the IP:3000 without any problems.

How can step through an Action that is requested from JavaScript during execution?

There is this one action that is requested using javascript during the loading of a page, it takes over 25 seconds to resolve. Looking at the code makes me think there is a scaling issue, but I am wondering if there is any way I can step through the code during the request so I can see what is happening. I try clicking 'debug/start debugging' but it won't launch the proper URL (access to the site is subdomain based), and it will also not find certain dependencies. I am able to browse the site directly via URL locally after mapping a URL via my hosts file to localhost (127...) but the default url that pops up (localhost...) from debug does not work because it is not formatted properly.
Any ideas?
You can attach the debugger to your browser by selecting "Attach to process" under "Debug" menu.
In the past, at least with ASP.NET we have used tracing to debug issues. You will just need to enable it in the webconfig. If you use warn, the messages will show in red and be easier to spot.

Resources