From 35221c88119b3f74de471d82f4fd76a50ee3db89 Mon Sep 17 00:00:00 2001 From: Simon H <5968653+dummdidumm@users.noreply.github.com> Date: Tue, 4 Jul 2023 21:46:53 +0200 Subject: [PATCH 01/16] fix: claim svg tags in raw mustache tags correctly (#8910) fixes #8904 --- .changeset/curvy-lobsters-decide.md | 5 +++++ packages/svelte/src/runtime/internal/dom.js | 12 +++++------- .../test/hydration/samples/raw-svg/_after.html | 3 +++ .../test/hydration/samples/raw-svg/_before.html | 5 +++++ .../test/hydration/samples/raw-svg/_config.js | 14 ++++++++++++++ .../test/hydration/samples/raw-svg/main.svelte | 1 + .../svelte/test/hydration/samples/raw/_after.html | 2 -- .../svelte/test/hydration/samples/raw/_before.html | 2 ++ .../svelte/test/hydration/samples/raw/_config.js | 2 -- .../svelte/test/hydration/samples/raw/main.svelte | 6 +++++- .../svelte/test/runtime/samples/raw-svg/_config.js | 10 ++++++++++ .../test/runtime/samples/raw-svg/main.svelte | 7 +++++++ 12 files changed, 57 insertions(+), 12 deletions(-) create mode 100644 .changeset/curvy-lobsters-decide.md create mode 100644 packages/svelte/test/hydration/samples/raw-svg/_after.html create mode 100644 packages/svelte/test/hydration/samples/raw-svg/_before.html create mode 100644 packages/svelte/test/hydration/samples/raw-svg/_config.js create mode 100644 packages/svelte/test/hydration/samples/raw-svg/main.svelte create mode 100644 packages/svelte/test/runtime/samples/raw-svg/_config.js create mode 100644 packages/svelte/test/runtime/samples/raw-svg/main.svelte diff --git a/.changeset/curvy-lobsters-decide.md b/.changeset/curvy-lobsters-decide.md new file mode 100644 index 0000000000..64dddab811 --- /dev/null +++ b/.changeset/curvy-lobsters-decide.md @@ -0,0 +1,5 @@ +--- +'svelte': patch +--- + +fix: claim svg tags in raw mustache tags correctly diff --git a/packages/svelte/src/runtime/internal/dom.js b/packages/svelte/src/runtime/internal/dom.js index e1969c5514..57d3b2793e 100644 --- a/packages/svelte/src/runtime/internal/dom.js +++ b/packages/svelte/src/runtime/internal/dom.js @@ -796,7 +796,7 @@ export function claim_html_tag(nodes, is_svg) { const start_index = find_comment(nodes, 'HTML_TAG_START', 0); const end_index = find_comment(nodes, 'HTML_TAG_END', start_index); if (start_index === end_index) { - return new HtmlTagHydration(undefined, is_svg); + return new HtmlTagHydration(is_svg); } init_claim_info(nodes); const html_tag_nodes = nodes.splice(start_index, end_index - start_index + 1); @@ -807,7 +807,7 @@ export function claim_html_tag(nodes, is_svg) { n.claim_order = nodes.claim_info.total_claimed; nodes.claim_info.total_claimed += 1; } - return new HtmlTagHydration(claimed_nodes, is_svg); + return new HtmlTagHydration(is_svg, claimed_nodes); } /** @@ -1134,13 +1134,11 @@ export class HtmlTag { } } -/** - * @extends HtmlTag */ export class HtmlTagHydration extends HtmlTag { - // hydration claimed nodes - /** */ + /** @type {Element[]} hydration claimed nodes */ l = undefined; - constructor(claimed_nodes, is_svg = false) { + + constructor(is_svg = false, claimed_nodes) { super(is_svg); this.e = this.n = null; this.l = claimed_nodes; diff --git a/packages/svelte/test/hydration/samples/raw-svg/_after.html b/packages/svelte/test/hydration/samples/raw-svg/_after.html new file mode 100644 index 0000000000..801d9627cd --- /dev/null +++ b/packages/svelte/test/hydration/samples/raw-svg/_after.html @@ -0,0 +1,3 @@ + + + diff --git a/packages/svelte/test/hydration/samples/raw-svg/_before.html b/packages/svelte/test/hydration/samples/raw-svg/_before.html new file mode 100644 index 0000000000..2a1285938d --- /dev/null +++ b/packages/svelte/test/hydration/samples/raw-svg/_before.html @@ -0,0 +1,5 @@ + + + + + diff --git a/packages/svelte/test/hydration/samples/raw-svg/_config.js b/packages/svelte/test/hydration/samples/raw-svg/_config.js new file mode 100644 index 0000000000..ffcc89e7ff --- /dev/null +++ b/packages/svelte/test/hydration/samples/raw-svg/_config.js @@ -0,0 +1,14 @@ +export default { + snapshot(target) { + const svg = target.querySelector('svg'); + + return { + svg, + circle: svg.querySelector('circle') + }; + }, + test(assert, _, snapshot) { + assert.instanceOf(snapshot.svg, SVGElement); + assert.instanceOf(snapshot.circle, SVGElement); + } +}; diff --git a/packages/svelte/test/hydration/samples/raw-svg/main.svelte b/packages/svelte/test/hydration/samples/raw-svg/main.svelte new file mode 100644 index 0000000000..1b9310e09b --- /dev/null +++ b/packages/svelte/test/hydration/samples/raw-svg/main.svelte @@ -0,0 +1 @@ +{@html ''} \ No newline at end of file diff --git a/packages/svelte/test/hydration/samples/raw/_after.html b/packages/svelte/test/hydration/samples/raw/_after.html index d58c6f9d4d..f465f3094f 100644 --- a/packages/svelte/test/hydration/samples/raw/_after.html +++ b/packages/svelte/test/hydration/samples/raw/_after.html @@ -1,4 +1,2 @@ -

this is some html

and so is this

- diff --git a/packages/svelte/test/hydration/samples/raw/_before.html b/packages/svelte/test/hydration/samples/raw/_before.html index f465f3094f..de20b90f6c 100644 --- a/packages/svelte/test/hydration/samples/raw/_before.html +++ b/packages/svelte/test/hydration/samples/raw/_before.html @@ -1,2 +1,4 @@ +

this is some html

and so is this

+ diff --git a/packages/svelte/test/hydration/samples/raw/_config.js b/packages/svelte/test/hydration/samples/raw/_config.js index 14ba7b12c1..829079d4f0 100644 --- a/packages/svelte/test/hydration/samples/raw/_config.js +++ b/packages/svelte/test/hydration/samples/raw/_config.js @@ -1,6 +1,4 @@ export default { - skip: true, // existing nodes are blown away - props: { raw: '

this is some html

and so is this

' }, diff --git a/packages/svelte/test/hydration/samples/raw/main.svelte b/packages/svelte/test/hydration/samples/raw/main.svelte index 105e9e0581..94278521dd 100644 --- a/packages/svelte/test/hydration/samples/raw/main.svelte +++ b/packages/svelte/test/hydration/samples/raw/main.svelte @@ -1 +1,5 @@ -{@html raw} \ No newline at end of file + + +{@html raw} diff --git a/packages/svelte/test/runtime/samples/raw-svg/_config.js b/packages/svelte/test/runtime/samples/raw-svg/_config.js new file mode 100644 index 0000000000..7744c8bdd1 --- /dev/null +++ b/packages/svelte/test/runtime/samples/raw-svg/_config.js @@ -0,0 +1,10 @@ +export default { + html: '', + + test({ assert, component, target }) { + component.show = true; + assert.equal(target.innerHTML, ''); + assert.instanceOf(target.querySelector('svg'), SVGElement); + assert.instanceOf(target.querySelector('circle'), SVGElement); + } +}; diff --git a/packages/svelte/test/runtime/samples/raw-svg/main.svelte b/packages/svelte/test/runtime/samples/raw-svg/main.svelte new file mode 100644 index 0000000000..248fa9125d --- /dev/null +++ b/packages/svelte/test/runtime/samples/raw-svg/main.svelte @@ -0,0 +1,7 @@ + + +{#if show} + {@html ''} +{/if} From 136aebd8eb265780e8ccea637b698257fe4a6a2f Mon Sep 17 00:00:00 2001 From: Simon H <5968653+dummdidumm@users.noreply.github.com> Date: Tue, 4 Jul 2023 22:41:51 +0200 Subject: [PATCH 02/16] fix: repair invalid raw html content during hydration (#8912) When the HTML that is coming from raw html is invalid, the browser reshuffles things. Bail in that case to try to repair more often. Should help with https://github.com/withastro/astro/issues/7557 --- .changeset/spicy-ladybugs-return.md | 5 ++++ packages/svelte/.prettierignore | 1 + packages/svelte/src/runtime/internal/dom.js | 23 ++++++++----------- .../hydration/samples/raw-repair/_after.html | 2 ++ .../hydration/samples/raw-repair/_before.html | 8 +++++++ .../hydration/samples/raw-repair/inner.svelte | 5 ++++ .../hydration/samples/raw-repair/main.svelte | 7 ++++++ 7 files changed, 38 insertions(+), 13 deletions(-) create mode 100644 .changeset/spicy-ladybugs-return.md create mode 100644 packages/svelte/test/hydration/samples/raw-repair/_after.html create mode 100644 packages/svelte/test/hydration/samples/raw-repair/_before.html create mode 100644 packages/svelte/test/hydration/samples/raw-repair/inner.svelte create mode 100644 packages/svelte/test/hydration/samples/raw-repair/main.svelte diff --git a/.changeset/spicy-ladybugs-return.md b/.changeset/spicy-ladybugs-return.md new file mode 100644 index 0000000000..1b1655e903 --- /dev/null +++ b/.changeset/spicy-ladybugs-return.md @@ -0,0 +1,5 @@ +--- +'svelte': patch +--- + +fix: repair invalid raw html content during hydration diff --git a/packages/svelte/.prettierignore b/packages/svelte/.prettierignore index 3f6fbefc04..fef52b1e8f 100644 --- a/packages/svelte/.prettierignore +++ b/packages/svelte/.prettierignore @@ -16,6 +16,7 @@ sites/svelte.dev/.vercel /test/**/expected* /test/**/_output /test/**/shards/*.test.js +/test/hydration/samples/raw-repair/_after.html /types !rollup.config.js !vitest.config.js diff --git a/packages/svelte/src/runtime/internal/dom.js b/packages/svelte/src/runtime/internal/dom.js index 57d3b2793e..72cb8ab75b 100644 --- a/packages/svelte/src/runtime/internal/dom.js +++ b/packages/svelte/src/runtime/internal/dom.js @@ -777,14 +777,14 @@ export function claim_comment(nodes, data) { ); } -function find_comment(nodes, text, start) { +function get_comment_idx(nodes, text, start) { for (let i = start; i < nodes.length; i += 1) { const node = nodes[i]; if (node.nodeType === 8 /* comment node */ && node.textContent.trim() === text) { return i; } } - return nodes.length; + return -1; } /** @@ -793,11 +793,12 @@ function find_comment(nodes, text, start) { */ export function claim_html_tag(nodes, is_svg) { // find html opening tag - const start_index = find_comment(nodes, 'HTML_TAG_START', 0); - const end_index = find_comment(nodes, 'HTML_TAG_END', start_index); - if (start_index === end_index) { + const start_index = get_comment_idx(nodes, 'HTML_TAG_START', 0); + const end_index = get_comment_idx(nodes, 'HTML_TAG_END', start_index + 1); + if (start_index === -1 || end_index === -1) { return new HtmlTagHydration(is_svg); } + init_claim_info(nodes); const html_tag_nodes = nodes.splice(start_index, end_index - start_index + 1); detach(html_tag_nodes[0]); @@ -1048,17 +1049,13 @@ export class HtmlTag { * @default false */ is_svg = false; - // parent for creating node - /** */ + /** parent for creating node */ e = undefined; - // html tag nodes - /** */ + /** html tag nodes */ n = undefined; - // target - /** */ + /** target */ t = undefined; - // anchor - /** */ + /** anchor */ a = undefined; constructor(is_svg = false) { this.is_svg = is_svg; diff --git a/packages/svelte/test/hydration/samples/raw-repair/_after.html b/packages/svelte/test/hydration/samples/raw-repair/_after.html new file mode 100644 index 0000000000..31cdc12015 --- /dev/null +++ b/packages/svelte/test/hydration/samples/raw-repair/_after.html @@ -0,0 +1,2 @@ +

invalid

+

invalid

\ No newline at end of file diff --git a/packages/svelte/test/hydration/samples/raw-repair/_before.html b/packages/svelte/test/hydration/samples/raw-repair/_before.html new file mode 100644 index 0000000000..fe958bece5 --- /dev/null +++ b/packages/svelte/test/hydration/samples/raw-repair/_before.html @@ -0,0 +1,8 @@ +

+

invalid

+ +

+

+

invalid

+ +

diff --git a/packages/svelte/test/hydration/samples/raw-repair/inner.svelte b/packages/svelte/test/hydration/samples/raw-repair/inner.svelte new file mode 100644 index 0000000000..a2df6c9ded --- /dev/null +++ b/packages/svelte/test/hydration/samples/raw-repair/inner.svelte @@ -0,0 +1,5 @@ + + +

{@html content}

diff --git a/packages/svelte/test/hydration/samples/raw-repair/main.svelte b/packages/svelte/test/hydration/samples/raw-repair/main.svelte new file mode 100644 index 0000000000..41deb9d3e6 --- /dev/null +++ b/packages/svelte/test/hydration/samples/raw-repair/main.svelte @@ -0,0 +1,7 @@ + + + + +

{@html '

invalid

'}

From a12643cbb86e8f99ae2a1fd6068b44e4792a31c9 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Tue, 4 Jul 2023 22:43:20 +0200 Subject: [PATCH 03/16] Version Packages (#8911) Co-authored-by: github-actions[bot] --- .changeset/curvy-lobsters-decide.md | 5 ----- .changeset/spicy-ladybugs-return.md | 5 ----- packages/svelte/CHANGELOG.md | 8 ++++++++ packages/svelte/package.json | 2 +- packages/svelte/src/shared/version.js | 2 +- 5 files changed, 10 insertions(+), 12 deletions(-) delete mode 100644 .changeset/curvy-lobsters-decide.md delete mode 100644 .changeset/spicy-ladybugs-return.md diff --git a/.changeset/curvy-lobsters-decide.md b/.changeset/curvy-lobsters-decide.md deleted file mode 100644 index 64dddab811..0000000000 --- a/.changeset/curvy-lobsters-decide.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'svelte': patch ---- - -fix: claim svg tags in raw mustache tags correctly diff --git a/.changeset/spicy-ladybugs-return.md b/.changeset/spicy-ladybugs-return.md deleted file mode 100644 index 1b1655e903..0000000000 --- a/.changeset/spicy-ladybugs-return.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'svelte': patch ---- - -fix: repair invalid raw html content during hydration diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md index e0881bb865..94dd154174 100644 --- a/packages/svelte/CHANGELOG.md +++ b/packages/svelte/CHANGELOG.md @@ -1,5 +1,13 @@ # svelte +## 4.0.4 + +### Patch Changes + +- fix: claim svg tags in raw mustache tags correctly ([#8910](https://github.com/sveltejs/svelte/pull/8910)) + +- fix: repair invalid raw html content during hydration ([#8912](https://github.com/sveltejs/svelte/pull/8912)) + ## 4.0.3 ### Patch Changes diff --git a/packages/svelte/package.json b/packages/svelte/package.json index cc4060a9a8..d65541b130 100644 --- a/packages/svelte/package.json +++ b/packages/svelte/package.json @@ -1,6 +1,6 @@ { "name": "svelte", - "version": "4.0.3", + "version": "4.0.4", "description": "Cybernetically enhanced web apps", "type": "module", "module": "src/runtime/index.js", diff --git a/packages/svelte/src/shared/version.js b/packages/svelte/src/shared/version.js index 7279358a14..e286ec644f 100644 --- a/packages/svelte/src/shared/version.js +++ b/packages/svelte/src/shared/version.js @@ -6,5 +6,5 @@ * https://svelte.dev/docs/svelte-compiler#svelte-version * @type {string} */ -export const VERSION = '4.0.3'; +export const VERSION = '4.0.4'; export const PUBLIC_VERSION = '4'; From f80d4914a67f3ec2e25d422b623908ef86f2f14b Mon Sep 17 00:00:00 2001 From: Ben McCann <322311+benmccann@users.noreply.github.com> Date: Tue, 4 Jul 2023 23:52:06 -0700 Subject: [PATCH 04/16] site: add a robots.txt (#8913) --- sites/svelte.dev/static/robots.txt | 2 ++ 1 file changed, 2 insertions(+) create mode 100644 sites/svelte.dev/static/robots.txt diff --git a/sites/svelte.dev/static/robots.txt b/sites/svelte.dev/static/robots.txt new file mode 100644 index 0000000000..eb0536286f --- /dev/null +++ b/sites/svelte.dev/static/robots.txt @@ -0,0 +1,2 @@ +User-agent: * +Disallow: From 2d6dacdb4c028c927f8e544293b487f9991b65b7 Mon Sep 17 00:00:00 2001 From: Puru Vijay Date: Wed, 5 Jul 2023 12:41:47 +0530 Subject: [PATCH 05/16] chore: REPL 0.5.0-next.11 --- pnpm-lock.yaml | 18 ++++-- sites/svelte.dev/package.json | 116 +++++++++++++++++----------------- 2 files changed, 69 insertions(+), 65 deletions(-) diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 3abc8ed214..da78071c69 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -157,8 +157,8 @@ importers: specifier: ^2.26.0 version: 2.26.0 '@sveltejs/repl': - specifier: 0.5.0-next.10 - version: 0.5.0-next.10(@codemirror/lang-html@6.4.5)(@codemirror/search@6.5.0)(@lezer/common@1.0.3)(@lezer/javascript@1.4.3)(@lezer/lr@1.3.7)(@sveltejs/kit@1.21.0)(svelte@packages+svelte) + specifier: 0.5.0-next.11 + version: 0.5.0-next.11(@codemirror/lang-html@6.4.5)(@codemirror/search@6.5.0)(@lezer/common@1.0.3)(@lezer/javascript@1.4.3)(@lezer/lr@1.3.7)(@sveltejs/kit@1.21.0)(svelte@packages+svelte) cookie: specifier: ^0.5.0 version: 0.5.0 @@ -1749,8 +1749,8 @@ packages: transitivePeerDependencies: - supports-color - /@sveltejs/repl@0.5.0-next.10(@codemirror/lang-html@6.4.5)(@codemirror/search@6.5.0)(@lezer/common@1.0.3)(@lezer/javascript@1.4.3)(@lezer/lr@1.3.7)(@sveltejs/kit@1.21.0)(svelte@packages+svelte): - resolution: {integrity: sha512-Y167w5wExssjloafIeLeTCzN9Vh22Sg/DgE4ARfw4J/5VVkEkEINVBbHalpjDMHhXnvOejnbNCJEw0TYW2lN4A==} + /@sveltejs/repl@0.5.0-next.11(@codemirror/lang-html@6.4.5)(@codemirror/search@6.5.0)(@lezer/common@1.0.3)(@lezer/javascript@1.4.3)(@lezer/lr@1.3.7)(@sveltejs/kit@1.21.0)(svelte@packages+svelte): + resolution: {integrity: sha512-bZ7WmmwwujhO1b1r7hN5Lt4z/Y4J3Bfx1DHiITOLshHTPgEU9XNOdq2JzSmN4DIWhmU0T/OVZ53XyXpaR1KTWA==} peerDependencies: svelte: ^3.54.0 || ^4.0.0-next.0 || ^4.0.0 dependencies: @@ -1778,7 +1778,7 @@ packages: marked: 5.1.0 resolve.exports: 2.0.2 svelte: link:packages/svelte - svelte-json-tree: 1.0.0 + svelte-json-tree: 2.1.0(svelte@packages+svelte) transitivePeerDependencies: - '@codemirror/lang-html' - '@codemirror/search' @@ -5997,8 +5997,12 @@ packages: dependencies: svelte: link:packages/svelte - /svelte-json-tree@1.0.0: - resolution: {integrity: sha512-scs1OdkC8uFpTN4MX0yKkOzZ1/EG3eP1ARC+xcFthXp2IfcwBaXgab0FqA4Am0vQwffNNB+1Gd1LFkJBlynWTA==} + /svelte-json-tree@2.1.0(svelte@packages+svelte): + resolution: {integrity: sha512-IAU//hE5bIA0SoM9AuP7xOoD9PUcMh4fio0oI52r0XJ7iNDytW7AnBdkIn1QSYLUyWzvQX3tp59JfLYfhd7lTw==} + peerDependencies: + svelte: ^4.0.0 + dependencies: + svelte: link:packages/svelte dev: false /svelte-local-storage-store@0.4.0(svelte@packages+svelte): diff --git a/sites/svelte.dev/package.json b/sites/svelte.dev/package.json index 17b7ae599c..9994843b61 100644 --- a/sites/svelte.dev/package.json +++ b/sites/svelte.dev/package.json @@ -1,60 +1,60 @@ { - "name": "svelte.dev", - "private": true, - "version": "1.0.0", - "description": "Docs and examples for Svelte", - "type": "module", - "scripts": { - "dev": "node scripts/update.js && pnpm run generate && vite dev", - "build": "node scripts/update.js && pnpm run generate && vite build", - "generate": "node scripts/type-gen/index.js && node scripts/generate_examples.js", - "update": "node scripts/update.js --force=true", - "preview": "vite preview", - "start": "node build", - "check": "node scripts/update.js && pnpm generate && svelte-kit sync && svelte-check", - "check:watch": "svelte-kit sync && svelte-check --watch", - "format": "pnpm run check:format -- --write", - "check:format": "prettier --check . --ignore-path .gitignore --plugin-search-dir=." - }, - "dependencies": { - "@jridgewell/sourcemap-codec": "^1.4.15", - "@supabase/supabase-js": "^2.26.0", - "@sveltejs/repl": "0.5.0-next.10", - "cookie": "^0.5.0", - "devalue": "^4.3.2", - "do-not-zip": "^1.0.0", - "flexsearch": "^0.7.31", - "flru": "^1.0.2" - }, - "devDependencies": { - "@resvg/resvg-js": "^2.4.1", - "@sveltejs/adapter-vercel": "^3.0.1", - "@sveltejs/kit": "^1.21.0", - "@sveltejs/site-kit": "6.0.0-next.18", - "@sveltejs/vite-plugin-svelte": "^2.4.2", - "@types/marked": "^5.0.0", - "@types/node": "^20.3.2", - "@types/prettier": "^2.7.3", - "degit": "^2.8.4", - "dotenv": "^16.3.1", - "jimp": "^0.22.8", - "magic-string": "^0.30.0", - "marked": "^5.1.0", - "node-fetch": "^3.3.1", - "prettier": "^2.8.8", - "prettier-plugin-svelte": "^2.10.1", - "sass": "^1.63.6", - "satori": "^0.10.1", - "satori-html": "^0.3.2", - "shelljs": "^0.8.5", - "shiki": "^0.14.3", - "shiki-twoslash": "^3.1.2", - "svelte": "workspace:*", - "svelte-check": "^3.4.4", - "svelte-preprocess": "^5.0.4", - "tiny-glob": "^0.2.9", - "typescript": "^5.1.6", - "vite": "^4.3.9", - "vite-imagetools": "^5.0.4" - } + "name": "svelte.dev", + "private": true, + "version": "1.0.0", + "description": "Docs and examples for Svelte", + "type": "module", + "scripts": { + "dev": "node scripts/update.js && pnpm run generate && vite dev", + "build": "node scripts/update.js && pnpm run generate && vite build", + "generate": "node scripts/type-gen/index.js && node scripts/generate_examples.js", + "update": "node scripts/update.js --force=true", + "preview": "vite preview", + "start": "node build", + "check": "node scripts/update.js && pnpm generate && svelte-kit sync && svelte-check", + "check:watch": "svelte-kit sync && svelte-check --watch", + "format": "pnpm run check:format -- --write", + "check:format": "prettier --check . --ignore-path .gitignore --plugin-search-dir=." + }, + "dependencies": { + "@jridgewell/sourcemap-codec": "^1.4.15", + "@supabase/supabase-js": "^2.26.0", + "@sveltejs/repl": "0.5.0-next.11", + "cookie": "^0.5.0", + "devalue": "^4.3.2", + "do-not-zip": "^1.0.0", + "flexsearch": "^0.7.31", + "flru": "^1.0.2" + }, + "devDependencies": { + "@resvg/resvg-js": "^2.4.1", + "@sveltejs/adapter-vercel": "^3.0.1", + "@sveltejs/kit": "^1.21.0", + "@sveltejs/site-kit": "6.0.0-next.18", + "@sveltejs/vite-plugin-svelte": "^2.4.2", + "@types/marked": "^5.0.0", + "@types/node": "^20.3.2", + "@types/prettier": "^2.7.3", + "degit": "^2.8.4", + "dotenv": "^16.3.1", + "jimp": "^0.22.8", + "magic-string": "^0.30.0", + "marked": "^5.1.0", + "node-fetch": "^3.3.1", + "prettier": "^2.8.8", + "prettier-plugin-svelte": "^2.10.1", + "sass": "^1.63.6", + "satori": "^0.10.1", + "satori-html": "^0.3.2", + "shelljs": "^0.8.5", + "shiki": "^0.14.3", + "shiki-twoslash": "^3.1.2", + "svelte": "workspace:*", + "svelte-check": "^3.4.4", + "svelte-preprocess": "^5.0.4", + "tiny-glob": "^0.2.9", + "typescript": "^5.1.6", + "vite": "^4.3.9", + "vite-imagetools": "^5.0.4" + } } From d516bb06e10b27d3de8641ae2f93b01fe21461e0 Mon Sep 17 00:00:00 2001 From: Simon Holthausen Date: Wed, 5 Jul 2023 11:06:11 +0200 Subject: [PATCH 06/16] docs: add eslint migration --- documentation/docs/05-misc/04-v4-migration-guide.md | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/documentation/docs/05-misc/04-v4-migration-guide.md b/documentation/docs/05-misc/04-v4-migration-guide.md index cbde43c6f6..4b634a978e 100644 --- a/documentation/docs/05-misc/04-v4-migration-guide.md +++ b/documentation/docs/05-misc/04-v4-migration-guide.md @@ -159,6 +159,10 @@ This makes slot bindings more consistent as the behavior is undefined when for e The order in which preprocessors are applied has changed. Now, preprocessors are executed in order, and within one group, the order is markup, script, style. Each preprocessor must also have a name. ([#8618](https://github.com/sveltejs/svelte/issues/8618)) +## New eslint package + +`eslint-plugin-svelte3` is deprecated. It may still work with Svelte 4 but we make no guarantees about that. We recommend switching to our new package [eslint-plugin-svelte](https://github.com/sveltejs/eslint-plugin-svelte). See [this Github post](https://github.com/sveltejs/kit/issues/10242#issuecomment-1610798405) for an instruction how to migrate. Alternatively, you can create a new project using `npm create svelte@latest`, select the eslint (and possibly TypeScript) option and then copy over the related files into your existing project. + ## Other breaking changes - the `inert` attribute is now applied to outroing elements to make them invisible to assistive technology and prevent interaction. ([#8628](https://github.com/sveltejs/svelte/pull/8628)) From bb5d3948edead11ec5bd4be25b5108452c087a43 Mon Sep 17 00:00:00 2001 From: Alex Morgan <59708992+chhotii-alex@users.noreply.github.com> Date: Wed, 5 Jul 2023 10:12:59 -0400 Subject: [PATCH 07/16] docs: matches hint with existing structure and solution (#8915) --- documentation/tutorial/10-transitions/09-key-blocks/text.md | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/documentation/tutorial/10-transitions/09-key-blocks/text.md b/documentation/tutorial/10-transitions/09-key-blocks/text.md index 7a2e6eaca7..d0d9163d0d 100644 --- a/documentation/tutorial/10-transitions/09-key-blocks/text.md +++ b/documentation/tutorial/10-transitions/09-key-blocks/text.md @@ -5,8 +5,10 @@ title: Key blocks Key blocks destroy and recreate their contents when the value of an expression changes. ```svelte -{#key value} -
{value}
+{#key number} + + {number} + {/key} ``` From 0a2732a2b0be45121b772f8de5e271439e3bd888 Mon Sep 17 00:00:00 2001 From: "Lyu, Wei-Da" <36730922+jasonlyu123@users.noreply.github.com> Date: Thu, 6 Jul 2023 17:38:24 +0800 Subject: [PATCH 08/16] fix: generate type definition with nullable types (#8924) This results in `undefined` and `null` being added explicitly in places which is crucial in some situations --- .changeset/funny-bags-occur.md | 5 +++++ packages/svelte/scripts/generate-dts.js | 3 +++ 2 files changed, 8 insertions(+) create mode 100644 .changeset/funny-bags-occur.md diff --git a/.changeset/funny-bags-occur.md b/.changeset/funny-bags-occur.md new file mode 100644 index 0000000000..81f89bcd0f --- /dev/null +++ b/.changeset/funny-bags-occur.md @@ -0,0 +1,5 @@ +--- +'svelte': patch +--- + +fix: generate type definition with nullable types diff --git a/packages/svelte/scripts/generate-dts.js b/packages/svelte/scripts/generate-dts.js index fe4b70e09a..0ecf7127df 100644 --- a/packages/svelte/scripts/generate-dts.js +++ b/packages/svelte/scripts/generate-dts.js @@ -16,6 +16,9 @@ fs.writeFileSync('./types/compiler/interfaces.d.ts', `import '../index.js';`); await createBundle({ output: 'types/index.d.ts', + compilerOptions: { + strict: true + }, modules: { svelte: 'src/runtime/public.d.ts', 'svelte/compiler': 'src/compiler/public.d.ts', From 76baa078792f52df53ea302042c397cb84403f48 Mon Sep 17 00:00:00 2001 From: Puru Vijay <47742487+PuruVJ@users.noreply.github.com> Date: Thu, 6 Jul 2023 17:48:10 +0530 Subject: [PATCH 09/16] feat: On this page mobile (#8782) --- pnpm-lock.yaml | 12 ++++++------ sites/svelte.dev/package.json | 2 +- sites/svelte.dev/src/routes/docs/+layout.svelte | 1 - sites/svelte.dev/src/routes/docs/[slug]/+page.svelte | 4 ++-- 4 files changed, 9 insertions(+), 10 deletions(-) diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index da78071c69..e641f90334 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -185,8 +185,8 @@ importers: specifier: ^1.21.0 version: 1.21.0(svelte@packages+svelte)(vite@4.3.9) '@sveltejs/site-kit': - specifier: 6.0.0-next.18 - version: 6.0.0-next.18(@sveltejs/kit@1.21.0)(svelte@packages+svelte) + specifier: 6.0.0-next.20 + version: 6.0.0-next.20(@sveltejs/kit@1.21.0)(svelte@packages+svelte) '@sveltejs/vite-plugin-svelte': specifier: ^2.4.2 version: 2.4.2(svelte@packages+svelte)(vite@4.3.9) @@ -1800,11 +1800,11 @@ packages: svelte-local-storage-store: 0.4.0(svelte@packages+svelte) dev: false - /@sveltejs/site-kit@6.0.0-next.18(@sveltejs/kit@1.21.0)(svelte@packages+svelte): - resolution: {integrity: sha512-8uWjP61UAkCqWf9UuQQWSCpyPNk4cqnGaQozjIr3sGbQnauTQDiS4K8AxqyBSyphEIrhxd68iYMEFQDQVAHjcg==} + /@sveltejs/site-kit@6.0.0-next.20(@sveltejs/kit@1.21.0)(svelte@packages+svelte): + resolution: {integrity: sha512-tWT/pKdCFxY+Wsayoj287AcNOYsm0EW5fiOsSSVseEK+62R1KcWHcioSgm1Fk12HOUgFcYnskaJ9JOo+p7+9/w==} peerDependencies: - '@sveltejs/kit': ^1.0.0 - svelte: ^3.54.0 || ^4.0.0-next.1 || ^4.0.0 + '@sveltejs/kit': ^1.20.0 + svelte: ^4.0.0 dependencies: '@sveltejs/kit': 1.21.0(svelte@packages+svelte)(vite@4.3.9) esm-env: 1.0.0 diff --git a/sites/svelte.dev/package.json b/sites/svelte.dev/package.json index 9994843b61..05abbd4b53 100644 --- a/sites/svelte.dev/package.json +++ b/sites/svelte.dev/package.json @@ -30,7 +30,7 @@ "@resvg/resvg-js": "^2.4.1", "@sveltejs/adapter-vercel": "^3.0.1", "@sveltejs/kit": "^1.21.0", - "@sveltejs/site-kit": "6.0.0-next.18", + "@sveltejs/site-kit": "6.0.0-next.20", "@sveltejs/vite-plugin-svelte": "^2.4.2", "@types/marked": "^5.0.0", "@types/node": "^20.3.2", diff --git a/sites/svelte.dev/src/routes/docs/+layout.svelte b/sites/svelte.dev/src/routes/docs/+layout.svelte index cee570c006..55ced57717 100644 --- a/sites/svelte.dev/src/routes/docs/+layout.svelte +++ b/sites/svelte.dev/src/routes/docs/+layout.svelte @@ -32,7 +32,6 @@ } .page { - --on-this-page-display: none; padding: var(--sk-page-padding-top) var(--sk-page-padding-side); min-width: 0 !important; diff --git a/sites/svelte.dev/src/routes/docs/[slug]/+page.svelte b/sites/svelte.dev/src/routes/docs/[slug]/+page.svelte index a052bfd5ab..1bdcbccc40 100644 --- a/sites/svelte.dev/src/routes/docs/[slug]/+page.svelte +++ b/sites/svelte.dev/src/routes/docs/[slug]/+page.svelte @@ -29,6 +29,8 @@ Edit this page on GitHub + + {@html data.page.content} @@ -49,8 +51,6 @@ - - diff --git a/documentation/examples/21-miscellaneous/01-hacker-news/Summary.svelte b/documentation/examples/21-miscellaneous/01-hacker-news/Summary.svelte index e4e1c9eef6..360d2181b6 100644 --- a/documentation/examples/21-miscellaneous/01-hacker-news/Summary.svelte +++ b/documentation/examples/21-miscellaneous/01-hacker-news/Summary.svelte @@ -33,8 +33,4 @@ position: absolute; left: 0; } - - a { - color: #333; - } From a23fcc0f67fcca2d074738f8cb8fd44ced8b51da Mon Sep 17 00:00:00 2001 From: Tan Li Hau Date: Fri, 7 Jul 2023 00:12:40 +0800 Subject: [PATCH 13/16] docs: choose a color that looks great on both dark and light theme (#8921) --- documentation/examples/12-svg/03-area-chart/App.svelte | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/documentation/examples/12-svg/03-area-chart/App.svelte b/documentation/examples/12-svg/03-area-chart/App.svelte index 2e11ee61c6..fb79b04878 100644 --- a/documentation/examples/12-svg/03-area-chart/App.svelte +++ b/documentation/examples/12-svg/03-area-chart/App.svelte @@ -86,12 +86,12 @@ } .tick line { - stroke: #aaa; + stroke: #888; stroke-dasharray: 2; } .tick text { - fill: #666; + fill: #888; text-anchor: start; } From daba0fc9d2858e744f428f4acb7575eaa57fe76f Mon Sep 17 00:00:00 2001 From: Tan Li Hau Date: Fri, 7 Jul 2023 00:13:33 +0800 Subject: [PATCH 14/16] docs: fix contrast for component-binding example (#8920) --- .../12-component-bindings/App.svelte | 17 ++++++++++++++++- 1 file changed, 16 insertions(+), 1 deletion(-) diff --git a/documentation/examples/05-bindings/12-component-bindings/App.svelte b/documentation/examples/05-bindings/12-component-bindings/App.svelte index b3666f891d..254ced9464 100644 --- a/documentation/examples/05-bindings/12-component-bindings/App.svelte +++ b/documentation/examples/05-bindings/12-component-bindings/App.svelte @@ -9,6 +9,21 @@ } -

{view}

+

{view}

+ + From 3ff0084dc3760cf763a9a79090b85ae657ead509 Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Thu, 6 Jul 2023 18:14:27 +0200 Subject: [PATCH 15/16] Version Packages (#8925) Co-authored-by: github-actions[bot] --- .changeset/funny-bags-occur.md | 5 ----- packages/svelte/CHANGELOG.md | 6 ++++++ packages/svelte/package.json | 2 +- packages/svelte/src/shared/version.js | 2 +- 4 files changed, 8 insertions(+), 7 deletions(-) delete mode 100644 .changeset/funny-bags-occur.md diff --git a/.changeset/funny-bags-occur.md b/.changeset/funny-bags-occur.md deleted file mode 100644 index 81f89bcd0f..0000000000 --- a/.changeset/funny-bags-occur.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'svelte': patch ---- - -fix: generate type definition with nullable types diff --git a/packages/svelte/CHANGELOG.md b/packages/svelte/CHANGELOG.md index 94dd154174..2b76f02650 100644 --- a/packages/svelte/CHANGELOG.md +++ b/packages/svelte/CHANGELOG.md @@ -1,5 +1,11 @@ # svelte +## 4.0.5 + +### Patch Changes + +- fix: generate type definition with nullable types ([#8924](https://github.com/sveltejs/svelte/pull/8924)) + ## 4.0.4 ### Patch Changes diff --git a/packages/svelte/package.json b/packages/svelte/package.json index d65541b130..1eb61e93c7 100644 --- a/packages/svelte/package.json +++ b/packages/svelte/package.json @@ -1,6 +1,6 @@ { "name": "svelte", - "version": "4.0.4", + "version": "4.0.5", "description": "Cybernetically enhanced web apps", "type": "module", "module": "src/runtime/index.js", diff --git a/packages/svelte/src/shared/version.js b/packages/svelte/src/shared/version.js index e286ec644f..a9675ed742 100644 --- a/packages/svelte/src/shared/version.js +++ b/packages/svelte/src/shared/version.js @@ -6,5 +6,5 @@ * https://svelte.dev/docs/svelte-compiler#svelte-version * @type {string} */ -export const VERSION = '4.0.4'; +export const VERSION = '4.0.5'; export const PUBLIC_VERSION = '4'; From 828276f06babce9d0a4d9fc57e1a7d024c469d99 Mon Sep 17 00:00:00 2001 From: Puru Vijay <47742487+PuruVJ@users.noreply.github.com> Date: Fri, 7 Jul 2023 17:39:10 +0530 Subject: [PATCH 16/16] chore: Skip playwright instaling browsers (#8935) * Push * try npmrc route * Rootnpmrc * Add command to install chromium for running tests --- .npmrc | 1 + CONTRIBUTING.md | 2 ++ 2 files changed, 3 insertions(+) create mode 100644 .npmrc diff --git a/.npmrc b/.npmrc new file mode 100644 index 0000000000..33484750d0 --- /dev/null +++ b/.npmrc @@ -0,0 +1 @@ +playwright_skip_browser_download=1 \ No newline at end of file diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index f7896b86c8..8c66b30ebf 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -97,6 +97,8 @@ Test samples are kept in `/test/xxx/samples` folder. #### Running tests +> PREREQUISITE: Install chromium via playwright by running `pnpm playwright install chromium` + 1. To run test, run `pnpm test`. 1. To run test for a specific feature, you can use the `-g` (aka `--grep`) option. For example, to only run test involving transitions, run `pnpm test -- -g transition`.