I have the following service worker written in TypeScript:

self.addEventListener("fetch", (event: any) => {
    if (event.request.method == "POST") {
        event.respondWith(
            fetch(event.request).catch(error => {
                return caches.match(event.request);
            })
        );
    } else {
        event.respondWith(
            caches.match(event.request).then(cachedResponse => {
                // It can update the cache to serve updated content on the next request
                return cachedResponse || fetch(event.request);
            })
        );
    }
});

What I want it to do is if there's a POST request on the page, use a network first caching strategy (fetch from the network).

If there aren't any changes (not POST), use the cache first strategy (fetch from cache).

The issue is that it doesn't work. It will never fetch from the network. I have also tried to return on POST like this:

self.addEventListener("fetch", (event: any) => {
    if (event.request.method == "POST") return;
    event.respondWith(
        caches.match(event.request).then(cachedResponse => {
            // It can update the cache to serve updated content on the next request
            return cachedResponse || fetch(event.request);
        })
    );
});

What am I doing wrong?