trailingSlash ignore gives wrong URL pathname

[GingerAdonis]

Describe the bug

Viewing a page with a trailing slash when rendered clientside will give an URL pathname without the trailing slash in +page.server.js. This is quite problematic for custom trailingSlash handling in the load function.

Example:

• /myroute/ server load gives pathname: /myroute/ (ok)
• /myroute/ client load gives pathname: /myroute (not ok)

Reproduction

Please note that trailingSlash is set to ignore. Click both links and see the problem when viewing a page with a trailing slash.

https://stackblitz.com/edit/sveltejs-kit-template-default-y3g4ee?file=src/routes/about/+page.svelte

Logs

No response

System Info

System:
    OS: Windows 10 10.0.22621
    CPU: (12) x64 AMD Ryzen 5 5600U with Radeon Graphics
    Memory: 2.41 GB / 13.86 GB
  Binaries:
    Node: 18.15.0 - C:\Program Files\nodejs\node.EXE
    npm: 9.6.3 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Edge: Spartan (44.22621.1413.0), Chromium (111.0.1661.62)
    Internet Explorer: 11.0.22621.1
  npmPackages:
    @sveltejs/adapter-node: 1.2.3 => 1.2.3
    @sveltejs/kit: 1.15.0 => 1.15.0
    svelte: 3.58.0 => 3.58.0
    vite: 4.2.1 => 4.2.1

Severity

serious, but I can work around it

Additional Information

No response

[amit13k]

I am facing similar issue where client side navigation with a trailing slash doesn't contain trailing slash in the pathname in load function. As a workaround, I am just adding a trailing slash if it's not already present. Hoping to see this fixed sooner.

[dreitzner]

update

After some debugging if found out, that trailing_slash is always undefined.
The section of code that is responsible can be found here:
packages\kit\src\runtime\server\respond.js => respond() in line 177
trailing_slash is only set when it is not a data request, therefore undefined.

---

After some debugging, here is some more info:

• render_page() returns correct URL

URL {
  href: 'http://billa.local:3000/about/',
  origin: 'http://billa.local:3000',
  protocol: 'http:',
  username: '',
  password: '',
  host: 'billa.local:3000',
  hostname: 'billa.local',
  port: '3000',
  pathname: '/about/',
  search: '',
  searchParams: URLSearchParams {},
  hash: ''
}

• render_data() returns wrong url

URL {
  href: 'http://billa.local:3000/about',
  origin: 'http://billa.local:3000',
  protocol: 'http:',
  username: '',
  password: '',
  host: 'billa.local:3000',
  hostname: 'billa.local',
  port: '3000',
  pathname: '/about',
  search: '',
  searchParams: URLSearchParams {},
  hash: ''
}

adding to that:

• export const trailingSlash = 'always'; is present in ./src/routes/+layout.js
• I still get trailing_slash as never in render_data(), which is why the normalize_path does not work
• I also tried adding the trailing slash option to the root server layout => same issue
• I also tried to add a layout to the route, but it is still never

[dreitzner]

@Rich-Harris the logic was introduced with PR #7719 .
Do you remember, why the trailing slash logic was excluded for data requests?
Link to original PR: https://github.com/sveltejs/kit/pull/7719/files#diff-70bbf390c5a53b49a9f23557426bbd1bee9188a247ce1ef34e5f4f217036c7f6R180
Link to current code block: https://github.com/sveltejs/kit/blob/master/packages/kit/src/runtime/server/respond.js#L178

For every client site routing the trailing slash logic is never called and it is therefore undefined, when calling render_data()

[dreitzner]

@dummdidumm as reviewer of this PR, you also might be able to give more insight into the question above. 😊

[dummdidumm]

I think we did that because data requests don't need to be redirected, but the logic seems flawed because while we don't want to redirect, we still want to compute the trailingSlash value (because right now it's always undefined as you say and then falls back to never). A PR changing that would be appreciated 👍

[GingerAdonis]

I've updated the stackblitz link to use kit v1.15.9 and this bug still occurs. Do you have any idea? @dummdidumm / @dreitzner :)

[dreitzner]

@GingerAdonis that is weird....

when I create a new SvelteKit project and run it locally, I get the correct behavior.
See https://github.com/dreitzner/svelte-kit-trailing-slash

[GingerAdonis]

when I create a new SvelteKit project and run it locally, I get the correct behavior. See https://github.com/dreitzner/svelte-kit-trailing-slash

Your repo has a +page.js file instead of a +page.server.js file to properly reproduce this bug.

[dreitzner]

ok, that makes sense, there is currently no way to communicate to the server that there should be a trailing slash in preload, when it is set to ignore. I updated my test repo with /server and /server/

Example:
/server will call http://127.0.0.1:5173/server/__data.json?x-sveltekit-invalidated=_1
/server/ will call http://127.0.0.1:5173/server/__data.json?x-sveltekit-invalidated=_1

[GingerAdonis]

@dummdidumm Can the issue be re-opened? Thank you. :)

[GingerAdonis]

I'm kind-of stuck on this issue. Is there anyone that knows a (hacky) workaround for this issue? Thanks in advance.