Skip to content

Invalidatation should always query the invalid server nodes with fetch({ cache: 'no-cache' }) #6357

@Tal500

Description

@Tal500

Describe the bug

During my work of the (simple) demo of PR #6265, I have found that the "TODO" items "get stuck" in the cache in IE11, after the demo invalidation.
After digging into Kit's code, I found out that the "dumb" IE11 ignore the request headers (specifically, "x-sveltekit-invalidated") if it hit the cache, so this is why it's less likely to hit this issue on other browsers.

I must have been explaining the issue terribley now, so I'll just explain what is wrong with Kit's code. In:

if (invalid_server_nodes.some(Boolean)) {
try {
const res = await native_fetch(
`${url.pathname}${url.pathname.endsWith('/') ? '' : '/'}__data.json${url.search}`,
{
headers: {
'x-sveltekit-invalidated': invalid_server_nodes.map((x) => (x ? '1' : '')).join(',')
}
}
);

it's possible that the browser will use the cache, in the rare case that the header 'x-sveltekit-invalidated' matched to a cached request (or in the case we're on IE11 which probably ignores headers on caching), although clearly this target has been marked as invalid and must not be cached.

Solution:
Add cache: 'no-cache' as a parameter to native_fetch. This means that the browser will always query the server and check for the server response (even if it have cache), but allow the browser to cache the updated response for later. (Source)
I'll upload PR soon.

Might be the root reason for the failure of #6354 and #6349 .

Reproduction

Use the simple demo I mentioned on PR #6265.
You'll notice the wrong caching behavior while trying to add/remove items in the TODO list.
After changing Kit's code at the place I mentioned, it works.

Logs

No response

System Info

System:
    OS: Windows 10 10.0.19044
    CPU: (4) x64 Intel(R) Core(TM) i7-6500U CPU @ 2.50GHz
    Memory: 2.92 GB / 15.49 GB
  Binaries:
    Node: 18.3.0 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.22.18 - ~\AppData\Roaming\npm\yarn.CMD
    npm: 8.14.0 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Edge: Spartan (44.19041.1266.0), Chromium (104.0.1293.70)
    Internet Explorer: 11.0.19041.1566
  npmPackages:
    @sveltejs/adapter-auto: next => 1.0.0-next.67
    @sveltejs/kit: npm:@tal500/[email protected] => 1.0.0-next.445 (Yeah I know, it's my fork version of Kit with the legacy support...)
    @tal500/svelte:  3.49.0-repo-advanced-1
    vite: ^3.1.0-beta.0 => 3.1.0-beta.0

Severity

blocking all usage of SvelteKit

Additional Information

No response

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions