msb-public
/
svelte
mirror of https://github.com/sveltejs/svelte
1
0
Code Issues Projects Releases Wiki Activity

Merge branch 'main' into svelte-html

Browse Source
svelte-html
Simon Holthausen 9 months ago
parent eb7a516770 88a15cd706
commit a0b2c011de
27 changed files with 1047 additions and 149 deletions
Show Stats Download Patch File Download Diff File

2
documentation/docs/99-legacy/30-legacy-svelte-component.md
Unescape View File

@ -2,7 +2,7 @@
title: <svelte:component> title: <svelte:component>
--- ---
In runes mode, `<MyComponent>` will re-render if the value of `MyComponent` changes. In runes mode, `<MyComponent>` will re-render if the value of `MyComponent` changes. See the [Svelte 5 migration guide](/docs/svelte/v5-migration-guide#Breaking-changes-in-runes-mode-svelte:component-is-no-longer-necessary) for an example.
In legacy mode, it won't — we must use `<svelte:component>`, which destroys and recreates the component instance when the value of its `this` expression changes: In legacy mode, it won't — we must use `<svelte:component>`, which destroys and recreates the component instance when the value of its `this` expression changes:

30
packages/svelte/CHANGELOG.md
Unescape View File

@ -1,5 +1,35 @@
# svelte # svelte
## 5.14.4
### Patch Changes
- fix: remove implements from class declarations ([#14749](https://github.com/sveltejs/svelte/pull/14749))
- fix: remove unwanted properties from both replaced and unreplaced nodes ([#14744](https://github.com/sveltejs/svelte/pull/14744))
## 5.14.3
### Patch Changes
- fix: bump esrap, prevent malformed AST ([#14742](https://github.com/sveltejs/svelte/pull/14742))
- fix: compare array contents for equality mismatch detections, not the arrays themselves ([#14738](https://github.com/sveltejs/svelte/pull/14738))
## 5.14.2
### Patch Changes
- fix: correctly highlight first rerun of `$inspect.trace` ([#14734](https://github.com/sveltejs/svelte/pull/14734))
- chore: more loose parser improvements ([#14733](https://github.com/sveltejs/svelte/pull/14733))
## 5.14.1
### Patch Changes
- fix: improve unowned derived performance ([#14724](https://github.com/sveltejs/svelte/pull/14724))
## 5.14.0 ## 5.14.0
### Minor Changes ### Minor Changes

4
packages/svelte/package.json
Unescape View File

@ -2,7 +2,7 @@
"name": "svelte", "name": "svelte",
"description": "Cybernetically enhanced web apps", "description": "Cybernetically enhanced web apps",
"license": "MIT", "license": "MIT",
"version": "5.14.0", "version": "5.14.4",
"type": "module", "type": "module",
"types": "./types/index.d.ts", "types": "./types/index.d.ts",
"engines": { "engines": {
@ -147,7 +147,7 @@
"aria-query": "^5.3.1", "aria-query": "^5.3.1",
"axobject-query": "^4.1.0", "axobject-query": "^4.1.0",
"esm-env": "^1.2.1", "esm-env": "^1.2.1",
"esrap": "^1.2.3", "esrap": "^1.3.1",
"is-reference": "^3.0.3", "is-reference": "^3.0.3",
"locate-character": "^3.0.0", "locate-character": "^3.0.0",
"magic-string": "^0.30.11", "magic-string": "^0.30.11",

5
packages/svelte/src/compiler/phases/1-parse/read/expression.js
Unescape View File

@ -7,9 +7,10 @@ import { find_matching_bracket } from '../utils/bracket.js';
/** /**
* @param {Parser} parser * @param {Parser} parser
* @param {string} [opening_token]
* @returns {Expression} * @returns {Expression}
*/ */
export default function read_expression(parser) { export default function read_expression(parser, opening_token) {
try { try {
const node = parse_expression_at(parser.template, parser.ts, parser.index); const node = parse_expression_at(parser.template, parser.ts, parser.index);
@ -42,7 +43,7 @@ export default function read_expression(parser) {
} catch (err) { } catch (err) {
if (parser.loose) { if (parser.loose) {
// Find the next } and treat it as the end of the expression // Find the next } and treat it as the end of the expression
const end = find_matching_bracket(parser.template, parser.index, '{'); const end = find_matching_bracket(parser.template, parser.index, opening_token ?? '{');
if (end) { if (end) {
const start = parser.index; const start = parser.index;
parser.index = end; parser.index = end;

22
packages/svelte/src/compiler/phases/1-parse/remove_typescript_nodes.js
Unescape View File

@ -17,6 +17,16 @@ function remove_this_param(node, context) {
/** @type {Visitors<any, null>} */ /** @type {Visitors<any, null>} */
const visitors = { const visitors = {
_(node, context) {
const n = context.next() ?? node;
// TODO there may come a time when we decide to preserve type annotations.
// until that day comes, we just delete them so they don't confuse esrap
delete n.typeAnnotation;
delete n.typeParameters;
delete n.returnType;
delete n.accessibility;
},
Decorator(node) { Decorator(node) {
e.typescript_invalid_feature(node, 'decorators (related TSC proposal is not stage 4 yet)'); e.typescript_invalid_feature(node, 'decorators (related TSC proposal is not stage 4 yet)');
}, },
@ -78,23 +88,12 @@ const visitors = {
TSNonNullExpression(node, context) { TSNonNullExpression(node, context) {
return context.visit(node.expression); return context.visit(node.expression);
}, },
TSTypeAnnotation() {
// This isn't correct, strictly speaking, and could result in invalid ASTs (like an empty statement within function parameters),
// but esrap, our printing tool, just ignores these AST nodes at invalid positions, so it's fine
return b.empty;
},
TSInterfaceDeclaration() { TSInterfaceDeclaration() {
return b.empty; return b.empty;
}, },
TSTypeAliasDeclaration() { TSTypeAliasDeclaration() {
return b.empty; return b.empty;
}, },
TSTypeParameterDeclaration() {
return b.empty;
},
TSTypeParameterInstantiation() {
return b.empty;
},
TSEnumDeclaration(node) { TSEnumDeclaration(node) {
e.typescript_invalid_feature(node, 'enums'); e.typescript_invalid_feature(node, 'enums');
}, },
@ -116,6 +115,7 @@ const visitors = {
if (node.declare) { if (node.declare) {
return b.empty; return b.empty;
} }
delete node.implements;
return context.next(); return context.next();
}, },
VariableDeclaration(node, context) { VariableDeclaration(node, context) {

5
packages/svelte/src/compiler/phases/1-parse/state/element.js
Unescape View File

@ -124,9 +124,12 @@ export default function element(parser) {
} }
if (!regex_valid_element_name.test(name) && !regex_valid_component_name.test(name)) { if (!regex_valid_element_name.test(name) && !regex_valid_component_name.test(name)) {
// <div. -> in the middle of typing -> allow in loose mode
if (!parser.loose || !name.endsWith('.')) {
const bounds = { start: start + 1, end: start + 1 + name.length }; const bounds = { start: start + 1, end: start + 1 + name.length };
e.tag_invalid_name(bounds); e.tag_invalid_name(bounds);
} }
}
if (root_only_meta_tags.has(name)) { if (root_only_meta_tags.has(name)) {
if (name in parser.meta_tags) { if (name in parser.meta_tags) {
@ -142,7 +145,7 @@ export default function element(parser) {
const type = meta_tags.has(name) const type = meta_tags.has(name)
? meta_tags.get(name) ? meta_tags.get(name)
: regex_valid_component_name.test(name) : regex_valid_component_name.test(name) || (parser.loose && name.endsWith('.'))
? 'Component' ? 'Component'
: name === 'title' && parent_is_head(parser.stack) : name === 'title' && parent_is_head(parser.stack)
? 'TitleElement' ? 'TitleElement'

51
packages/svelte/src/compiler/phases/1-parse/state/tag.js
Unescape View File

@ -174,13 +174,30 @@ function open(parser) {
if (parser.eat('(')) { if (parser.eat('(')) {
parser.allow_whitespace(); parser.allow_whitespace();
key = read_expression(parser); key = read_expression(parser, '(');
parser.allow_whitespace(); parser.allow_whitespace();
parser.eat(')', true); parser.eat(')', true);
parser.allow_whitespace(); parser.allow_whitespace();
} }
const matches = parser.eat('}', true, false);
if (!matches) {
// Parser may have read the `as` as part of the expression (e.g. in `{#each foo. as x}`)
if (parser.template.slice(parser.index - 4, parser.index) === ' as ') {
const prev_index = parser.index;
context = read_pattern(parser);
parser.eat('}', true); parser.eat('}', true);
expression = {
type: 'Identifier',
name: '',
start: expression.start,
end: prev_index - 4
};
} else {
parser.eat('}', true); // rerun to produce the parser error
}
}
/** @type {AST.EachBlock} */ /** @type {AST.EachBlock} */
const block = parser.append({ const block = parser.append({
@ -246,7 +263,39 @@ function open(parser) {
parser.fragments.push(block.pending); parser.fragments.push(block.pending);
} }
const matches = parser.eat('}', true, false);
// Parser may have read the `then/catch` as part of the expression (e.g. in `{#await foo. then x}`)
if (!matches) {
if (parser.template.slice(parser.index - 6, parser.index) === ' then ') {
const prev_index = parser.index;
block.value = read_pattern(parser);
parser.eat('}', true); parser.eat('}', true);
block.expression = {
type: 'Identifier',
name: '',
start: expression.start,
end: prev_index - 6
};
block.then = block.pending;
block.pending = null;
} else if (parser.template.slice(parser.index - 7, parser.index) === ' catch ') {
const prev_index = parser.index;
block.error = read_pattern(parser);
parser.eat('}', true);
block.expression = {
type: 'Identifier',
name: '',
start: expression.start,
end: prev_index - 7
};
block.catch = block.pending;
block.pending = null;
} else {
parser.eat('}', true); // rerun to produce the parser error
}
}
parser.stack.push(block); parser.stack.push(block);
return; return;

5
packages/svelte/src/compiler/phases/1-parse/utils/bracket.js
Unescape View File

@ -4,6 +4,8 @@ const SQUARE_BRACKET_OPEN = '['.charCodeAt(0);
const SQUARE_BRACKET_CLOSE = ']'.charCodeAt(0); const SQUARE_BRACKET_CLOSE = ']'.charCodeAt(0);
const CURLY_BRACKET_OPEN = '{'.charCodeAt(0); const CURLY_BRACKET_OPEN = '{'.charCodeAt(0);
const CURLY_BRACKET_CLOSE = '}'.charCodeAt(0); const CURLY_BRACKET_CLOSE = '}'.charCodeAt(0);
const PARENTHESES_OPEN = '('.charCodeAt(0);
const PARENTHESES_CLOSE = ')'.charCodeAt(0);
/** @param {number} code */ /** @param {number} code */
export function is_bracket_open(code) { export function is_bracket_open(code) {
@ -34,6 +36,9 @@ export function get_bracket_close(open) {
if (open === CURLY_BRACKET_OPEN) { if (open === CURLY_BRACKET_OPEN) {
return CURLY_BRACKET_CLOSE; return CURLY_BRACKET_CLOSE;
} }
if (open === PARENTHESES_OPEN) {
return PARENTHESES_CLOSE;
}
} }
/** /**

4
packages/svelte/src/compiler/phases/3-transform/index.js
Unescape View File

@ -33,12 +33,15 @@ export function transform_component(analysis, source, options) {
: client_component(analysis, options); : client_component(analysis, options);
const js_source_name = get_source_name(options.filename, options.outputFilename, 'input.svelte'); const js_source_name = get_source_name(options.filename, options.outputFilename, 'input.svelte');
// @ts-expect-error
const js = print(program, { const js = print(program, {
// include source content; makes it easier/more robust looking up the source map code // include source content; makes it easier/more robust looking up the source map code
// (else esrap does return null for source and sourceMapContent which may trip up tooling) // (else esrap does return null for source and sourceMapContent which may trip up tooling)
sourceMapContent: source, sourceMapContent: source,
sourceMapSource: js_source_name sourceMapSource: js_source_name
}); });
merge_with_preprocessor_map(js, options, js_source_name); merge_with_preprocessor_map(js, options, js_source_name);
const css = const css =
@ -92,6 +95,7 @@ export function transform_module(analysis, source, options) {
} }
return { return {
// @ts-expect-error
js: print(program, { js: print(program, {
// include source content; makes it easier/more robust looking up the source map code // include source content; makes it easier/more robust looking up the source map code
// (else esrap does return null for source and sourceMapContent which may trip up tooling) // (else esrap does return null for source and sourceMapContent which may trip up tooling)

27
packages/svelte/src/internal/client/dev/equality.js
Unescape View File

@ -17,10 +17,11 @@ export function init_array_prototype_warnings() {
const index = indexOf.call(this, item, from_index); const index = indexOf.call(this, item, from_index);
if (index === -1) { if (index === -1) {
const test = indexOf.call(get_proxied_value(this), get_proxied_value(item), from_index); for (let i = from_index ?? 0; i < this.length; i += 1) {
if (get_proxied_value(this[i]) === item) {
if (test !== -1) {
w.state_proxy_equality_mismatch('array.indexOf(...)'); w.state_proxy_equality_mismatch('array.indexOf(...)');
break;
}
} }
} }
@ -33,16 +34,11 @@ export function init_array_prototype_warnings() {
const index = lastIndexOf.call(this, item, from_index ?? this.length - 1); const index = lastIndexOf.call(this, item, from_index ?? this.length - 1);
if (index === -1) { if (index === -1) {
// we need to specify this.length - 1 because it's probably using something like for (let i = 0; i <= (from_index ?? this.length - 1); i += 1) {
// `arguments` inside so passing undefined is different from not passing anything if (get_proxied_value(this[i]) === item) {
const test = lastIndexOf.call(
get_proxied_value(this),
get_proxied_value(item),
from_index ?? this.length - 1
);
if (test !== -1) {
w.state_proxy_equality_mismatch('array.lastIndexOf(...)'); w.state_proxy_equality_mismatch('array.lastIndexOf(...)');
break;
}
} }
} }
@ -53,10 +49,11 @@ export function init_array_prototype_warnings() {
const has = includes.call(this, item, from_index); const has = includes.call(this, item, from_index);
if (!has) { if (!has) {
const test = includes.call(get_proxied_value(this), get_proxied_value(item), from_index); for (let i = 0; i < this.length; i += 1) {
if (get_proxied_value(this[i]) === item) {
if (test) {
w.state_proxy_equality_mismatch('array.includes(...)'); w.state_proxy_equality_mismatch('array.includes(...)');
break;
}
} }
} }

9
packages/svelte/src/internal/client/runtime.js
Unescape View File

@ -127,8 +127,8 @@ export function set_untracked_writes(value) {
untracked_writes = value; untracked_writes = value;
} }
/** @type {number} Used by sources and deriveds for handling updates to unowned deriveds */ /** @type {number} Used by sources and deriveds for handling updates to unowned deriveds it starts from 1 to differentiate between a created effect and a run one for tracing */
let current_version = 0; let current_version = 1;
// If we are working with a get() chain that has no active container, // If we are working with a get() chain that has no active container,
// to prevent memory leaks, we skip adding the reaction. // to prevent memory leaks, we skip adding the reaction.
@ -230,8 +230,9 @@ export function check_dirtiness(reaction) {
} }
} }
// Unowned signals should never be marked as clean. // Unowned signals should never be marked as clean unless they
if (!is_unowned) { // are used within an active_effect without skip_reaction
if (!is_unowned || (active_effect !== null && !skip_reaction)) {
set_signal_status(reaction, CLEAN); set_signal_status(reaction, CLEAN);
} }
} }

2
packages/svelte/src/version.js
Unescape View File

@ -6,5 +6,5 @@
* https://svelte.dev/docs/svelte-compiler#svelte-version * https://svelte.dev/docs/svelte-compiler#svelte-version
* @type {string} * @type {string}
*/ */
export const VERSION = '5.14.0'; export const VERSION = '5.14.4';
export const PUBLIC_VERSION = '5'; export const PUBLIC_VERSION = '5';

12
packages/svelte/tests/parser-legacy/samples/loose-invalid-expression/input.svelte
Unescape View File

@ -9,3 +9,15 @@
asd{a.}asd asd{a.}asd
{foo[bar.]} {foo[bar.]}
{#if x.}{/if}
{#each array as item (item.)}{/each}
{#each obj. as item}{/each}
{#await x.}{/await}
{#await x. then y}{/await}
{#await x. catch y}{/await}

268
packages/svelte/tests/parser-legacy/samples/loose-invalid-expression/output.json
Unescape View File

@ -2,7 +2,7 @@
"html": { "html": {
"type": "Fragment", "type": "Fragment",
"start": 0, "start": 0,
"end": 164, "end": 324,
"children": [ "children": [
{ {
"type": "Element", "type": "Element",
@ -236,6 +236,272 @@
"end": 163, "end": 163,
"name": "" "name": ""
} }
},
{
"type": "Text",
"start": 164,
"end": 166,
"raw": "\n\n",
"data": "\n\n"
},
{
"type": "IfBlock",
"start": 166,
"end": 179,
"expression": {
"type": "Identifier",
"start": 171,
"end": 173,
"name": ""
},
"children": []
},
{
"type": "Text",
"start": 179,
"end": 181,
"raw": "\n\n",
"data": "\n\n"
},
{
"type": "EachBlock",
"start": 181,
"end": 217,
"children": [],
"context": {
"type": "Identifier",
"name": "item",
"start": 197,
"loc": {
"start": {
"line": 15,
"column": 16,
"character": 197
},
"end": {
"line": 15,
"column": 20,
"character": 201
}
},
"end": 201
},
"expression": {
"type": "Identifier",
"start": 188,
"end": 193,
"loc": {
"start": {
"line": 15,
"column": 7
},
"end": {
"line": 15,
"column": 12
}
},
"name": "array"
},
"key": {
"type": "Identifier",
"start": 203,
"end": 208,
"name": ""
}
},
{
"type": "Text",
"start": 217,
"end": 219,
"raw": "\n\n",
"data": "\n\n"
},
{
"type": "EachBlock",
"start": 219,
"end": 246,
"children": [],
"context": {
"type": "Identifier",
"name": "item",
"start": 234,
"loc": {
"start": {
"line": 17,
"column": 15,
"character": 234
},
"end": {
"line": 17,
"column": 19,
"character": 238
}
},
"end": 238
},
"expression": {
"type": "Identifier",
"name": "",
"start": 226,
"end": 230
}
},
{
"type": "Text",
"start": 246,
"end": 248,
"raw": "\n\n",
"data": "\n\n"
},
{
"type": "AwaitBlock",
"start": 248,
"end": 267,
"expression": {
"type": "Identifier",
"start": 256,
"end": 258,
"name": ""
},
"value": null,
"error": null,
"pending": {
"type": "PendingBlock",
"start": 259,
"end": 259,
"children": [],
"skip": false
},
"then": {
"type": "ThenBlock",
"start": null,
"end": null,
"children": [],
"skip": true
},
"catch": {
"type": "CatchBlock",
"start": null,
"end": null,
"children": [],
"skip": true
}
},
{
"type": "Text",
"start": 267,
"end": 269,
"raw": "\n\n",
"data": "\n\n"
},
{
"type": "AwaitBlock",
"start": 269,
"end": 295,
"expression": {
"type": "Identifier",
"name": "",
"start": 277,
"end": 279
},
"value": {
"type": "Identifier",
"name": "y",
"start": 285,
"loc": {
"start": {
"line": 21,
"column": 16,
"character": 285
},
"end": {
"line": 21,
"column": 17,
"character": 286
}
},
"end": 286
},
"error": null,
"pending": {
"type": "PendingBlock",
"start": null,
"end": null,
"children": [],
"skip": true
},
"then": {
"type": "ThenBlock",
"start": 287,
"end": 267,
"children": [],
"skip": false
},
"catch": {
"type": "CatchBlock",
"start": null,
"end": null,
"children": [],
"skip": true
}
},
{
"type": "Text",
"start": 295,
"end": 297,
"raw": "\n\n",
"data": "\n\n"
},
{
"type": "AwaitBlock",
"start": 297,
"end": 324,
"expression": {
"type": "Identifier",
"name": "",
"start": 305,
"end": 307
},
"value": null,
"error": {
"type": "Identifier",
"name": "y",
"start": 314,
"loc": {
"start": {
"line": 23,
"column": 17,
"character": 314
},
"end": {
"line": 23,
"column": 18,
"character": 315
}
},
"end": 315
},
"pending": {
"type": "PendingBlock",
"start": null,
"end": null,
"children": [],
"skip": true
},
"then": {
"type": "ThenBlock",
"start": null,
"end": null,
"children": [],
"skip": true
},
"catch": {
"type": "CatchBlock",
"start": 316,
"end": 295,
"children": [],
"skip": false
}
} }
] ]
} }

8
packages/svelte/tests/parser-legacy/samples/loose-unclosed-tag/input.svelte
Unescape View File

@ -10,6 +10,14 @@
<span <span
</div> </div>
<div>
<Comp.
</div>
<div>
<comp.
</div>
{#if foo} {#if foo}
<div> <div>
{/if} {/if}

146
packages/svelte/tests/parser-legacy/samples/loose-unclosed-tag/output.json
Unescape View File

@ -2,7 +2,7 @@
"html": { "html": {
"type": "Fragment", "type": "Fragment",
"start": 0, "start": 0,
"end": 160, "end": 204,
"children": [ "children": [
{ {
"type": "Element", "type": "Element",
@ -136,20 +136,82 @@
"data": "\n\n" "data": "\n\n"
}, },
{ {
"type": "IfBlock", "type": "Element",
"start": 74, "start": 74,
"end": 94,
"name": "div",
"attributes": [],
"children": [
{
"type": "Text",
"start": 79,
"end": 81,
"raw": "\n\t",
"data": "\n\t"
},
{
"type": "InlineComponent",
"start": 81,
"end": 88,
"name": "Comp.",
"attributes": [],
"children": []
}
]
},
{
"type": "Text",
"start": 94,
"end": 96, "end": 96,
"raw": "\n\n",
"data": "\n\n"
},
{
"type": "Element",
"start": 96,
"end": 116,
"name": "div",
"attributes": [],
"children": [
{
"type": "Text",
"start": 101,
"end": 103,
"raw": "\n\t",
"data": "\n\t"
},
{
"type": "InlineComponent",
"start": 103,
"end": 110,
"name": "comp.",
"attributes": [],
"children": []
}
]
},
{
"type": "Text",
"start": 116,
"end": 118,
"raw": "\n\n",
"data": "\n\n"
},
{
"type": "IfBlock",
"start": 118,
"end": 140,
"expression": { "expression": {
"type": "Identifier", "type": "Identifier",
"start": 79, "start": 123,
"end": 82, "end": 126,
"loc": { "loc": {
"start": { "start": {
"line": 13, "line": 21,
"column": 5 "column": 5
}, },
"end": { "end": {
"line": 13, "line": 21,
"column": 8 "column": 8
} }
}, },
@ -158,15 +220,15 @@
"children": [ "children": [
{ {
"type": "Element", "type": "Element",
"start": 85, "start": 129,
"end": 91, "end": 135,
"name": "div", "name": "div",
"attributes": [], "attributes": [],
"children": [ "children": [
{ {
"type": "Text", "type": "Text",
"start": 90, "start": 134,
"end": 91, "end": 135,
"raw": "\n", "raw": "\n",
"data": "\n" "data": "\n"
} }
@ -176,26 +238,26 @@
}, },
{ {
"type": "Text", "type": "Text",
"start": 96, "start": 140,
"end": 98, "end": 142,
"raw": "\n\n", "raw": "\n\n",
"data": "\n\n" "data": "\n\n"
}, },
{ {
"type": "IfBlock", "type": "IfBlock",
"start": 98, "start": 142,
"end": 130, "end": 174,
"expression": { "expression": {
"type": "Identifier", "type": "Identifier",
"start": 103, "start": 147,
"end": 106, "end": 150,
"loc": { "loc": {
"start": { "start": {
"line": 17, "line": 25,
"column": 5 "column": 5
}, },
"end": { "end": {
"line": 17, "line": 25,
"column": 8 "column": 8
} }
}, },
@ -204,31 +266,31 @@
"children": [ "children": [
{ {
"type": "InlineComponent", "type": "InlineComponent",
"start": 109, "start": 153,
"end": 125, "end": 169,
"name": "Comp", "name": "Comp",
"attributes": [ "attributes": [
{ {
"type": "Attribute", "type": "Attribute",
"start": 115, "start": 159,
"end": 124, "end": 168,
"name": "foo", "name": "foo",
"value": [ "value": [
{ {
"type": "MustacheTag", "type": "MustacheTag",
"start": 119, "start": 163,
"end": 124, "end": 168,
"expression": { "expression": {
"type": "Identifier", "type": "Identifier",
"start": 120, "start": 164,
"end": 123, "end": 167,
"loc": { "loc": {
"start": { "start": {
"line": 18, "line": 26,
"column": 12 "column": 12
}, },
"end": { "end": {
"line": 18, "line": 26,
"column": 15 "column": 15
} }
}, },
@ -244,36 +306,36 @@
}, },
{ {
"type": "Text", "type": "Text",
"start": 130, "start": 174,
"end": 132, "end": 176,
"raw": "\n\n", "raw": "\n\n",
"data": "\n\n" "data": "\n\n"
}, },
{ {
"type": "Element", "type": "Element",
"start": 132, "start": 176,
"end": 160, "end": 204,
"name": "div", "name": "div",
"attributes": [], "attributes": [],
"children": [ "children": [
{ {
"type": "Text", "type": "Text",
"start": 137, "start": 181,
"end": 138, "end": 182,
"raw": "\n", "raw": "\n",
"data": "\n" "data": "\n"
}, },
{ {
"type": "Element", "type": "Element",
"start": 138, "start": 182,
"end": 147, "end": 191,
"name": "p", "name": "p",
"attributes": [], "attributes": [],
"children": [ "children": [
{ {
"type": "Text", "type": "Text",
"start": 141, "start": 185,
"end": 143, "end": 187,
"raw": "hi", "raw": "hi",
"data": "hi" "data": "hi"
} }
@ -281,15 +343,15 @@
}, },
{ {
"type": "Text", "type": "Text",
"start": 147, "start": 191,
"end": 149, "end": 193,
"raw": "\n\n", "raw": "\n\n",
"data": "\n\n" "data": "\n\n"
}, },
{ {
"type": "Element", "type": "Element",
"start": 149, "start": 193,
"end": 160, "end": 204,
"name": "open-ended", "name": "open-ended",
"attributes": [], "attributes": [],
"children": [] "children": []

12
packages/svelte/tests/parser-modern/samples/loose-invalid-expression/input.svelte
Unescape View File

@ -9,3 +9,15 @@
asd{a.}asd asd{a.}asd
{foo[bar.]} {foo[bar.]}
{#if x.}{/if}
{#each array as item (item.)}{/each}
{#each obj. as item}{/each}
{#await x.}{/await}
{#await x. then y}{/await}
{#await x. catch y}{/await}

234
packages/svelte/tests/parser-modern/samples/loose-invalid-expression/output.json
Unescape View File

@ -2,7 +2,7 @@
"css": null, "css": null,
"js": [], "js": [],
"start": 0, "start": 0,
"end": 164, "end": 324,
"type": "Root", "type": "Root",
"fragment": { "fragment": {
"type": "Fragment", "type": "Fragment",
@ -247,6 +247,238 @@
"end": 163, "end": 163,
"name": "" "name": ""
} }
},
{
"type": "Text",
"start": 164,
"end": 166,
"raw": "\n\n",
"data": "\n\n"
},
{
"type": "IfBlock",
"elseif": false,
"start": 166,
"end": 179,
"test": {
"type": "Identifier",
"start": 171,
"end": 173,
"name": ""
},
"consequent": {
"type": "Fragment",
"nodes": []
},
"alternate": null
},
{
"type": "Text",
"start": 179,
"end": 181,
"raw": "\n\n",
"data": "\n\n"
},
{
"type": "EachBlock",
"start": 181,
"end": 217,
"expression": {
"type": "Identifier",
"start": 188,
"end": 193,
"loc": {
"start": {
"line": 15,
"column": 7
},
"end": {
"line": 15,
"column": 12
}
},
"name": "array"
},
"body": {
"type": "Fragment",
"nodes": []
},
"context": {
"type": "Identifier",
"name": "item",
"start": 197,
"loc": {
"start": {
"line": 15,
"column": 16,
"character": 197
},
"end": {
"line": 15,
"column": 20,
"character": 201
}
},
"end": 201
},
"key": {
"type": "Identifier",
"start": 203,
"end": 208,
"name": ""
}
},
{
"type": "Text",
"start": 217,
"end": 219,
"raw": "\n\n",
"data": "\n\n"
},
{
"type": "EachBlock",
"start": 219,
"end": 246,
"expression": {
"type": "Identifier",
"name": "",
"start": 226,
"end": 230
},
"body": {
"type": "Fragment",
"nodes": []
},
"context": {
"type": "Identifier",
"name": "item",
"start": 234,
"loc": {
"start": {
"line": 17,
"column": 15,
"character": 234
},
"end": {
"line": 17,
"column": 19,
"character": 238
}
},
"end": 238
}
},
{
"type": "Text",
"start": 246,
"end": 248,
"raw": "\n\n",
"data": "\n\n"
},
{
"type": "AwaitBlock",
"start": 248,
"end": 267,
"expression": {
"type": "Identifier",
"start": 256,
"end": 258,
"name": ""
},
"value": null,
"error": null,
"pending": {
"type": "Fragment",
"nodes": []
},
"then": null,
"catch": null
},
{
"type": "Text",
"start": 267,
"end": 269,
"raw": "\n\n",
"data": "\n\n"
},
{
"type": "AwaitBlock",
"start": 269,
"end": 295,
"expression": {
"type": "Identifier",
"name": "",
"start": 277,
"end": 279
},
"value": {
"type": "Identifier",
"name": "y",
"start": 285,
"loc": {
"start": {
"line": 21,
"column": 16,
"character": 285
},
"end": {
"line": 21,
"column": 17,
"character": 286
}
},
"end": 286
},
"error": null,
"pending": null,
"then": {
"type": "Fragment",
"nodes": []
},
"catch": null
},
{
"type": "Text",
"start": 295,
"end": 297,
"raw": "\n\n",
"data": "\n\n"
},
{
"type": "AwaitBlock",
"start": 297,
"end": 324,
"expression": {
"type": "Identifier",
"name": "",
"start": 305,
"end": 307
},
"value": null,
"error": {
"type": "Identifier",
"name": "y",
"start": 314,
"loc": {
"start": {
"line": 23,
"column": 17,
"character": 314
},
"end": {
"line": 23,
"column": 18,
"character": 315
}
},
"end": 315
},
"pending": null,
"then": null,
"catch": {
"type": "Fragment",
"nodes": []
}
} }
] ]
}, },

8
packages/svelte/tests/parser-modern/samples/loose-unclosed-tag/input.svelte
Unescape View File

@ -10,6 +10,14 @@
<span <span
</div> </div>
<div>
<Comp.
</div>
<div>
<comp.
</div>
{#if foo} {#if foo}
<div> <div>
{/if} {/if}

168
packages/svelte/tests/parser-modern/samples/loose-unclosed-tag/output.json
Unescape View File

@ -2,7 +2,7 @@
"css": null, "css": null,
"js": [], "js": [],
"start": 0, "start": 0,
"end": 160, "end": 204,
"type": "Root", "type": "Root",
"fragment": { "fragment": {
"type": "Fragment", "type": "Fragment",
@ -155,21 +155,95 @@
"data": "\n\n" "data": "\n\n"
}, },
{ {
"type": "IfBlock", "type": "RegularElement",
"elseif": false,
"start": 74, "start": 74,
"end": 94,
"name": "div",
"attributes": [],
"fragment": {
"type": "Fragment",
"nodes": [
{
"type": "Text",
"start": 79,
"end": 81,
"raw": "\n\t",
"data": "\n\t"
},
{
"type": "Component",
"start": 81,
"end": 88,
"name": "Comp.",
"attributes": [],
"fragment": {
"type": "Fragment",
"nodes": []
}
}
]
}
},
{
"type": "Text",
"start": 94,
"end": 96, "end": 96,
"raw": "\n\n",
"data": "\n\n"
},
{
"type": "RegularElement",
"start": 96,
"end": 116,
"name": "div",
"attributes": [],
"fragment": {
"type": "Fragment",
"nodes": [
{
"type": "Text",
"start": 101,
"end": 103,
"raw": "\n\t",
"data": "\n\t"
},
{
"type": "Component",
"start": 103,
"end": 110,
"name": "comp.",
"attributes": [],
"fragment": {
"type": "Fragment",
"nodes": []
}
}
]
}
},
{
"type": "Text",
"start": 116,
"end": 118,
"raw": "\n\n",
"data": "\n\n"
},
{
"type": "IfBlock",
"elseif": false,
"start": 118,
"end": 140,
"test": { "test": {
"type": "Identifier", "type": "Identifier",
"start": 79, "start": 123,
"end": 82, "end": 126,
"loc": { "loc": {
"start": { "start": {
"line": 13, "line": 21,
"column": 5 "column": 5
}, },
"end": { "end": {
"line": 13, "line": 21,
"column": 8 "column": 8
} }
}, },
@ -180,15 +254,15 @@
"nodes": [ "nodes": [
{ {
"type": "Text", "type": "Text",
"start": 83, "start": 127,
"end": 85, "end": 129,
"raw": "\n\t", "raw": "\n\t",
"data": "\n\t" "data": "\n\t"
}, },
{ {
"type": "RegularElement", "type": "RegularElement",
"start": 85, "start": 129,
"end": 91, "end": 135,
"name": "div", "name": "div",
"attributes": [], "attributes": [],
"fragment": { "fragment": {
@ -196,8 +270,8 @@
"nodes": [ "nodes": [
{ {
"type": "Text", "type": "Text",
"start": 90, "start": 134,
"end": 91, "end": 135,
"raw": "\n", "raw": "\n",
"data": "\n" "data": "\n"
} }
@ -210,27 +284,27 @@
}, },
{ {
"type": "Text", "type": "Text",
"start": 96, "start": 140,
"end": 98, "end": 142,
"raw": "\n\n", "raw": "\n\n",
"data": "\n\n" "data": "\n\n"
}, },
{ {
"type": "IfBlock", "type": "IfBlock",
"elseif": false, "elseif": false,
"start": 98, "start": 142,
"end": 130, "end": 174,
"test": { "test": {
"type": "Identifier", "type": "Identifier",
"start": 103, "start": 147,
"end": 106, "end": 150,
"loc": { "loc": {
"start": { "start": {
"line": 17, "line": 25,
"column": 5 "column": 5
}, },
"end": { "end": {
"line": 17, "line": 25,
"column": 8 "column": 8
} }
}, },
@ -241,37 +315,37 @@
"nodes": [ "nodes": [
{ {
"type": "Text", "type": "Text",
"start": 107, "start": 151,
"end": 109, "end": 153,
"raw": "\n\t", "raw": "\n\t",
"data": "\n\t" "data": "\n\t"
}, },
{ {
"type": "Component", "type": "Component",
"start": 109, "start": 153,
"end": 125, "end": 169,
"name": "Comp", "name": "Comp",
"attributes": [ "attributes": [
{ {
"type": "Attribute", "type": "Attribute",
"start": 115, "start": 159,
"end": 124, "end": 168,
"name": "foo", "name": "foo",
"value": { "value": {
"type": "ExpressionTag", "type": "ExpressionTag",
"start": 119, "start": 163,
"end": 124, "end": 168,
"expression": { "expression": {
"type": "Identifier", "type": "Identifier",
"start": 120, "start": 164,
"end": 123, "end": 167,
"loc": { "loc": {
"start": { "start": {
"line": 18, "line": 26,
"column": 12 "column": 12
}, },
"end": { "end": {
"line": 18, "line": 26,
"column": 15 "column": 15
} }
}, },
@ -291,15 +365,15 @@
}, },
{ {
"type": "Text", "type": "Text",
"start": 130, "start": 174,
"end": 132, "end": 176,
"raw": "\n\n", "raw": "\n\n",
"data": "\n\n" "data": "\n\n"
}, },
{ {
"type": "RegularElement", "type": "RegularElement",
"start": 132, "start": 176,
"end": 160, "end": 204,
"name": "div", "name": "div",
"attributes": [], "attributes": [],
"fragment": { "fragment": {
@ -307,15 +381,15 @@
"nodes": [ "nodes": [
{ {
"type": "Text", "type": "Text",
"start": 137, "start": 181,
"end": 138, "end": 182,
"raw": "\n", "raw": "\n",
"data": "\n" "data": "\n"
}, },
{ {
"type": "RegularElement", "type": "RegularElement",
"start": 138, "start": 182,
"end": 147, "end": 191,
"name": "p", "name": "p",
"attributes": [], "attributes": [],
"fragment": { "fragment": {
@ -323,8 +397,8 @@
"nodes": [ "nodes": [
{ {
"type": "Text", "type": "Text",
"start": 141, "start": 185,
"end": 143, "end": 187,
"raw": "hi", "raw": "hi",
"data": "hi" "data": "hi"
} }
@ -333,15 +407,15 @@
}, },
{ {
"type": "Text", "type": "Text",
"start": 147, "start": 191,
"end": 149, "end": 193,
"raw": "\n\n", "raw": "\n\n",
"data": "\n\n" "data": "\n\n"
}, },
{ {
"type": "RegularElement", "type": "RegularElement",
"start": 149, "start": 193,
"end": 160, "end": 204,
"name": "open-ended", "name": "open-ended",
"attributes": [], "attributes": [],
"fragment": { "fragment": {

64
packages/svelte/tests/runtime-runes/samples/inspect-trace/_config.js
Unescape View File

@ -11,12 +11,15 @@ function normalise_trace_logs(logs) {
if (typeof log === 'string' && log.includes('%c')) { if (typeof log === 'string' && log.includes('%c')) {
const split = log.split('%c'); const split = log.split('%c');
normalised.push((split[0].length !== 0 ? split[0] : split[1]).trim()); normalised.push({
log: (split[0].length !== 0 ? split[0] : split[1]).trim(),
highlighted: logs[i + 1] === 'color: CornflowerBlue; font-weight: bold'
});
i++; i++;
} else if (log instanceof Error) { } else if (log instanceof Error) {
continue; continue;
} else { } else {
normalised.push(log); normalised.push({ log });
} }
} }
return normalised; return normalised;
@ -28,7 +31,17 @@ export default test({
}, },
test({ assert, target, logs }) { test({ assert, target, logs }) {
assert.deepEqual(normalise_trace_logs(logs), ['effect', '$derived', 0, '$state', 0]); // initial log, everything is highlighted
assert.deepEqual(normalise_trace_logs(logs), [
{ log: 'effect', highlighted: false },
{ log: '$derived', highlighted: true },
{ log: 0 },
{ log: '$state', highlighted: true },
{ log: 0 },
{ log: '$state', highlighted: true },
{ log: false }
]);
logs.length = 0; logs.length = 0;
@ -36,6 +49,49 @@ export default test({
button?.click(); button?.click();
flushSync(); flushSync();
assert.deepEqual(normalise_trace_logs(logs), ['effect', '$derived', 2, '$state', 1]); // count changed, derived and state are highlighted, last state is not
assert.deepEqual(normalise_trace_logs(logs), [
{ log: 'effect', highlighted: false },
{ log: '$derived', highlighted: true },
{ log: 2 },
{ log: '$state', highlighted: true },
{ log: 1 },
{ log: '$state', highlighted: false },
{ log: false }
]);
logs.length = 0;
const input = target.querySelector('input');
input?.click();
flushSync();
// checked changed, last state is highlighted, first two are not
assert.deepEqual(normalise_trace_logs(logs), [
{ log: 'effect', highlighted: false },
{ log: '$derived', highlighted: false },
{ log: 2 },
{ log: '$state', highlighted: false },
{ log: 1 },
{ log: '$state', highlighted: true },
{ log: true }
]);
logs.length = 0;
button?.click();
flushSync();
// count change and derived it's >=4, checked is not in the dependencies anymore
assert.deepEqual(normalise_trace_logs(logs), [
{ log: 'effect', highlighted: false },
{ log: '$derived', highlighted: true },
{ log: 4 },
{ log: '$state', highlighted: true },
{ log: 2 }
]);
} }
}); });

6
packages/svelte/tests/runtime-runes/samples/inspect-trace/main.svelte
Unescape View File

@ -2,11 +2,15 @@
let count = $state(0); let count = $state(0);
let double = $derived(count * 2); let double = $derived(count * 2);
let checked = $state(false);
$effect(() => { $effect(() => {
$inspect.trace('effect'); $inspect.trace('effect');
double; double;
}) double >= 4 || checked;
});
</script> </script>
<button onclick={() => count++}>{double}</button> <button onclick={() => count++}>{double}</button>
<input type="checkbox" bind:checked />

41
packages/svelte/tests/runtime-runes/samples/state-proxy-equality-mismatch/_config.js
Unescape View File

@ -0,0 +1,41 @@
import { flushSync } from 'svelte';
import { test } from '../../test';
export default test({
compileOptions: {
dev: true
},
async test({ assert, target, warnings }) {
const [btn1, btn2, btn3, btn4, btn5, btn6, clear] = target.querySelectorAll('button');
flushSync(() => {
btn1.click();
btn2.click();
btn3.click();
btn4.click();
btn5.click();
btn6.click();
});
assert.deepEqual(warnings, [
'Reactive `$state(...)` proxies and the values they proxy have different identities. Because of this, comparisons with `array.includes(...)` will produce unexpected results',
'Reactive `$state(...)` proxies and the values they proxy have different identities. Because of this, comparisons with `array.indexOf(...)` will produce unexpected results',
'Reactive `$state(...)` proxies and the values they proxy have different identities. Because of this, comparisons with `array.lastIndexOf(...)` will produce unexpected results'
]);
flushSync(() => clear.click());
warnings.length = 0;
flushSync(() => {
btn1.click();
btn2.click();
btn3.click();
btn4.click();
btn5.click();
btn6.click();
});
assert.deepEqual(warnings, []);
}
});

23
packages/svelte/tests/runtime-runes/samples/state-proxy-equality-mismatch/main.svelte
Unescape View File

@ -0,0 +1,23 @@
<script>
let primitive = 'foo';
let object = {};
let array = $state([primitive, object]);
</script>
<button onclick={() => array.includes(primitive)}>array.includes(primitive)</button>
<button onclick={() => array.includes(object)}>array.includes(object)</button>
<hr />
<button onclick={() => array.indexOf(primitive)}>array.indexOf(primitive)</button>
<button onclick={() => array.indexOf(object)}>array.indexOf(object)</button>
<hr />
<button onclick={() => array.lastIndexOf(primitive)}>array.lastIndexOf(primitive)</button>
<button onclick={() => array.lastIndexOf(object)}>array.lastIndexOf(object)</button>
<hr />
<button onclick={() => (array.length = 0)}>clear</button>

8
packages/svelte/tests/runtime-runes/samples/typescript/main.svelte
Unescape View File

@ -8,6 +8,10 @@
console.log(this); console.log(this);
} }
function foo(): string {
return ""!;
}
class Foo<T> { class Foo<T> {
public name: string; public name: string;
x = 'x' as const; x = 'x' as const;
@ -16,6 +20,8 @@
} }
} }
class MyClass implements Hello {}
declare const declared_const: number; declare const declared_const: number;
declare function declared_fn(): void; declare function declared_fn(): void;
declare class declared_class { declare class declared_class {
@ -24,7 +30,7 @@
declare module 'foobar' {} declare module 'foobar' {}
namespace SomeNamespace { namespace SomeNamespace {
export type Foo = true export type Foo = true;
} }
export function overload(a: boolean): boolean; export function overload(a: boolean): boolean;

6
packages/svelte/tsconfig.json
Unescape View File

@ -40,5 +40,9 @@
"./tests/runtime-browser/test-ssr.ts", "./tests/runtime-browser/test-ssr.ts",
"./tests/*/samples/*/_config.js" "./tests/*/samples/*/_config.js"
], ],
"exclude": ["./scripts/process-messages/templates/", "./src/compiler/optimizer/"] "exclude": [
"./scripts/process-messages/templates/",
"./scripts/_bundle.js",
"./src/compiler/optimizer/"
]
} }

12
pnpm-lock.yaml
Unescape View File

@ -84,8 +84,8 @@ importers:
specifier: ^1.2.1 specifier: ^1.2.1
version: 1.2.1 version: 1.2.1
esrap: esrap:
specifier: ^1.2.3 specifier: ^1.3.1
version: 1.2.3 version: 1.3.1
is-reference: is-reference:
specifier: ^3.0.3 specifier: ^3.0.3
version: 3.0.3 version: 3.0.3
@ -1111,8 +1111,8 @@ packages:
resolution: {integrity: sha512-YQLXUplAwJgCydQ78IMJywZCceoqk1oH01OERdSAJc/7U2AylwjhSCLDEtqwg811idIS/9fIU5GjG73IgjKMVg==} resolution: {integrity: sha512-YQLXUplAwJgCydQ78IMJywZCceoqk1oH01OERdSAJc/7U2AylwjhSCLDEtqwg811idIS/9fIU5GjG73IgjKMVg==}
engines: {node: '>=0.10'} engines: {node: '>=0.10'}
esrap@1.2.3: esrap@1.3.1:
resolution: {integrity: sha512-ZlQmCCK+n7SGoqo7DnfKaP1sJZa49P01/dXzmjCASSo04p72w8EksT2NMK8CEX8DhKsfJXANioIw8VyHNsBfvQ==} resolution: {integrity: sha512-KpAH3+QsDmtOP1KOW04CbD1PgzWsIHjB8tOCk3PCb8xzNGn8XkjI8zl80i09fmXdzQyaS8tcsKCCDzHF7AcowA==}
esrecurse@4.3.0: esrecurse@4.3.0:
resolution: {integrity: sha512-KmfKL3b6G+RXvP8N1vr3Tq1kL/oCFgn2NYXEtqP8/L3pKapUA4G8cFVaoF3SU323CD4XypR/ffioHmkti6/Tag==} resolution: {integrity: sha512-KmfKL3b6G+RXvP8N1vr3Tq1kL/oCFgn2NYXEtqP8/L3pKapUA4G8cFVaoF3SU323CD4XypR/ffioHmkti6/Tag==}
@ -3315,10 +3315,10 @@ snapshots:
dependencies: dependencies:
estraverse: 5.3.0 estraverse: 5.3.0
esrap@1.2.3: esrap@1.3.1:
dependencies: dependencies:
'@jridgewell/sourcemap-codec': 1.5.0 '@jridgewell/sourcemap-codec': 1.5.0
'@types/estree': 1.0.6 '@typescript-eslint/types': 8.2.0
esrecurse@4.3.0: esrecurse@4.3.0:
dependencies: dependencies:

Write Preview
Loading…
Cancel
Save