Navigator.serviceWorker.controller only works in webroot - service-worker

Question

I am trying to get aServiceWorker to work from a subdirectory in webroot named appdashboard ... the serviceworker installs, runs and is visible from chrome://serviceworker-internals/, but its Navigator.serviceWorker.controller is null so I cannot communicate with it. If I don't restrict the scope (and move my serviceworker file to webroot) it works fine.
const serviceWorker = navigator
.serviceWorker
.register('appdashboard/dashboard_serviceworker.js', { scope: 'http://localhost/appdashboard/' })
.then((swReg) => {
console.log('[Service Worker (Dashboard)] service worker is registered', swReg);
swRegistration = swReg;
if (navigator.serviceWorker.controller != null) {
console.log("controller is working")
}
if (navigator.serviceWorker.controller == null) {
console.log("controller is NULL!") // <<<< its null :(
}
})
I simplified my serviceworker as much as possible to diagnose the issue, and controller is null even with this bare bones worker
self.addEventListener('message', function (event) {
console.log('got message')
});
self.addEventListener('activate', function (event) {
console.log('serviceworker activate')
event.waitUntil(self.clients.claim()); // Become available to all pages
});
self.addEventListener('install', function (event) {
console.log('install')
});
self.addEventListener('fetch', function (event) {
console.log('fetch')
});
self.addEventListener('push', (event) => {
console.log('received push')
});
self.addEventListener('notificationclick', function (event) {
console.log('registered notification click!')
});

Answer 1

I was using MVC routing so that my URL path was localhost/dashboard but my file structure was /appdashboard/, now I serve up an index.html from /appdashboard/ webroot and controller initializes.
This is the line that set me on the right path.
Remember the scope, when included, uses the page's location as its
base. Alternatively, if this code were included in a page at
example.com/product/description.html, the scope of './' would mean
that the service worker only applies to resources under
example.com/product.