+layout.server.ts is inconsistant host

[ollyde]

Describe the bug

import type { LayoutServerLoad } from "./$types";

export const load: LayoutServerLoad = async ({ fetch, cookies, url }) => {
  return {
    host: url.href,
  };
};

---

<script lang="ts">
  import "../app.postcss";
  import "./styles.css";
  import ModalQueue from "$lib/components/ModalQueue.svelte";
  import { onMount } from "svelte";
  import { get } from "svelte/store";

  export let data: { host: string }

  onMount(() => {
    // Seems very broken, does not work on root :-/ 3 hours debugging
    console.log(`Client Hook Info: ${JSON.stringify(data)}`);
  });
</script>

<div class="app">
  <main>
    <slot />
  </main>
</div>

Reproduction

Above

Logs

We need to load an environmental var for both server and client for server url address. This url needs to be interchangeably and user switchable/savable.

The issue is, we use the domain to determine the original url, and for all instances except development this domain is showing as "http://sveltekit-prerender/" for the root only domain.

Anything that is not root works as expected; showing the url.

System Info

System:
    OS: macOS 13.4.1
    CPU: (8) arm64 Apple M1 Pro
    Memory: 89.66 MB / 16.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 20.3.1 - /opt/homebrew/bin/node
    npm: 9.6.7 - /opt/homebrew/bin/npm
    pnpm: 8.6.12 - ~/Library/pnpm/pnpm
  Browsers:
    Chrome: 116.0.5845.96
    Safari: 16.5.1

Severity

blocking all usage of SvelteKit

Additional Information

No response

[Conduitry]

If you need to control the origin used in prerendered pages, use kit.prerender.origin

If you need this to be dynamic for different on a given route, you can't use prerendering for that route and need to disabled it - https://kit.svelte.dev/docs/page-options#prerender

[ollyde]

@Conduitry hey, thanks for closing so fast but this doesn't seem like expected behavior.

It should be consistent, if I visit a url it should show what that url is instead of hiding it and warping the result. I spent a few debugging for something that feels like a core platform issue.

For example
= /some-url: works
= /some-other-url: works
= / : doesn't work.

To be honest I'm not too happy that SvelteKit is doing funky stuff like this; makes me want to leave the platform.

Also the link you provided https://kit.svelte.dev/docs/configuration#prerender; I don't see how this addresses this funky annoying issue that emulates a bug? I don't see anything in "prerender" that relates...

[ollyde]

@Conduitry for example, all these values for root say "http://sveltekit-prerender/" which is completely incorrect, they do not reflect real host values. This issue should be reopened..

When visiting 'mydomain.com'

export const load: LayoutServerLoad = async ({ cookies, url, fetch, request }) => {
  return {
    host: JSON.stringify(url), // Incorrect: http://sveltekit-prerender/
    fetch: JSON.stringify(fetch),  // Incorrect: http://sveltekit-prerender/
    request: request.url,  // Incorrect: http://sveltekit-prerender/
  };
};

When visiting 'mydomain.com/some-url'

export const load: LayoutServerLoad = async ({ cookies, url, fetch, request }) => {
  return {
    host: JSON.stringify(url), // Correct
    fetch: JSON.stringify(fetch) // Correct
    request: request.url // Correct
  };
};

[ollyde]

@Conduitry and based of the link you sent, which by the way is almost useless. It doesn't explain anything or how to fix this. This is a bug; how can a server dynamically load a url?

What use is this too me?...

[ollyde]

@Conduitry also why does this 'request' work for other urls except root, that makes no sense? Since they are SSR, seems like a core platform bug

The browser already sends the url with the request in the headers, so this doesn't make any sense, SSR should be able to see the url on all routes (which it does except root)

[dummdidumm]

Are you prerendering your root route? Because if yes, then there's no way how SvelteKit can magically know where you're deplying to, and you need to use said prerendering setting. If no, please provide a reproduction.

[ollyde]

@dummdidumm yes I'm per-rendering all roots. I've noticed that +layout.server.ts is not called for root ("/") but all other pre-rendered routes which is incorrect.

[dummdidumm]

Please provide a reproduction in the form of a repository of Stackblitz link then. Also I don't know what you mean by "all roots", "/" is the only root of an app.

[ollyde]

@dummdidumm if you create a base project and use +layout.server.ts with +layout.page.ts you can see the bug.

on "/" it's not called. On other roots it is.

With hooks it doesn't show the correct url. For other SSR routes it does.

I can create a whole project for you if yo want?

[dummdidumm]

Yes, please share a full repository or Stackblitz link. I think we're talking past each other and having a full code example where you say what you expect to work that doesn't it's easier

[ollyde]

@dummdidumm btw it seems to only bug when hosted (built and deployed) using the node-adaptor

Make a fresh project

npm create svelte@latest my-app
cd my-app
npm install
npm run dev

then

add +layout.server.ts

/** @type {import('./$types').PageServerData} */
export async function load({url}) {

    console.log('load layout', url.host);

    return {
      empty: ''
    };
  }

[ollyde]

@dummdidumm this only fires for anything that isn't root.

[dummdidumm]

Again, please provide a reproduction linking to a Stackblitz or Github project. These scattered infos and manual steps that gloss over details are all prone to misunderstanding.

[ollyde]

@dummdidumm Sure, here is a project that emulates the broken functionality, you will need to look at server logs to validate it, not sure how to do that on StackBlitz, I'm hosting with K8.

The root doesn't fire, but loading from another url does. Also, in server hooks the url is incorrect, showing 'http://sveltekit-prerender/' but this is not the case in other roots (loaded from scratch)..

https://github.com/ollyde/example-sveltekit-root-page-load-broken