[feature request] simple ALERT script

[dnmTX]

Hi Thomas @tomayac 👋 . I wanted to ask if it's not too much trouble to make some very simple script. To check if the current page i'm on registered any service workers and send a alert(..... with some message and preferably the URL from the scope (the one on the top) and notify if it did. Something like: alert('The website registered Service Worker'+'/n'+**scope...**); It would help me alot on my end and turns out that Java Scripting is not my jam(i tried). I very much hoping here that you'll have the time and willingness. Thank you up front for concidering 👍

[tomayac]

Sending an alert would be very obtrusive for the general user, but I understand it would work for your use case. You can clone the extension and add the desired call here:

https://github.com/google/service-worker-detector/blob/8ce38c64e89a13e46468f92bdf027e4f57a2bc80/contentscript.js#L60

Right before this line add navigator.serviceWorker.ready.then(reg => alert(reg.scope)).

[dnmTX]

@tomayac thanks for the advise but i was hoping for a small script to run it in a UserScript environment and not as extension. This is just to alert me,that's all.

[tomayac]

Oh, I see. In this case try:

if (navigator.serviceWorker.controller) {
  navigator.serviceWorker.ready.then(reg => alert(reg.scope))
}

[dnmTX]

Yeah,that will work,i just have to figure out how to wrap it up as a function. Thanks a lot Thomas @tomayac 👍

[tomayac]

Wrapped like this it should work:

// ==UserScript==
// @name         New Userscript
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  try to take over the world!
// @author       You
// @match        https://atomicobject.com/*
// @grant        none
// ==/UserScript==

(function() {
  if (navigator.serviceWorker.controller) {
    navigator.serviceWorker.ready.then(reg => alert(reg.scope))
  }
})();

[dnmTX]

Wow,ok,i'm speechless to be honest 😄 One more thing though. I was trying to make it look nice,with two fields but apparently it doesn't work. What am i doing wrong: alert("The website registered Service Worker" + "/n" + reg.scope))

[tomayac]

The slash is in the wrong direction (\n is correct) 😃. A modern way would be this:

// ==UserScript==
// @name         New Userscript
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  try to take over the world!
// @author       You
// @match        https://atomicobject.com/*
// @grant        none
// ==/UserScript==

(function() {
  if (navigator.serviceWorker.controller) {
    navigator.serviceWorker.ready.then(reg => alert(`The website registered a Service Worker with the scope:\n${reg.scope}`))
  }
})();

[dnmTX]

Thomas @tomayac you're awesome man,i wish everyone here in GitHub was helpfull like you. I'm very pleased,tested it,works fine.Can't thank you enough. Much appreciated 👍 🥇

[tomayac]

You're welcome! Happy to help!

[dnmTX]

Hmmm...me again(sorry) 🤔 Apparently it doesn't work when you first open the website(any website) but if i refresh the page it kicks in. Tried with document-start-no go, document-end -after refresh. Match is set to *://*/* . Any ideas ?

P.S. When i said that i tested it,i did it console.

[tomayac]

Yes, that's part of the service worker lifecycle. It'a a complex topic, but this doc boils down the reasons in a quite accessible manner.

[dnmTX]

Eh well....can't say that i didn't try. Thanks Thomas 👍

[dnmTX]

Got it Tommy @tomayac :

(function() {
    if ('serviceWorker' in navigator) {
        navigator.serviceWorker.ready.then(reg => alert(`The website registered a Service Worker:\n${reg.scope}`))
    }
})();

This time works 😉

[dnmTX]

Tommmy @tomayac just to show you something funny,this is my reject Error: Service worker registration failed: Error: Request failed with status code 402 (Payment Required) 😄

[tomayac]

Yeah, this can happen. The Web is a wild place.

[dnmTX]

Thomas @tomayac Hi 👋 ,me again(very sorry for the bother) 😄 . Kind of had some issues and i can definitely could use your assistance to do some enhancements. So,the little script works probably 95% of the time,it's just,so far on couple of websites,for some reason can't detect the ServiceWorker. These are the sites(safe to open): https://www.linux.org/ https://vulners.com I ran the script in console and came up as undefined,and i have no idea why 🤔 My thoughts...if you can,in addition,to include to check the status for ACTIVE/ACTIVATED. Maybe this could solve it. Another,small issue i've noticed(so far on one website).The site hangs and it doesn't load all the way untill i click OK on the alert box. I've read that those Workers,they expect some kind of a Promise? Maybe sending OK i gues? This is just me,the unknowledgeable one guessing. Anyhow,if time permits i'd appreciate helping me out. Thanks and stay safe 😷 Cheers 👍

[tomayac]

The service worker is registered for a scope of https://www.linux.org/js/xf/, which is not the main page https://www.linux.org/. If you navigate to https://www.linux.org/js/xf/ and try your snippet there, it works.

[dnmTX]

Thanks Thomas @tomayac that make sense. So from what you posted above the alert follows the scope URL and not the location.hostname or href and if i remove the \n${reg.scope})` part from the script,will it alert everywhere or i just misunderstood the whole thing?

[tomayac]

This StackOverflow response does a really good job at explaining the concept.

[dnmTX]

Got it 😄 . They should've placed it in the root directory but instead,chose different one.Hense,no alert...hense ServiceWorker will not activate anywhere else but in that dir. only. Hense....i can live with that 😉 . Thanks again Tommy @tomayac. Much appreciated 👍

[dnmTX]

Tommy @tomayac unrelated question. I got that RegExp in one of my UserScripts that started getting long and i need to brake it and continue on the next line. Couldn't find anything usable when searching: isrc = /domain.com|another.com|andanother.com|andsoon.com............./i;

[tomayac]

[
  'domain.com',
  'another.com',
  'andanother.com',
  'andsoon.com',
].includes('example.com')

[dnmTX]

Thomas @tomayac please explain what that part means: .includes('example.com'). By design UserScripts have the @include header so is this even necessary in my given case? I just want it substitution on what i'm using. Wonder if this is correct:

isrc = [
    'domain.com',
    'another.com',
    'andanother.com',
    'andsoon.com',
].includes

If you need me to paste the rest of the script here so to make sense what i'm asking,let me know 👍

[tomayac]

Sorry, but I can't provide general JavaScript support here. Please check the documentation of Array.prototype.includes(). Thanks!