Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Shadow endpoints don't update with params, don't receive URL searchParams #3777

Closed
CaptainCodeman opened this issue Feb 8, 2022 · 2 comments · Fixed by #3780
Closed

Shadow endpoints don't update with params, don't receive URL searchParams #3777

CaptainCodeman opened this issue Feb 8, 2022 · 2 comments · Fixed by #3780

Comments

@CaptainCodeman
Copy link
Contributor

CaptainCodeman commented Feb 8, 2022

Describe the bug

When changing routes, the shadow endpoint is not called when expected and even when it is called it does not receive URL searchParams. Only an initial, full page-refresh when on that URL works as expected.

Reproduction

Using out-the-box new Svelte-Kit project.

__layout.svelte (simply some links to click)

<ul>
    <li><a href="/">home</a></li>
    <li><a href="/a?page=1">a / 1</a></li>
    <li><a href="/a?page=2">a / 2</a></li>
    <li><a href="/b?page=1">b / 1</a></li>
    <li><a href="/b?page=2">b / 2</a></li>
</ul>

<slot></slot>

index.svelte (to allow changing to / from route)

Home

[id].svelte (route to display data from endpoint)

<script lang="ts">
  export let id
  export let page
</script>

<pre>id: {id} / page: {page}</pre>

[id].ts (endpoint just mirrors param / url.searchParams)

import type { RequestHandler } from '@sveltejs/kit'

export const get: RequestHandler = async ({ params, url }) => {
  const { id } = params
  const page = url.searchParams.get('page')

  return {
    body: {
      id,
      page,
    }
  }
}

Clicking the links changes the id param and / or the page url searchParam. The id param is picked up on the initial entry to a route, but the searchParam is null. Neither changes on subsequent clicks. A full page reload makes both be recognized and reflected in the page. Going back to home and then to the route makes the id param be picked up for that initial change (and page be null), but is then frozen again if navigating to a different id page.

Adding back the original load function to [id].svelte, even calling the new shadow endpoint, makes things work:

<script lang="ts" context="module">
  import type { Load } from '@sveltejs/kit'

  export const load: Load = async ({ fetch, props, params, url }) => {
    const { id } = params
    const page = url.searchParams.get('page')

    const resp = await fetch(`/${id}/__data.json?page=${page}`)
    const data = await resp.json()

    return {
      props: { ...data }
    }
  }
</script>

Logs

No response

System Info

System:
    OS: macOS 12.2
    CPU: (6) x64 Intel(R) Core(TM) i5-8500B CPU @ 3.00GHz
    Memory: 1.67 GB / 32.00 GB
    Shell: 5.8 - /bin/zsh
  Binaries:
    Node: 14.17.3 - /usr/local/bin/node
    npm: 7.20.2 - /usr/local/bin/npm
  Browsers:
    Chrome: 98.0.4758.80
    Chrome Canary: 100.0.4876.0
    Edge: 98.0.1108.43
    Firefox: 96.0.3
    Safari: 15.3
    Safari Technology Preview: 15.4
  npmPackages:
    @sveltejs/adapter-auto: ^1.0.0-next.18 => 1.0.0-next.18 
    @sveltejs/kit: next => 1.0.0-next.260 
    svelte: ^3.44.0 => 3.46.4

Severity

serious, but I can work around it

Additional Information

No response

@Conduitry
Copy link
Member

Sounds like a duplicate (or special case) of #3727.

@CaptainCodeman
Copy link
Contributor Author

Yes, a lot of overlap, but wanted to specifically mention the URL searchParams in the issue rather than it maybe get lost in a comment.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants