From 21e06d15938c491396d70d0cf1a56dd18dd5e261 Mon Sep 17 00:00:00 2001
From: Ben McCann <322311+benmccann@users.noreply.github.com>
Date: Tue, 18 Jan 2022 06:06:53 -0800
Subject: [PATCH 01/16] [breaking] remove per-page router option
---
.changeset/rare-eels-run.md | 5 +++++
documentation/docs/11-page-options.md | 18 +-----------------
packages/kit/src/runtime/client/renderer.js | 9 ---------
packages/kit/src/runtime/server/index.js | 2 +-
packages/kit/src/runtime/server/page/render.js | 5 ++---
.../kit/src/runtime/server/page/respond.js | 12 ++++++++----
.../runtime/server/page/respond_with_error.js | 3 +--
7 files changed, 18 insertions(+), 36 deletions(-)
create mode 100644 .changeset/rare-eels-run.md
diff --git a/.changeset/rare-eels-run.md b/.changeset/rare-eels-run.md
new file mode 100644
index 000000000000..94c5fecb9542
--- /dev/null
+++ b/.changeset/rare-eels-run.md
@@ -0,0 +1,5 @@
+---
+'@sveltejs/kit': patch
+---
+
+[breaking] remove per-page `router` option
diff --git a/documentation/docs/11-page-options.md b/documentation/docs/11-page-options.md
index 82a95eee0e82..e8e3d16fd018 100644
--- a/documentation/docs/11-page-options.md
+++ b/documentation/docs/11-page-options.md
@@ -4,23 +4,7 @@ title: Page options
By default, SvelteKit will render any component first on the server and send it to the client as HTML. It will then render the component again in the browser to make it interactive in a process called **hydration**. For this reason, you need to ensure that components can run in both places. SvelteKit will then initialise a [**router**](#routing) that takes over subsequent navigations.
-You can control each of these on a per-app or per-page basis. Note that each of the per-page settings use [`context="module"`](https://svelte.dev/docs#script_context_module), and only apply to page components, _not_ [layout](#layouts) components.
-
-If both are specified, per-page settings override per-app settings in case of conflicts.
-
-### router
-
-SvelteKit includes a [client-side router](#appendix-routing) that intercepts navigations (from the user clicking on links, or interacting with the back/forward buttons) and updates the page contents, rather than letting the browser handle the navigation by reloading.
-
-In certain circumstances you might need to disable [client-side routing](#appendix-routing) with the app-wide [`router` config option](#configuration-router) or the page-level `router` export:
-
-```html
-
-```
-
-Note that this will disable client-side routing for any navigation from this page, regardless of whether the router is already active.
+Note that each of the per-page settings use [`context="module"`](https://svelte.dev/docs#script_context_module), and only apply to page components, _not_ [layout](#layouts) components. If both per-page and per-app settings are specified, the per-page settings override per-app settings in case of conflicts.
### hydrate
diff --git a/packages/kit/src/runtime/client/renderer.js b/packages/kit/src/runtime/client/renderer.js
index 5a5856d5a5d8..7e47decf45a2 100644
--- a/packages/kit/src/runtime/client/renderer.js
+++ b/packages/kit/src/runtime/client/renderer.js
@@ -323,15 +323,6 @@ export class Renderer {
this.loading.id = null;
this.autoscroll = true;
this.updating = false;
-
- if (!this.router) return;
-
- const leaf_node = navigation_result.state.branch[navigation_result.state.branch.length - 1];
- if (leaf_node && leaf_node.module.router === false) {
- this.router.disable();
- } else {
- this.router.enable();
- }
}
/**
diff --git a/packages/kit/src/runtime/server/index.js b/packages/kit/src/runtime/server/index.js
index 9692866bbfa7..eaf3d663e78c 100644
--- a/packages/kit/src/runtime/server/index.js
+++ b/packages/kit/src/runtime/server/index.js
@@ -97,7 +97,7 @@ export async function respond(incoming, options, state = {}) {
options,
state,
$session: await options.hooks.getSession(request),
- page_config: { router: true, hydrate: true },
+ page_config: { hydrate: true },
stuff: {},
status: 200,
branch: [],
diff --git a/packages/kit/src/runtime/server/page/render.js b/packages/kit/src/runtime/server/page/render.js
index db66d9949841..5d9180a7154f 100644
--- a/packages/kit/src/runtime/server/page/render.js
+++ b/packages/kit/src/runtime/server/page/render.js
@@ -14,7 +14,7 @@ import { create_prerendering_url_proxy } from './utils.js';
* options: import('types/internal').SSRRenderOptions;
* state: import('types/internal').SSRRenderState;
* $session: any;
- * page_config: { hydrate: boolean, router: boolean };
+ * page_config: { hydrate: boolean };
* status: number;
* error?: Error;
* url: URL;
@@ -151,7 +151,7 @@ export async function render_response({
.map((dep) => `\n\t`)
.join('');
- if (page_config.router || page_config.hydrate) {
+ if (page_config.hydrate) {
head += Array.from(js)
.map((dep) => `\n\t`)
.join('');
@@ -165,7 +165,6 @@ export async function render_response({
session: ${try_serialize($session, (error) => {
throw new Error(`Failed to serialize session data: ${error.message}`);
})},
- route: ${!!page_config.router},
spa: ${!ssr},
trailing_slash: ${s(options.trailing_slash)},
hydrate: ${ssr && page_config.hydrate ? `{
diff --git a/packages/kit/src/runtime/server/page/respond.js b/packages/kit/src/runtime/server/page/respond.js
index c38fb7264365..8c9f506f7406 100644
--- a/packages/kit/src/runtime/server/page/respond.js
+++ b/packages/kit/src/runtime/server/page/respond.js
@@ -34,8 +34,7 @@ export async function respond(opts) {
...opts,
branch: [],
page_config: {
- hydrate: true,
- router: true
+ hydrate: true
},
status: 200,
url: request.url,
@@ -247,12 +246,17 @@ function get_page_config(leaf, options) {
// TODO remove for 1.0
if ('ssr' in leaf) {
throw new Error(
- '`export const ssr` has been removed — use the handle hook instead: https://kit.svelte.dev/docs#hooks-handle'
+ '`export const ssr` has been removed — use the `handle` hook instead: https://kit.svelte.dev/docs#hooks-handle'
+ );
+ }
+
+ if ('router' in leaf) {
+ throw new Error(
+ '`export const router` has been removed — use `beforeNavigate` instead: https://kit.svelte.dev/docs#modules-$app-navigation'
);
}
return {
- router: 'router' in leaf ? !!leaf.router : options.router,
hydrate: 'hydrate' in leaf ? !!leaf.hydrate : options.hydrate
};
}
diff --git a/packages/kit/src/runtime/server/page/respond_with_error.js b/packages/kit/src/runtime/server/page/respond_with_error.js
index cfd05eec5dc4..b2a4c4e1dbaa 100644
--- a/packages/kit/src/runtime/server/page/respond_with_error.js
+++ b/packages/kit/src/runtime/server/page/respond_with_error.js
@@ -72,8 +72,7 @@ export async function respond_with_error({
state,
$session,
page_config: {
- hydrate: options.hydrate,
- router: options.router
+ hydrate: options.hydrate
},
stuff: error_loaded.stuff,
status,
From d463a78527b6b35f8ec43826b6f949087177d264 Mon Sep 17 00:00:00 2001
From: Ben McCann <322311+benmccann@users.noreply.github.com>
Date: Tue, 18 Jan 2022 06:19:09 -0800
Subject: [PATCH 02/16] remove router enable/disable as well
---
packages/kit/src/runtime/client/router.js | 81 +++++++++--------------
1 file changed, 31 insertions(+), 50 deletions(-)
diff --git a/packages/kit/src/runtime/client/router.js b/packages/kit/src/runtime/client/router.js
index ef6c5981099d..838c3abad51a 100644
--- a/packages/kit/src/runtime/client/router.js
+++ b/packages/kit/src/runtime/client/router.js
@@ -49,8 +49,6 @@ export class Router {
this.renderer = renderer;
renderer.router = this;
- this.enabled = true;
-
// make it possible to reset focus
document.body.setAttribute('tabindex', '-1');
@@ -152,8 +150,6 @@ export class Router {
/** @param {MouseEvent} event */
addEventListener('click', (event) => {
- if (!this.enabled) return;
-
// Adapted from https://github.com/visionmedia/page.js
// MIT license https://github.com/visionmedia/page.js#license
if (event.button || event.which !== 1) return;
@@ -211,26 +207,26 @@ export class Router {
});
addEventListener('popstate', (event) => {
- if (event.state && this.enabled) {
- // if a popstate-driven navigation is cancelled, we need to counteract it
- // with history.go, which means we end up back here, hence this check
- if (event.state['sveltekit:index'] === this.current_history_index) return;
-
- this._navigate({
- url: new URL(location.href),
- scroll: event.state['sveltekit:scroll'],
- keepfocus: false,
- chain: [],
- details: null,
- accepted: () => {
- this.current_history_index = event.state['sveltekit:index'];
- },
- blocked: () => {
- const delta = this.current_history_index - event.state['sveltekit:index'];
- history.go(delta);
- }
- });
- }
+ if (!event.state) return;
+
+ // if a popstate-driven navigation is cancelled, we need to counteract it
+ // with history.go, which means we end up back here, hence this check
+ if (event.state['sveltekit:index'] === this.current_history_index) return;
+
+ this._navigate({
+ url: new URL(location.href),
+ scroll: event.state['sveltekit:scroll'],
+ keepfocus: false,
+ chain: [],
+ details: null,
+ accepted: () => {
+ this.current_history_index = event.state['sveltekit:index'];
+ },
+ blocked: () => {
+ const delta = this.current_history_index - event.state['sveltekit:index'];
+ history.go(delta);
+ }
+ });
});
}
@@ -273,35 +269,20 @@ export class Router {
) {
const url = new URL(href, get_base_uri(document));
- if (this.enabled) {
- return this._navigate({
- url,
- scroll: noscroll ? scroll_state() : null,
- keepfocus,
- chain,
- details: {
- state,
- replaceState
- },
- accepted: () => {},
- blocked: () => {}
- });
- }
-
- location.href = url.href;
- return new Promise(() => {
- /* never resolves */
+ return this._navigate({
+ url,
+ scroll: noscroll ? scroll_state() : null,
+ keepfocus,
+ chain,
+ details: {
+ state,
+ replaceState
+ },
+ accepted: () => {},
+ blocked: () => {}
});
}
- enable() {
- this.enabled = true;
- }
-
- disable() {
- this.enabled = false;
- }
-
/**
* @param {URL} url
* @returns {Promise}
From 41960f0d7ee1d4c0dceed6057e482bebcc2e2fa7 Mon Sep 17 00:00:00 2001
From: Ben McCann <322311+benmccann@users.noreply.github.com>
Date: Tue, 18 Jan 2022 06:24:34 -0800
Subject: [PATCH 03/16] remove reference to router option in docs
---
documentation/docs/11-page-options.md | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/documentation/docs/11-page-options.md b/documentation/docs/11-page-options.md
index e8e3d16fd018..d9b3297bcb05 100644
--- a/documentation/docs/11-page-options.md
+++ b/documentation/docs/11-page-options.md
@@ -16,7 +16,7 @@ Ordinarily, SvelteKit [hydrates](#appendix-hydration) your server-rendered HTML
```
-> If `hydrate` and `router` are both `false`, SvelteKit will not add any JavaScript to the page at all. If [server-side rendering](#hooks-handle) is disabled in `handle`, `hydrate` must be `true` or no content will be rendered.
+> If `hydrate` is `false`, SvelteKit will not add any JavaScript to the page at all. If [server-side rendering](#hooks-handle) is disabled in `handle`, `hydrate` must be `true` or no content will be rendered.
### prerender
From f540cfcc0f0ed90ed770bff9776fbdc60456e309 Mon Sep 17 00:00:00 2001
From: Ben McCann <322311+benmccann@users.noreply.github.com>
Date: Tue, 18 Jan 2022 06:56:55 -0800
Subject: [PATCH 04/16] remove test for removed feature
---
.../src/routes/no-router/__layout.svelte | 12 -----------
.../apps/basics/src/routes/no-router/a.svelte | 5 -----
.../apps/basics/src/routes/no-router/b.svelte | 1 -
packages/kit/test/apps/basics/test/test.js | 21 -------------------
4 files changed, 39 deletions(-)
delete mode 100644 packages/kit/test/apps/basics/src/routes/no-router/__layout.svelte
delete mode 100644 packages/kit/test/apps/basics/src/routes/no-router/a.svelte
delete mode 100644 packages/kit/test/apps/basics/src/routes/no-router/b.svelte
diff --git a/packages/kit/test/apps/basics/src/routes/no-router/__layout.svelte b/packages/kit/test/apps/basics/src/routes/no-router/__layout.svelte
deleted file mode 100644
index 918af78c5965..000000000000
--- a/packages/kit/test/apps/basics/src/routes/no-router/__layout.svelte
+++ /dev/null
@@ -1,12 +0,0 @@
-
-
-
-
-a
-b
-
-
\ No newline at end of file
diff --git a/packages/kit/test/apps/basics/src/routes/no-router/a.svelte b/packages/kit/test/apps/basics/src/routes/no-router/a.svelte
deleted file mode 100644
index 32bd0fc793a0..000000000000
--- a/packages/kit/test/apps/basics/src/routes/no-router/a.svelte
+++ /dev/null
@@ -1,5 +0,0 @@
-
-
-
a
\ No newline at end of file
diff --git a/packages/kit/test/apps/basics/src/routes/no-router/b.svelte b/packages/kit/test/apps/basics/src/routes/no-router/b.svelte
deleted file mode 100644
index 51902b4da7a6..000000000000
--- a/packages/kit/test/apps/basics/src/routes/no-router/b.svelte
+++ /dev/null
@@ -1 +0,0 @@
-
b
\ No newline at end of file
diff --git a/packages/kit/test/apps/basics/test/test.js b/packages/kit/test/apps/basics/test/test.js
index 469ebe3d9eeb..4aad57ee59a8 100644
--- a/packages/kit/test/apps/basics/test/test.js
+++ b/packages/kit/test/apps/basics/test/test.js
@@ -1140,27 +1140,6 @@ test.describe.parallel('Page options', () => {
}
});
- test('disables router if router=false', async ({ page, clicknav, javaScriptEnabled }) => {
- await page.goto('/no-router/a');
-
- if (javaScriptEnabled) {
- await page.click('button');
- expect(await page.textContent('button')).toBe('clicks: 1');
-
- await Promise.all([page.click('[href="/no-router/b"]'), page.waitForNavigation()]);
- expect(await page.textContent('button')).toBe('clicks: 0');
-
- await page.click('button');
- expect(await page.textContent('button')).toBe('clicks: 1');
-
- await clicknav('[href="/no-router/a"]');
- expect(await page.textContent('button')).toBe('clicks: 1');
-
- await Promise.all([page.click('[href="/no-router/b"]'), page.waitForNavigation()]);
- expect(await page.textContent('button')).toBe('clicks: 0');
- }
- });
-
test('does not SSR page with ssr=false', async ({ page, javaScriptEnabled }) => {
await page.goto('/no-ssr');
From 3b3ba07fd232145b455335fc1eefa744b23820b1 Mon Sep 17 00:00:00 2001
From: Ben McCann <322311+benmccann@users.noreply.github.com>
Date: Tue, 18 Jan 2022 07:15:15 -0800
Subject: [PATCH 05/16] restore app-level config
---
packages/kit/src/runtime/server/page/render.js | 3 ++-
1 file changed, 2 insertions(+), 1 deletion(-)
diff --git a/packages/kit/src/runtime/server/page/render.js b/packages/kit/src/runtime/server/page/render.js
index 5d9180a7154f..b9c29ecc610b 100644
--- a/packages/kit/src/runtime/server/page/render.js
+++ b/packages/kit/src/runtime/server/page/render.js
@@ -151,7 +151,7 @@ export async function render_response({
.map((dep) => `\n\t`)
.join('');
- if (page_config.hydrate) {
+ if (options.router || page_config.hydrate) {
head += Array.from(js)
.map((dep) => `\n\t`)
.join('');
@@ -165,6 +165,7 @@ export async function render_response({
session: ${try_serialize($session, (error) => {
throw new Error(`Failed to serialize session data: ${error.message}`);
})},
+ route: ${!!options.router},
spa: ${!ssr},
trailing_slash: ${s(options.trailing_slash)},
hydrate: ${ssr && page_config.hydrate ? `{
From 403e5a7d571f59b27359fa4ac09aaee9ee3855b6 Mon Sep 17 00:00:00 2001
From: Ben McCann <322311+benmccann@users.noreply.github.com>
Date: Tue, 18 Jan 2022 07:23:05 -0800
Subject: [PATCH 06/16] remove router flag from test
---
.../kit/test/apps/basics/src/routes/no-hydrate/no-js.svelte | 3 +--
1 file changed, 1 insertion(+), 2 deletions(-)
diff --git a/packages/kit/test/apps/basics/src/routes/no-hydrate/no-js.svelte b/packages/kit/test/apps/basics/src/routes/no-hydrate/no-js.svelte
index 00395f4a0d65..ccf689db5e85 100644
--- a/packages/kit/test/apps/basics/src/routes/no-hydrate/no-js.svelte
+++ b/packages/kit/test/apps/basics/src/routes/no-hydrate/no-js.svelte
@@ -1,6 +1,5 @@
-
look ma no javascript
\ No newline at end of file
+
look ma no javascript
From 11cb4b1e7441bd81b59f82b6343519720dc8a5ff Mon Sep 17 00:00:00 2001
From: Ben McCann <322311+benmccann@users.noreply.github.com>
Date: Tue, 18 Jan 2022 09:04:46 -0800
Subject: [PATCH 07/16] move hydrate and router options to handle
---
.changeset/rare-eels-run.md | 2 +-
packages/kit/src/core/build/build_server.js | 2 -
packages/kit/src/core/config/index.spec.js | 4 +-
packages/kit/src/core/config/options.js | 18 +++++++-
packages/kit/src/runtime/server/index.js | 23 +++++++---
packages/kit/src/runtime/server/page/index.js | 6 +--
.../kit/src/runtime/server/page/render.js | 17 ++++---
.../kit/src/runtime/server/page/respond.js | 46 ++++---------------
.../runtime/server/page/respond_with_error.js | 13 +++---
packages/kit/types/hooks.d.ts | 2 +
packages/kit/types/internal.d.ts | 2 -
11 files changed, 67 insertions(+), 68 deletions(-)
diff --git a/.changeset/rare-eels-run.md b/.changeset/rare-eels-run.md
index 94c5fecb9542..469a9efaed60 100644
--- a/.changeset/rare-eels-run.md
+++ b/.changeset/rare-eels-run.md
@@ -2,4 +2,4 @@
'@sveltejs/kit': patch
---
-[breaking] remove per-page `router` option
+[breaking] move `hydrate` and `router` options to `handle`
diff --git a/packages/kit/src/core/build/build_server.js b/packages/kit/src/core/build/build_server.js
index 86a1f3c35dd5..bba6113c0dd9 100644
--- a/packages/kit/src/core/build/build_server.js
+++ b/packages/kit/src/core/build/build_server.js
@@ -68,7 +68,6 @@ export class App {
error.stack = this.options.get_stack(error);
},
hooks,
- hydrate: ${s(config.kit.hydrate)},
manifest,
method_override: ${s(config.kit.methodOverride)},
paths: { base, assets },
@@ -77,7 +76,6 @@ export class App {
read,
root,
service_worker: ${has_service_worker ? "base + '/service-worker.js'" : 'null'},
- router: ${s(config.kit.router)},
target: ${s(config.kit.target)},
template,
trailing_slash: ${s(config.kit.trailingSlash)}
diff --git a/packages/kit/src/core/config/index.spec.js b/packages/kit/src/core/config/index.spec.js
index 636163b9f41d..bdbba0651a29 100644
--- a/packages/kit/src/core/config/index.spec.js
+++ b/packages/kit/src/core/config/index.spec.js
@@ -34,7 +34,7 @@ test('fills in defaults', () => {
protocol: null
},
host: null,
- hydrate: true,
+ hydrate: null,
inlineStyleThreshold: 0,
methodOverride: {
parameter: '_method',
@@ -61,7 +61,7 @@ test('fills in defaults', () => {
pages: undefined
},
protocol: null,
- router: true,
+ router: null,
ssr: null,
target: null,
trailingSlash: 'never'
diff --git a/packages/kit/src/core/config/options.js b/packages/kit/src/core/config/options.js
index 0eaf5e8567e6..3b97ac11f02f 100644
--- a/packages/kit/src/core/config/options.js
+++ b/packages/kit/src/core/config/options.js
@@ -73,7 +73,14 @@ const options = object(
host: string(null),
- hydrate: boolean(true),
+ // TODO remove this for 1.0
+ hydrate: validate(null, (input) => {
+ if (input !== undefined) {
+ throw new Error(
+ 'config.kit.hydrate has been removed — use the handle hook instead: https://kit.svelte.dev/docs#hooks-handle'
+ );
+ }
+ }),
inlineStyleThreshold: number(0),
@@ -181,7 +188,14 @@ const options = object(
protocol: string(null),
- router: boolean(true),
+ // TODO remove this for 1.0
+ router: validate(null, (input) => {
+ if (input !== undefined) {
+ throw new Error(
+ 'config.kit.router has been removed — use the handle hook instead: https://kit.svelte.dev/docs#hooks-handle'
+ );
+ }
+ }),
serviceWorker: object({
register: boolean(true),
diff --git a/packages/kit/src/runtime/server/index.js b/packages/kit/src/runtime/server/index.js
index eaf3d663e78c..c2ba63a32e38 100644
--- a/packages/kit/src/runtime/server/index.js
+++ b/packages/kit/src/runtime/server/index.js
@@ -82,13 +82,19 @@ export async function respond(incoming, options, state = {}) {
print_error('path', 'pathname');
print_error('query', 'searchParams');
- let ssr = true;
+ const resolve_opts = {
+ hydrate: true,
+ router: true,
+ ssr: true
+ };
try {
return await options.hooks.handle({
request,
resolve: async (request, opts) => {
- if (opts && 'ssr' in opts) ssr = /** @type {boolean} */ (opts.ssr);
+ if (opts && 'hydrate' in opts) resolve_opts.hydrate = /** @type {boolean} */ (opts.hydrate);
+ if (opts && 'router' in opts) resolve_opts.router = /** @type {boolean} */ (opts.router);
+ if (opts && 'ssr' in opts) resolve_opts.ssr = /** @type {boolean} */ (opts.ssr);
if (state.prerender && state.prerender.fallback) {
return await render_response({
@@ -97,11 +103,14 @@ export async function respond(incoming, options, state = {}) {
options,
state,
$session: await options.hooks.getSession(request),
- page_config: { hydrate: true },
stuff: {},
status: 200,
branch: [],
- ssr: false
+ resolve_opts: {
+ hydrate: true,
+ router: true,
+ ssr: false
+ }
});
}
@@ -119,7 +128,7 @@ export async function respond(incoming, options, state = {}) {
const response =
route.type === 'endpoint'
? await render_endpoint(request, route, match)
- : await render_page(request, route, match, options, state, ssr);
+ : await render_page(request, route, match, options, state, resolve_opts);
if (response) {
// inject ETags for 200 responses, if the endpoint
@@ -177,7 +186,7 @@ export async function respond(incoming, options, state = {}) {
$session,
status: 404,
error: new Error(`Not found: ${request.url.pathname}`),
- ssr
+ resolve_opts
});
}
}
@@ -196,7 +205,7 @@ export async function respond(incoming, options, state = {}) {
$session,
status: 500,
error,
- ssr
+ resolve_opts
});
} catch (/** @type {unknown} */ e) {
const error = coalesce_to_error(e);
diff --git a/packages/kit/src/runtime/server/page/index.js b/packages/kit/src/runtime/server/page/index.js
index 1359cdb0eadb..1340856e5f04 100644
--- a/packages/kit/src/runtime/server/page/index.js
+++ b/packages/kit/src/runtime/server/page/index.js
@@ -7,10 +7,10 @@ import { respond } from './respond.js';
* @param {RegExpExecArray} match
* @param {import('types/internal').SSRRenderOptions} options
* @param {import('types/internal').SSRRenderState} state
- * @param {boolean} ssr
+ * @param {{ hydrate: boolean, router: boolean, ssr: boolean }} resolve_opts
* @returns {Promise}
*/
-export async function render_page(request, route, match, options, state, ssr) {
+export async function render_page(request, route, match, options, state, resolve_opts) {
if (state.initiator === route) {
// infinite request cycle detected
return {
@@ -31,7 +31,7 @@ export async function render_page(request, route, match, options, state, ssr) {
$session,
route,
params,
- ssr
+ resolve_opts
});
if (response) {
diff --git a/packages/kit/src/runtime/server/page/render.js b/packages/kit/src/runtime/server/page/render.js
index b9c29ecc610b..631f7676c9d0 100644
--- a/packages/kit/src/runtime/server/page/render.js
+++ b/packages/kit/src/runtime/server/page/render.js
@@ -14,12 +14,15 @@ import { create_prerendering_url_proxy } from './utils.js';
* options: import('types/internal').SSRRenderOptions;
* state: import('types/internal').SSRRenderState;
* $session: any;
- * page_config: { hydrate: boolean };
* status: number;
* error?: Error;
* url: URL;
* params: Record;
- * ssr: boolean;
+ * resolve_opts: {
+ * hydrate: boolean;
+ * router: boolean;
+ * ssr: boolean;
+ * }
* stuff: Record;
* }} opts
*/
@@ -28,14 +31,14 @@ export async function render_response({
options,
state,
$session,
- page_config,
status,
error,
url,
params,
- ssr,
+ resolve_opts,
stuff
}) {
+ const { hydrate, ssr } = resolve_opts;
const css = new Set(options.manifest._.entry.css);
const js = new Set(options.manifest._.entry.js);
/** @type {Map} */
@@ -60,7 +63,7 @@ export async function render_response({
if (node.styles) Object.entries(node.styles).forEach(([k, v]) => styles.set(k, v));
// TODO probably better if `fetched` wasn't populated unless `hydrate`
- if (fetched && page_config.hydrate) serialized_data.push(...fetched);
+ if (fetched && hydrate) serialized_data.push(...fetched);
if (uses_credentials) is_private = true;
@@ -151,7 +154,7 @@ export async function render_response({
.map((dep) => `\n\t`)
.join('');
- if (options.router || page_config.hydrate) {
+ if (resolve_opts.router || resolve_opts.hydrate) {
head += Array.from(js)
.map((dep) => `\n\t`)
.join('');
@@ -168,7 +171,7 @@ export async function render_response({
route: ${!!options.router},
spa: ${!ssr},
trailing_slash: ${s(options.trailing_slash)},
- hydrate: ${ssr && page_config.hydrate ? `{
+ hydrate: ${ssr && hydrate ? `{
status: ${status},
error: ${serialize_error(error)},
nodes: [
diff --git a/packages/kit/src/runtime/server/page/respond.js b/packages/kit/src/runtime/server/page/respond.js
index 8c9f506f7406..b42f233b9176 100644
--- a/packages/kit/src/runtime/server/page/respond.js
+++ b/packages/kit/src/runtime/server/page/respond.js
@@ -19,23 +19,24 @@ import { coalesce_to_error } from '../../../utils/error.js';
* $session: any;
* route: import('types/internal').SSRPage;
* params: Record;
- * ssr: boolean;
+ * resolve_opts: {
+ * hydrate: boolean;
+ * router: boolean;
+ * ssr: boolean;
+ * }
* }} opts
* @returns {Promise}
*/
export async function respond(opts) {
- const { request, options, state, $session, route, ssr } = opts;
+ const { request, options, state, $session, route, resolve_opts } = opts;
/** @type {Array} */
let nodes;
- if (!ssr) {
+ if (!resolve_opts.ssr) {
return await render_response({
...opts,
branch: [],
- page_config: {
- hydrate: true
- },
status: 200,
url: request.url,
stuff: {}
@@ -58,15 +59,13 @@ export async function respond(opts) {
$session,
status: 500,
error,
- ssr
+ resolve_opts
});
}
// the leaf node will be present. only layouts may be undefined
const leaf = /** @type {SSRNode} */ (nodes[nodes.length - 1]).module;
- let page_config = get_page_config(leaf, options);
-
if (!leaf.prerender && state.prerender && !state.prerender.all) {
// if the page has `export const prerender = true`, continue,
// otherwise bail out at this point
@@ -90,7 +89,7 @@ export async function respond(opts) {
let stuff = {};
- ssr: if (ssr) {
+ ssr: if (resolve_opts.ssr) {
for (let i = 0; i < nodes.length; i += 1) {
const node = nodes[i];
@@ -168,7 +167,6 @@ export async function respond(opts) {
continue;
}
- page_config = get_page_config(error_node.module, options);
branch = branch.slice(0, j + 1).concat(error_loaded);
stuff = { ...node_loaded.stuff, ...error_loaded.stuff };
break ssr;
@@ -193,7 +191,7 @@ export async function respond(opts) {
$session,
status,
error,
- ssr
+ resolve_opts
}),
set_cookie_headers
);
@@ -215,7 +213,6 @@ export async function respond(opts) {
...opts,
stuff,
url: request.url,
- page_config,
status,
error,
branch: branch.filter(Boolean)
@@ -238,29 +235,6 @@ export async function respond(opts) {
}
}
-/**
- * @param {import('types/internal').SSRComponent} leaf
- * @param {SSRRenderOptions} options
- */
-function get_page_config(leaf, options) {
- // TODO remove for 1.0
- if ('ssr' in leaf) {
- throw new Error(
- '`export const ssr` has been removed — use the `handle` hook instead: https://kit.svelte.dev/docs#hooks-handle'
- );
- }
-
- if ('router' in leaf) {
- throw new Error(
- '`export const router` has been removed — use `beforeNavigate` instead: https://kit.svelte.dev/docs#modules-$app-navigation'
- );
- }
-
- return {
- hydrate: 'hydrate' in leaf ? !!leaf.hydrate : options.hydrate
- };
-}
-
/**
* @param {ServerResponse} response
* @param {string[]} set_cookie_headers
diff --git a/packages/kit/src/runtime/server/page/respond_with_error.js b/packages/kit/src/runtime/server/page/respond_with_error.js
index b2a4c4e1dbaa..7dd6cc180870 100644
--- a/packages/kit/src/runtime/server/page/respond_with_error.js
+++ b/packages/kit/src/runtime/server/page/respond_with_error.js
@@ -16,7 +16,11 @@ import { coalesce_to_error } from '../../../utils/error.js';
* $session: any;
* status: number;
* error: Error;
- * ssr: boolean;
+ * resolve_opts: {
+ * hydrate: boolean;
+ * router: boolean;
+ * ssr: boolean;
+ * }
* }} opts
*/
export async function respond_with_error({
@@ -26,7 +30,7 @@ export async function respond_with_error({
$session,
status,
error,
- ssr
+ resolve_opts
}) {
try {
const default_layout = await options.manifest._.nodes[0](); // 0 is always the root layout
@@ -71,16 +75,13 @@ export async function respond_with_error({
options,
state,
$session,
- page_config: {
- hydrate: options.hydrate
- },
stuff: error_loaded.stuff,
status,
error,
branch: [layout_loaded, error_loaded],
url: request.url,
params,
- ssr
+ resolve_opts
});
} catch (err) {
const error = coalesce_to_error(err);
diff --git a/packages/kit/types/hooks.d.ts b/packages/kit/types/hooks.d.ts
index 3dc01a6afca5..72d13a7b35f9 100644
--- a/packages/kit/types/hooks.d.ts
+++ b/packages/kit/types/hooks.d.ts
@@ -25,6 +25,8 @@ export interface GetSession, Body = unknown, Sessio
export interface ResolveOpts {
ssr?: boolean;
+ hydrate?: boolean;
+ router?: boolean;
}
export interface Handle, Body = unknown> {
diff --git a/packages/kit/types/internal.d.ts b/packages/kit/types/internal.d.ts
index 2d34d85ad43d..ee3d3f1cd2b5 100644
--- a/packages/kit/types/internal.d.ts
+++ b/packages/kit/types/internal.d.ts
@@ -44,8 +44,6 @@ export interface Logger {
}
export interface SSRComponent {
- router?: boolean;
- hydrate?: boolean;
prerender?: boolean;
load: Load;
default: {
From 5a857e091505018c00469d8564eacc97f57b0abc Mon Sep 17 00:00:00 2001
From: Ben McCann <322311+benmccann@users.noreply.github.com>
Date: Tue, 18 Jan 2022 09:15:34 -0800
Subject: [PATCH 08/16] update docs
---
documentation/docs/04-hooks.md | 10 +++++++++-
documentation/docs/11-page-options.md | 12 ------------
documentation/docs/14-configuration.md | 6 ------
3 files changed, 9 insertions(+), 19 deletions(-)
diff --git a/documentation/docs/04-hooks.md b/documentation/docs/04-hooks.md
index 7a3dcec0d897..4afc266a1950 100644
--- a/documentation/docs/04-hooks.md
+++ b/documentation/docs/04-hooks.md
@@ -48,6 +48,8 @@ export interface Response {
}
export interface ResolveOpts {
+ hydrate?: boolean;
+ router?: boolean;
ssr?: boolean;
}
@@ -80,9 +82,13 @@ export async function handle({ request, resolve }) {
You can add call multiple `handle` functions with [the `sequence` helper function](#modules-sveltejs-kit-hooks).
+#### `resolve` options
+
`resolve` also supports a second, optional parameter that gives you more control over how the response will be rendered. That parameter is an object that can have the following fields:
-- `ssr` — specifies whether the page will be loaded and rendered on the server.
+- `hydrate` — specifies whether the code to [hydrate](#appendix-hydration) the page will be included on the page.
+- `router` — specifies whether the code for the [client-side router](#appendix-routing) will be included on the page.
+- `ssr` — specifies whether the page will be loaded and [rendered on the server](#appendix-ssr).
```js
/** @type {import('@sveltejs/kit').Handle} */
@@ -96,6 +102,8 @@ export async function handle({ request, resolve }) {
```
> Disabling [server-side rendering](#appendix-ssr) effectively turns your SvelteKit app into a [**single-page app** or SPA](#appendix-csr-and-spa). In most situations this is not recommended ([see appendix](#appendix-ssr)). Consider whether it's truly appropriate to disable it, and do so selectively rather than for all requests.
+>
+> If `hydrate` is `false`, SvelteKit will not add any JavaScript to the page at all. If `ssr` is disabled, `hydrate` must be `true` or no content will be rendered.
### handleError
diff --git a/documentation/docs/11-page-options.md b/documentation/docs/11-page-options.md
index d9b3297bcb05..5bc26e7608c7 100644
--- a/documentation/docs/11-page-options.md
+++ b/documentation/docs/11-page-options.md
@@ -6,18 +6,6 @@ By default, SvelteKit will render any component first on the server and send it
Note that each of the per-page settings use [`context="module"`](https://svelte.dev/docs#script_context_module), and only apply to page components, _not_ [layout](#layouts) components. If both per-page and per-app settings are specified, the per-page settings override per-app settings in case of conflicts.
-### hydrate
-
-Ordinarily, SvelteKit [hydrates](#appendix-hydration) your server-rendered HTML into an interactive page. Some pages don't require JavaScript at all — many blog posts and 'about' pages fall into this category. In these cases you can skip hydration when the app boots up with the app-wide [`hydrate` config option](#configuration-hydrate) or the page-level `hydrate` export:
-
-```html
-
-```
-
-> If `hydrate` is `false`, SvelteKit will not add any JavaScript to the page at all. If [server-side rendering](#hooks-handle) is disabled in `handle`, `hydrate` must be `true` or no content will be rendered.
-
### prerender
It's likely that at least some pages of your app can be represented as a simple HTML file generated at build time. These pages can be [_prerendered_](#appendix-prerendering) by your [adapter](#adapters).
diff --git a/documentation/docs/14-configuration.md b/documentation/docs/14-configuration.md
index d0f4b010068e..646fee6fc278 100644
--- a/documentation/docs/14-configuration.md
+++ b/documentation/docs/14-configuration.md
@@ -31,7 +31,6 @@ const config = {
protocol: null
},
host: null,
- hydrate: true,
inlineStyleThreshold: 0,
methodOverride: {
parameter: '_method',
@@ -56,7 +55,6 @@ const config = {
onError: 'fail'
},
protocol: null,
- router: true,
serviceWorker: {
register: true,
files: (filepath) => !/\.DS_STORE/.test(filepath)
@@ -224,10 +222,6 @@ See [Prerendering](#page-options-prerender). An object containing zero or more o
The protocol is assumed to be `'https'` (unless you're developing locally without the `--https` flag) unless [`config.kit.headers.protocol`](#configuration-headers) is set. If necessary, you can override it here.
-### router
-
-Enables or disables the client-side [router](#page-options-router) app-wide.
-
### serviceWorker
An object containing zero or more of the following values:
From ccb40fcabbe8ecf54874f23b4b5fab7e79ec090c Mon Sep 17 00:00:00 2001
From: Ben McCann <322311+benmccann@users.noreply.github.com>
Date: Tue, 18 Jan 2022 09:19:15 -0800
Subject: [PATCH 09/16] avoid duplicating type definition
---
packages/kit/src/runtime/server/page/index.js | 2 +-
packages/kit/src/runtime/server/page/render.js | 6 +-----
packages/kit/src/runtime/server/page/respond.js | 6 +-----
packages/kit/src/runtime/server/page/respond_with_error.js | 6 +-----
4 files changed, 4 insertions(+), 16 deletions(-)
diff --git a/packages/kit/src/runtime/server/page/index.js b/packages/kit/src/runtime/server/page/index.js
index 1340856e5f04..ea17f5caf71c 100644
--- a/packages/kit/src/runtime/server/page/index.js
+++ b/packages/kit/src/runtime/server/page/index.js
@@ -7,7 +7,7 @@ import { respond } from './respond.js';
* @param {RegExpExecArray} match
* @param {import('types/internal').SSRRenderOptions} options
* @param {import('types/internal').SSRRenderState} state
- * @param {{ hydrate: boolean, router: boolean, ssr: boolean }} resolve_opts
+ * @param {Required} resolve_opts
* @returns {Promise}
*/
export async function render_page(request, route, match, options, state, resolve_opts) {
diff --git a/packages/kit/src/runtime/server/page/render.js b/packages/kit/src/runtime/server/page/render.js
index 631f7676c9d0..fe3c35480c7e 100644
--- a/packages/kit/src/runtime/server/page/render.js
+++ b/packages/kit/src/runtime/server/page/render.js
@@ -18,11 +18,7 @@ import { create_prerendering_url_proxy } from './utils.js';
* error?: Error;
* url: URL;
* params: Record;
- * resolve_opts: {
- * hydrate: boolean;
- * router: boolean;
- * ssr: boolean;
- * }
+ * resolve_opts: Required;
* stuff: Record;
* }} opts
*/
diff --git a/packages/kit/src/runtime/server/page/respond.js b/packages/kit/src/runtime/server/page/respond.js
index b42f233b9176..b1b5ba2bbbf2 100644
--- a/packages/kit/src/runtime/server/page/respond.js
+++ b/packages/kit/src/runtime/server/page/respond.js
@@ -19,11 +19,7 @@ import { coalesce_to_error } from '../../../utils/error.js';
* $session: any;
* route: import('types/internal').SSRPage;
* params: Record;
- * resolve_opts: {
- * hydrate: boolean;
- * router: boolean;
- * ssr: boolean;
- * }
+ * resolve_opts: Required
* }} opts
* @returns {Promise}
*/
diff --git a/packages/kit/src/runtime/server/page/respond_with_error.js b/packages/kit/src/runtime/server/page/respond_with_error.js
index 7dd6cc180870..87267476714d 100644
--- a/packages/kit/src/runtime/server/page/respond_with_error.js
+++ b/packages/kit/src/runtime/server/page/respond_with_error.js
@@ -16,11 +16,7 @@ import { coalesce_to_error } from '../../../utils/error.js';
* $session: any;
* status: number;
* error: Error;
- * resolve_opts: {
- * hydrate: boolean;
- * router: boolean;
- * ssr: boolean;
- * }
+ * resolve_opts: Required
* }} opts
*/
export async function respond_with_error({
From 91fa588fdc4d41d35c2091895cbef29e150a377c Mon Sep 17 00:00:00 2001
From: Ben McCann <322311+benmccann@users.noreply.github.com>
Date: Tue, 18 Jan 2022 09:24:18 -0800
Subject: [PATCH 10/16] update tests
---
packages/kit/test/apps/basics/src/hooks.js | 6 +++++-
.../kit/test/apps/basics/src/routes/no-hydrate/index.svelte | 2 --
.../kit/test/apps/basics/src/routes/no-hydrate/no-js.svelte | 4 ----
3 files changed, 5 insertions(+), 7 deletions(-)
diff --git a/packages/kit/test/apps/basics/src/hooks.js b/packages/kit/test/apps/basics/src/hooks.js
index d82a0f8379bc..962e127e649a 100644
--- a/packages/kit/test/apps/basics/src/hooks.js
+++ b/packages/kit/test/apps/basics/src/hooks.js
@@ -35,7 +35,11 @@ export const handle = sequence(
throw new Error('Error in handle');
}
- const response = await resolve(request, { ssr: !request.url.pathname.startsWith('/no-ssr') });
+ const response = await resolve(request, {
+ hydrate: request.url.pathname !== '/no-hydrate' && request.url.pathname !== '/no-hydrate/no-js',
+ router: request.url.pathname !== '/no-router/a' && request.url.pathname !== '/no-hydrate/no-js',
+ ssr: !request.url.pathname.startsWith('/no-ssr')
+ });
return {
...response,
diff --git a/packages/kit/test/apps/basics/src/routes/no-hydrate/index.svelte b/packages/kit/test/apps/basics/src/routes/no-hydrate/index.svelte
index 966b9c417a35..87691962dc42 100644
--- a/packages/kit/test/apps/basics/src/routes/no-hydrate/index.svelte
+++ b/packages/kit/test/apps/basics/src/routes/no-hydrate/index.svelte
@@ -1,6 +1,4 @@
-
look ma no javascript
From ef612babacb2131d000da702bbe7ffa5b86d37e7 Mon Sep 17 00:00:00 2001
From: Ben McCann <322311+benmccann@users.noreply.github.com>
Date: Tue, 18 Jan 2022 09:24:31 -0800
Subject: [PATCH 11/16] Revert "remove test for removed feature"
This reverts commit b0c38f2fde047680ce4c2a23e28bdfb53cc543d1.
---
.../src/routes/no-router/__layout.svelte | 12 +++++++++++
.../apps/basics/src/routes/no-router/a.svelte | 5 +++++
.../apps/basics/src/routes/no-router/b.svelte | 1 +
packages/kit/test/apps/basics/test/test.js | 21 +++++++++++++++++++
4 files changed, 39 insertions(+)
create mode 100644 packages/kit/test/apps/basics/src/routes/no-router/__layout.svelte
create mode 100644 packages/kit/test/apps/basics/src/routes/no-router/a.svelte
create mode 100644 packages/kit/test/apps/basics/src/routes/no-router/b.svelte
diff --git a/packages/kit/test/apps/basics/src/routes/no-router/__layout.svelte b/packages/kit/test/apps/basics/src/routes/no-router/__layout.svelte
new file mode 100644
index 000000000000..918af78c5965
--- /dev/null
+++ b/packages/kit/test/apps/basics/src/routes/no-router/__layout.svelte
@@ -0,0 +1,12 @@
+
+
+
+
+a
+b
+
+
\ No newline at end of file
diff --git a/packages/kit/test/apps/basics/src/routes/no-router/a.svelte b/packages/kit/test/apps/basics/src/routes/no-router/a.svelte
new file mode 100644
index 000000000000..32bd0fc793a0
--- /dev/null
+++ b/packages/kit/test/apps/basics/src/routes/no-router/a.svelte
@@ -0,0 +1,5 @@
+
+
+
a
\ No newline at end of file
diff --git a/packages/kit/test/apps/basics/src/routes/no-router/b.svelte b/packages/kit/test/apps/basics/src/routes/no-router/b.svelte
new file mode 100644
index 000000000000..51902b4da7a6
--- /dev/null
+++ b/packages/kit/test/apps/basics/src/routes/no-router/b.svelte
@@ -0,0 +1 @@
+