Error message in Chrome

Hi george I have a problem with my app. When I start with F5, I get the following error message in Chrome. Do you have any idea why that could be? The program runs, but the ugly error message. Best regards, Hans

Fehlermeldung

Testing this today, the warnings (could not load) did not appear. Only to check if title and home screen title were used correctly I renamed them to CH_GemeindenAL and CH_GemeindeAL. Note the difference “n”. Nevertheless the debugger showed the old name/title:


Then I noticed that title and homescreen title had got different names (n). I did set the same names and did a new build with F5. Now everything is OK. New name appeared in debugger. No errors. Plus (add) symbol in address line back again:

Seems to be solved. But what was the very reason of the previous error messages?

An hour later I made another build with F5 on Windows 10 desktop PC. Old error message again.

BTW:
Clear site data with Chrome debugger did never work. There is still quite a lot of Cache Storage.

.

I ran the web app in Edge (Chromium version) too. These are some of the debugger messages:

where bootstrap css and js not found errors might seem relevant

PWAs (and the older cache technique) can do odd things if the cache is messed up. This only seems to be a problem during development. I usually end up doing Clear Browsing Data in Chrome.

Exactly the issue, and it is especially prevailant with Start In Desktop Browser as I’ve mentioned elsewhere in posts. With inspector on, right click refresh button and select empty cache and hard reload option, or close chrome, or close AppStudio (too slow to be practical).

I cleared all caches I can think of several times. As mentioned above “Clear site data” has no effect at all.
Closed AppStudio. No difference. Used Edge. No difference. Certainly closed Chrome too. Will close Chrome again after this reply and even restart Windows machine.
It is not only a developing problem. The app does run. But the app is not a PWA and does not get the Plus/Add button in order to install the PWA.

Update: Same errors and missing Add button after restart of PC, Windows, AppStudio. unregister, reload , Clear site data (no effect at all), hard reload etc.

No progress here getting rid of “redundant”. Today I made AppStudio deploy to local folder.
After I got the message, if I want to go to the local folder, I got this:

This makes me consider to request I could have the service worker registration code in a file at the top level of the app so that one could test other configurations.

Any chance you can zip your project folder and send it to me, with instructions on reproducing this?

Let’s see if it happens here as well.

Sent a zip via OneDrive link.
Please have a Look at Network Tab Many jpg fetched. A lot failed after about 10 sec.

Sent from iPad

Hello george,

Got the problem with creating the PWA.

I get the error message as can be seen in the attachment.

I send the zip file to you via “Swisstransfer”.

Best regards

Hans

image001.jpg

Looking for a reason why Chrome complains about “no matching service worker” I noticed: In PWA manifest name and shortname are set to use “title” . For homescreenTitle I did set a different name than for title. The Identity Chrome debugger shows is not the title which I had expected. It is the homescreenTitle. See the 2 screenshots. TitleIdentity


Using the same names for project, title, homescreenTitle did not make a difference. Still “no matching service worker”.
In the code where the service worker is handled one can find a workaround because of a Chrome bug in Chrome version 64. Currently used Chrome version is 85. Could it be that this bug is fixed meanwhile and the workaround obsolete or causing trouble?

I’m running your project here.

  1. PWAs will not work on a local deploy - they can’t handle file:// intents.
  2. The ‘no matching service provider’ is the result of the ‘redundant’ message - which indicates the service worked failed to initialize.
  3. You’ve got 2500 images in the includes folder. Can you try making a project with just 25 images and see if it makes a difference? I wonder if something is timing out.
  4. In your Project Explorer, you have entries for each of the images. That’s not needed. Just put ‘include’ in the extrafile property and AppStudio will find them all.
  5. Where did you see the reference to Chrome 64?

Hi George,

In the attachment I am sending you the project with 26 pictures.

The “+” appears and no error message appears.

At point 6 I don’t know what you mean by that.

best regards

Hans

CH_GemeindenAL_26.zip (3.42 MB)

@Leader, from Bernd:
Hello George,

  1. My (Bernd) much smaller own apps do work with local deploy. Not using file but http://local host, i.e. /127… I can and I did install them as PWA on the desktop, using the Chrome + button.
  2. In pwa.js are these lines:
  // override Chromium bug: https://stackoverflow.com/questions/48463483/what-causes-a-failed-to-execute-fetch-on-serviceworkerglobalscope-only-if
  if (e.request.cache === 'on-if-cached' && e.request.mode !== 'same-origin') return;
  e.respondWith(
    caches.open(cacheName)
      .then(cache => cache.match(e.request, { ignoreSearch: true }))
      .then(response => response || fetch(e.request)),```
I followed the link after "Chromium bug" and maybe further links. The author wrote that it is a bug in Chrome 64.

I tried the smaller project with less images and it worked fine. Is that what you found? We may be running into a PWA limit that should not happen.

I might think so. I read a lot about PWA and caches and seem to understand some things a bit better. What the app with less images shows is exactly that what I supposed at the first sight of “redundant” and reading the network logs in the debugger, where fetching always fails after between 6 or 10 seconds. Most of my (Bernd) apps are rather small. I have only one big app – PianoCalc – containing 88 mp3 files and comparable audio stuff. Even this is capable of becoming a PWA. So the difference should be at some point between the fetching time my audio needs and the time the much more many jpg and png John2 uses. I do not think that it is the size the cache needs. As far as I understand different sources the cache size is calculated by a percentage of available space on the hardware etc. I should have really sufficient space available on my PC and on my Surface Notebook.

Sorry if these remarks are too dumb:

I read warnings that one should not use skipwaiting (not really understood :slight_smile: )

I wonder why it could happen that – after having renamed John2’s app title and names – I suddenly got the complete app with all pictures running as a pwa, with + button and successful install on my PC. I sent a zip of it to JohnB. It did not work as a pwa at JohnB’s. Nearly not believing this I deployed the app with AppStudio once more and from then on I never got it working as a pwa again.

So one might think that it is indeed possible to make such a huge app to be a pwa too, without timeout or cache size interfering.

I could not find a certain time or position where fetch begins to fail. It was somewhere between 6 sec or 10.x sec.

I noticed that John2 had a lot of strings like “12’530”. I replaced the ‘ with underscores, just to try if this could be a problem. No effect, i.e. the same as with ‘.

Bernd

I can’t find any documentation on limits. We will do more digging into this.

Installed Firefox for Developers. FF says - other than Chrome - that app is available offline. Yet there is an error message as well. See Screenshot. Sorry that it is nearly the whole 4K screen, because I wanted to show complete contents.


In the case that this might be relevant

Good idea! I ran some further tests. FireFox and Safari are both fine. This looks like a Chrome bug.

The min.map errors can be ignored - they are optional debugging files.
https://blog.appstudio.dev/2013/08/chrome-cant-find-query-min-map/

Thank you.

Chrome debugger tells about fetch failed files that there is no response available.

Some sources say, this cannot be correct and say there must be a bug (only the response?) in Chrome.

Even Firefox does not make happy.

  1. Cache solely contains the pictures of CH communities I had visited by clicks. Other images from of ContentToCache not found in cache.
  2. Firefox Dev does not offer an add button to install or something comparable. Would not matter if I would not hope to get information what is wrong with the failed fetches.