Using cache-control: only-if-cached

I would like to make a request from browser JS code that only succeeds if there is a response in the cache, and otherwise errors.

The Cache-Control: only-if-cached header discussed here on MDN sounds like just what I need:

The client indicates that an already-cached response should be returned. If a cache has a stored response, even a stale one, it will be returned. If no cached response is available, a 504 Gateway Timeout response will be returned.

But in practice I just can’t get that to work. If I run this code in the console on any page on the web:

fetch("/" + Math.floor(Math.random() * Number.MAX_SAFE_INTEGER).toString(), {
  headers: {
    "Cache-Control": "only-if-cached",
  },
}).then((res) => {
  console.log('Fetch', res.status);
});

I just get a plain old 404 and I can see that an HTTP request was made to the server. Why doesn’t this result in a 504? I observe the same behavior in both Chrome and Firefox.

I also found a top-level option in the fetch API that sounds like it’s supposed to do the same thing. As discussed on MDN here fetch supports a cache property in its request options, which also supports only-if-cached as a value. It states there:

only-if-cached — The browser looks for a matching request in its HTTP cache.
If there is a match, fresh or stale, it will be returned from the cache.
If there is no match, the browser will respond with a 504 Gateway timeout status.

I gave that a shot and it seems to work… but not as described. Rather than returning a 504 status, it throws a TypeError: NetworkError when attempting to fetch resource when I try this code:

fetch("/" + Math.floor(Math.random() * Number.MAX_SAFE_INTEGER).toString(), {
  cache: 'only-if-cached',
  mode: 'same-origin',
}).then((res) => {
  console.log('Fetch', res.status);
}).catch((err) => {
  console.error(err);
});

And the network tools in Firefox show NS_ERROR_DOCUMENT_NOT_CACHED for the request. So, getting warmer, but where’s this 504 response the documentation talks about? Unfortunately the error thrown in code in that case doesn’t look specific enough for me to distinguish it from other sorts of errors.

I’ve tried throwing the code in <script> tags and running it on a local server, and with all extensions disabled, but am getting the same behavior. The documentation seems clear and direct yet the described behavior eludes me. I am mainly using Firefox 12.1.0 64-bit Windows.