HTML preload link not not working to load fetch

I am preloading an html page using the link tag

<link rel="preload" href="/pages/test" as="fetch">

And then fetching it later using fetch

async function loadPage() {
  const html = await (await fetch("/pages/test")).text();
}
loadPage();

But two seperate requests are still being made. I have already tried the solutions here, but none of them worked for me.