mirror of https://github.com/sveltejs/svelte
Rich Harris
5 months ago
commit
bb2515da57
@ -0,0 +1,5 @@
|
||||
---
|
||||
'svelte': patch
|
||||
---
|
||||
|
||||
perf: optimize parser hot paths for faster compilation
|
||||
@ -0,0 +1,5 @@
|
||||
---
|
||||
'svelte': patch
|
||||
---
|
||||
|
||||
chore: more efficient effect scheduling
|
||||
@ -0,0 +1,5 @@
|
||||
---
|
||||
'svelte': patch
|
||||
---
|
||||
|
||||
chore: null out current_batch before committing branches
|
||||
@ -0,0 +1,22 @@
|
||||
<div
|
||||
data-one="1"
|
||||
// this is a line comment
|
||||
data-two="2"
|
||||
/* this is a
|
||||
m
|
||||
u
|
||||
l
|
||||
t
|
||||
i
|
||||
l
|
||||
i
|
||||
n
|
||||
e
|
||||
comment
|
||||
*/
|
||||
// oh look another line comment
|
||||
// (two, in fact)
|
||||
data-three="3"
|
||||
></div>
|
||||
|
||||
<span /* inline */ /* another inline */ data-one="1"></span>
|
||||
@ -0,0 +1,286 @@
|
||||
{
|
||||
"css": null,
|
||||
"js": [],
|
||||
"start": 0,
|
||||
"end": 261,
|
||||
"type": "Root",
|
||||
"fragment": {
|
||||
"type": "Fragment",
|
||||
"nodes": [
|
||||
{
|
||||
"type": "RegularElement",
|
||||
"start": 0,
|
||||
"end": 199,
|
||||
"name": "div",
|
||||
"name_loc": {
|
||||
"start": {
|
||||
"line": 1,
|
||||
"column": 1,
|
||||
"character": 1
|
||||
},
|
||||
"end": {
|
||||
"line": 1,
|
||||
"column": 4,
|
||||
"character": 4
|
||||
}
|
||||
},
|
||||
"attributes": [
|
||||
{
|
||||
"type": "Attribute",
|
||||
"start": 6,
|
||||
"end": 18,
|
||||
"name": "data-one",
|
||||
"name_loc": {
|
||||
"start": {
|
||||
"line": 2,
|
||||
"column": 1,
|
||||
"character": 6
|
||||
},
|
||||
"end": {
|
||||
"line": 2,
|
||||
"column": 9,
|
||||
"character": 14
|
||||
}
|
||||
},
|
||||
"value": [
|
||||
{
|
||||
"start": 16,
|
||||
"end": 17,
|
||||
"type": "Text",
|
||||
"raw": "1",
|
||||
"data": "1"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"type": "Attribute",
|
||||
"start": 47,
|
||||
"end": 59,
|
||||
"name": "data-two",
|
||||
"name_loc": {
|
||||
"start": {
|
||||
"line": 4,
|
||||
"column": 1,
|
||||
"character": 47
|
||||
},
|
||||
"end": {
|
||||
"line": 4,
|
||||
"column": 9,
|
||||
"character": 55
|
||||
}
|
||||
},
|
||||
"value": [
|
||||
{
|
||||
"start": 57,
|
||||
"end": 58,
|
||||
"type": "Text",
|
||||
"raw": "2",
|
||||
"data": "2"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"type": "Attribute",
|
||||
"start": 177,
|
||||
"end": 191,
|
||||
"name": "data-three",
|
||||
"name_loc": {
|
||||
"start": {
|
||||
"line": 19,
|
||||
"column": 1,
|
||||
"character": 177
|
||||
},
|
||||
"end": {
|
||||
"line": 19,
|
||||
"column": 11,
|
||||
"character": 187
|
||||
}
|
||||
},
|
||||
"value": [
|
||||
{
|
||||
"start": 189,
|
||||
"end": 190,
|
||||
"type": "Text",
|
||||
"raw": "3",
|
||||
"data": "3"
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
"fragment": {
|
||||
"type": "Fragment",
|
||||
"nodes": []
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Text",
|
||||
"start": 199,
|
||||
"end": 201,
|
||||
"raw": "\n\n",
|
||||
"data": "\n\n"
|
||||
},
|
||||
{
|
||||
"type": "RegularElement",
|
||||
"start": 201,
|
||||
"end": 261,
|
||||
"name": "span",
|
||||
"name_loc": {
|
||||
"start": {
|
||||
"line": 22,
|
||||
"column": 1,
|
||||
"character": 202
|
||||
},
|
||||
"end": {
|
||||
"line": 22,
|
||||
"column": 5,
|
||||
"character": 206
|
||||
}
|
||||
},
|
||||
"attributes": [
|
||||
{
|
||||
"type": "Attribute",
|
||||
"start": 241,
|
||||
"end": 253,
|
||||
"name": "data-one",
|
||||
"name_loc": {
|
||||
"start": {
|
||||
"line": 22,
|
||||
"column": 40,
|
||||
"character": 241
|
||||
},
|
||||
"end": {
|
||||
"line": 22,
|
||||
"column": 48,
|
||||
"character": 249
|
||||
}
|
||||
},
|
||||
"value": [
|
||||
{
|
||||
"start": 251,
|
||||
"end": 252,
|
||||
"type": "Text",
|
||||
"raw": "1",
|
||||
"data": "1"
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
"fragment": {
|
||||
"type": "Fragment",
|
||||
"nodes": []
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
"options": null,
|
||||
"comments": [
|
||||
{
|
||||
"type": "Line",
|
||||
"start": 20,
|
||||
"end": 45,
|
||||
"value": " this is a line comment",
|
||||
"loc": {
|
||||
"start": {
|
||||
"line": 3,
|
||||
"column": 1,
|
||||
"character": 20
|
||||
},
|
||||
"end": {
|
||||
"line": 3,
|
||||
"column": 26,
|
||||
"character": 45
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Block",
|
||||
"start": 61,
|
||||
"end": 123,
|
||||
"value": " this is a\n\t\tm\n\t\tu\n\t\tl\n\t\tt\n\t\ti\n\t\tl\n\t\ti\n\t\tn\n\t\te\n\t\tcomment\n\t",
|
||||
"loc": {
|
||||
"start": {
|
||||
"line": 5,
|
||||
"column": 1,
|
||||
"character": 61
|
||||
},
|
||||
"end": {
|
||||
"line": 16,
|
||||
"column": 3,
|
||||
"character": 123
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Line",
|
||||
"start": 125,
|
||||
"end": 156,
|
||||
"value": " oh look another line comment",
|
||||
"loc": {
|
||||
"start": {
|
||||
"line": 17,
|
||||
"column": 1,
|
||||
"character": 125
|
||||
},
|
||||
"end": {
|
||||
"line": 17,
|
||||
"column": 32,
|
||||
"character": 156
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Line",
|
||||
"start": 158,
|
||||
"end": 175,
|
||||
"value": " (two, in fact)",
|
||||
"loc": {
|
||||
"start": {
|
||||
"line": 18,
|
||||
"column": 1,
|
||||
"character": 158
|
||||
},
|
||||
"end": {
|
||||
"line": 18,
|
||||
"column": 18,
|
||||
"character": 175
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Block",
|
||||
"start": 207,
|
||||
"end": 219,
|
||||
"value": " inline ",
|
||||
"loc": {
|
||||
"start": {
|
||||
"line": 22,
|
||||
"column": 6,
|
||||
"character": 207
|
||||
},
|
||||
"end": {
|
||||
"line": 22,
|
||||
"column": 18,
|
||||
"character": 219
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "Block",
|
||||
"start": 220,
|
||||
"end": 240,
|
||||
"value": " another inline ",
|
||||
"loc": {
|
||||
"start": {
|
||||
"line": 22,
|
||||
"column": 19,
|
||||
"character": 220
|
||||
},
|
||||
"end": {
|
||||
"line": 22,
|
||||
"column": 39,
|
||||
"character": 240
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
@ -0,0 +1,82 @@
|
||||
import { tick } from 'svelte';
|
||||
import { test } from '../../test';
|
||||
|
||||
export default test({
|
||||
html: `
|
||||
<button>a</button>
|
||||
<button>b</button>
|
||||
<button>resolve a</button>
|
||||
<button>resolve b</button>
|
||||
<p>pending a</p>
|
||||
`,
|
||||
async test({ assert, target }) {
|
||||
const [a, b, resolve_a, resolve_b] = target.querySelectorAll('button');
|
||||
|
||||
resolve_a.click();
|
||||
await tick();
|
||||
assert.htmlEqual(
|
||||
target.innerHTML,
|
||||
`
|
||||
<button>a</button>
|
||||
<button>b</button>
|
||||
<button>resolve a</button>
|
||||
<button>resolve b</button>
|
||||
<p>page a</p>
|
||||
`
|
||||
);
|
||||
|
||||
b.click();
|
||||
await tick();
|
||||
assert.htmlEqual(
|
||||
target.innerHTML,
|
||||
`
|
||||
<button>a</button>
|
||||
<button>b</button>
|
||||
<button>resolve a</button>
|
||||
<button>resolve b</button>
|
||||
<p>pending b</p>
|
||||
`
|
||||
);
|
||||
|
||||
a.click();
|
||||
await tick();
|
||||
assert.htmlEqual(
|
||||
target.innerHTML,
|
||||
`
|
||||
<button>a</button>
|
||||
<button>b</button>
|
||||
<button>resolve a</button>
|
||||
<button>resolve b</button>
|
||||
<p>pending a</p>
|
||||
`
|
||||
);
|
||||
|
||||
resolve_b.click();
|
||||
await tick();
|
||||
assert.htmlEqual(
|
||||
target.innerHTML,
|
||||
`
|
||||
<button>a</button>
|
||||
<button>b</button>
|
||||
<button>resolve a</button>
|
||||
<button>resolve b</button>
|
||||
<p>pending a</p>
|
||||
`
|
||||
);
|
||||
|
||||
resolve_a.click();
|
||||
await tick();
|
||||
assert.htmlEqual(
|
||||
target.innerHTML,
|
||||
`
|
||||
<button>a</button>
|
||||
<button>b</button>
|
||||
<button>resolve a</button>
|
||||
<button>resolve b</button>
|
||||
<p>page a</p>
|
||||
`
|
||||
);
|
||||
|
||||
await new Promise((r) => setTimeout(r, 100));
|
||||
}
|
||||
});
|
||||
@ -0,0 +1,52 @@
|
||||
<script>
|
||||
let page = $state('a');
|
||||
|
||||
/** @type {Array<() => void>} */
|
||||
const a = [];
|
||||
/** @type {Array<() => void>} */
|
||||
const b = [];
|
||||
|
||||
function gate(next) {
|
||||
const deferred = Promise.withResolvers();
|
||||
|
||||
if (next === 'a') a.push(deferred.resolve);
|
||||
else b.push(deferred.resolve);
|
||||
|
||||
return deferred.promise;
|
||||
}
|
||||
|
||||
function nav(next) {
|
||||
page = next;
|
||||
}
|
||||
|
||||
const to_render = $derived(page === 'a' ? snippet_a : snippet_b);
|
||||
</script>
|
||||
|
||||
<button onclick={() => nav('a')}>a</button>
|
||||
<button onclick={() => nav('b')}>b</button>
|
||||
<button onclick={() => a.shift()?.()}>resolve a</button>
|
||||
<button onclick={() => b.shift()?.()}>resolve b</button>
|
||||
|
||||
{#snippet snippet_a()}
|
||||
<svelte:boundary>
|
||||
{@const _a = await gate('a')}
|
||||
<p>page a</p>
|
||||
|
||||
{#snippet pending()}
|
||||
<p>pending a</p>
|
||||
{/snippet}
|
||||
</svelte:boundary>
|
||||
{/snippet}
|
||||
|
||||
{#snippet snippet_b()}
|
||||
<svelte:boundary>
|
||||
{@const _b = await gate('b')}
|
||||
<p>page b</p>
|
||||
|
||||
{#snippet pending()}
|
||||
<p>pending b</p>
|
||||
{/snippet}
|
||||
</svelte:boundary>
|
||||
{/snippet}
|
||||
|
||||
{@render to_render()}
|
||||
@ -0,0 +1,12 @@
|
||||
import { tick } from 'svelte';
|
||||
import { test } from '../../test';
|
||||
|
||||
export default test({
|
||||
async test({ assert, target }) {
|
||||
await tick();
|
||||
|
||||
const p = target.querySelector('p');
|
||||
assert.equal(p?.innerHTML, 'hello');
|
||||
assert.equal(window.document.title, 'hello');
|
||||
}
|
||||
});
|
||||
@ -0,0 +1,10 @@
|
||||
<script>
|
||||
let promise = Promise.resolve('hello');
|
||||
const value = $derived(await promise);
|
||||
</script>
|
||||
|
||||
<svelte:head>
|
||||
<title>{value}</title>
|
||||
</svelte:head>
|
||||
|
||||
<p>{value}</p>
|
||||
@ -0,0 +1,15 @@
|
||||
import { tick } from 'svelte';
|
||||
import { test } from '../../test';
|
||||
|
||||
export default test({
|
||||
mode: ['hydrate', 'async-server', 'client'],
|
||||
ssrHtml: '<p>caught: error (hello)</p>',
|
||||
transformError: () => {
|
||||
return 'error';
|
||||
},
|
||||
|
||||
async test({ assert, target }) {
|
||||
await tick();
|
||||
assert.htmlEqual(target.innerHTML, '<p>caught: error (hello)</p>');
|
||||
}
|
||||
});
|
||||
@ -0,0 +1,12 @@
|
||||
<script>
|
||||
import { get } from "./main.svelte";
|
||||
|
||||
let { error } = $props();
|
||||
const context = get()
|
||||
</script>
|
||||
|
||||
{#if error}
|
||||
<p>caught: {await error} ({context})</p>
|
||||
{:else}
|
||||
{await Promise.reject('catch me')}
|
||||
{/if}
|
||||
@ -0,0 +1,19 @@
|
||||
<script module>
|
||||
import { createContext } from "svelte";
|
||||
import Child from "./child.svelte";
|
||||
|
||||
const [ get, set ] = createContext();
|
||||
export {get};
|
||||
</script>
|
||||
|
||||
<script>
|
||||
set('hello');
|
||||
</script>
|
||||
|
||||
<svelte:boundary>
|
||||
{#snippet failed(error)}
|
||||
<Child {error} />
|
||||
{/snippet}
|
||||
|
||||
<Child />
|
||||
</svelte:boundary>
|
||||
@ -0,0 +1,15 @@
|
||||
import { tick } from 'svelte';
|
||||
import { test } from '../../test';
|
||||
|
||||
export default test({
|
||||
mode: ['hydrate', 'async-server', 'client'],
|
||||
ssrHtml: '<p>caught: error (hello)</p>',
|
||||
transformError: () => {
|
||||
return Promise.resolve('error');
|
||||
},
|
||||
|
||||
async test({ assert, target }) {
|
||||
await tick();
|
||||
assert.htmlEqual(target.innerHTML, '<p>caught: error (hello)</p>');
|
||||
}
|
||||
});
|
||||
@ -0,0 +1,14 @@
|
||||
<script>
|
||||
import { get } from "./main.svelte";
|
||||
|
||||
let { error } = $props();
|
||||
const context = get()
|
||||
</script>
|
||||
|
||||
{#if error}
|
||||
<p>caught: {await error} ({context})</p>
|
||||
{:else}
|
||||
{(() => {
|
||||
throw 'catch me';
|
||||
})()}
|
||||
{/if}
|
||||
@ -0,0 +1,19 @@
|
||||
<script module>
|
||||
import { createContext } from "svelte";
|
||||
import Child from "./child.svelte";
|
||||
|
||||
const [ get, set ] = createContext();
|
||||
export {get};
|
||||
</script>
|
||||
|
||||
<script>
|
||||
set('hello');
|
||||
</script>
|
||||
|
||||
<svelte:boundary>
|
||||
{#snippet failed(error)}
|
||||
<Child {error} />
|
||||
{/snippet}
|
||||
|
||||
<Child />
|
||||
</svelte:boundary>
|
||||
@ -0,0 +1,16 @@
|
||||
import { tick } from 'svelte';
|
||||
import { test } from '../../test';
|
||||
|
||||
export default test({
|
||||
mode: ['hydrate', 'async-server', 'client'],
|
||||
ssrHtml: '<p>caught: error</p>',
|
||||
transformError: (error) => {
|
||||
if (error !== 'catch me') throw 'wrong error object';
|
||||
return 'error';
|
||||
},
|
||||
|
||||
async test({ assert, target }) {
|
||||
await tick();
|
||||
assert.htmlEqual(target.innerHTML, '<p>caught: error</p>');
|
||||
}
|
||||
});
|
||||
@ -0,0 +1,7 @@
|
||||
<svelte:boundary>
|
||||
{#snippet failed(error)}
|
||||
<p>caught: {error}</p>
|
||||
{/snippet}
|
||||
|
||||
{await Promise.reject('catch me')}
|
||||
</svelte:boundary>
|
||||
@ -0,0 +1,17 @@
|
||||
import { tick } from 'svelte';
|
||||
import { test } from '../../test';
|
||||
|
||||
export default test({
|
||||
mode: ['hydrate'],
|
||||
|
||||
async test({ assert, target }) {
|
||||
const e = target.querySelector('#else-branch');
|
||||
|
||||
assert.equal(e?.isConnected, true);
|
||||
|
||||
await tick();
|
||||
|
||||
assert.equal(e?.isConnected, true);
|
||||
assert.htmlEqual(target.innerHTML, '<p id="else-branch">else branch</p>');
|
||||
}
|
||||
});
|
||||
@ -0,0 +1,5 @@
|
||||
{#if await false}
|
||||
<p id="if-branch">if branch</p>
|
||||
{:else}
|
||||
<p id="else-branch">{await 'else branch'}</p>
|
||||
{/if}
|
||||
@ -0,0 +1,61 @@
|
||||
import { test } from '../../test';
|
||||
import { tick } from 'svelte';
|
||||
|
||||
export default test({
|
||||
async test({ assert, target }) {
|
||||
const [resolveImmediate, resolveTimeout, rejectImmediate, rejectTimeout] =
|
||||
target.querySelectorAll('button');
|
||||
|
||||
rejectTimeout.click();
|
||||
await new Promise((resolve) => setTimeout(resolve, 1));
|
||||
assert.htmlEqual(
|
||||
target.innerHTML,
|
||||
`
|
||||
<button>Resolve (immediate)</button>
|
||||
<button>Resolve (timeout)</button>
|
||||
<button>Reject (immediate)</button>
|
||||
<button>Reject (timeout)</button>
|
||||
<p> err [Yeah] </p>
|
||||
`
|
||||
);
|
||||
|
||||
resolveImmediate.click();
|
||||
await tick();
|
||||
assert.htmlEqual(
|
||||
target.innerHTML,
|
||||
`
|
||||
<button>Resolve (immediate)</button>
|
||||
<button>Resolve (timeout)</button>
|
||||
<button>Reject (immediate)</button>
|
||||
<button>Reject (timeout)</button>
|
||||
<p> resolved [?] </p>
|
||||
`
|
||||
);
|
||||
|
||||
resolveTimeout.click();
|
||||
await new Promise((resolve) => setTimeout(resolve, 1));
|
||||
assert.htmlEqual(
|
||||
target.innerHTML,
|
||||
`
|
||||
<button>Resolve (immediate)</button>
|
||||
<button>Resolve (timeout)</button>
|
||||
<button>Reject (immediate)</button>
|
||||
<button>Reject (timeout)</button>
|
||||
<p> resolved [OK] </p>
|
||||
`
|
||||
);
|
||||
|
||||
rejectImmediate.click();
|
||||
await tick();
|
||||
assert.htmlEqual(
|
||||
target.innerHTML,
|
||||
`
|
||||
<button>Resolve (immediate)</button>
|
||||
<button>Resolve (timeout)</button>
|
||||
<button>Reject (immediate)</button>
|
||||
<button>Reject (timeout)</button>
|
||||
<p> err [??] </p>
|
||||
`
|
||||
);
|
||||
}
|
||||
});
|
||||
@ -0,0 +1,34 @@
|
||||
<script>
|
||||
let p = $state(null);
|
||||
</script>
|
||||
|
||||
<button onclick={()=>{
|
||||
p = new Promise((resolve, reject) => {
|
||||
resolve("?");
|
||||
});
|
||||
}}>Resolve (immediate)</button>
|
||||
<button onclick={()=>{
|
||||
p = new Promise((resolve, reject) => {
|
||||
setTimeout(() => resolve("OK"), 1);
|
||||
});
|
||||
}}>Resolve (timeout)</button>
|
||||
<button onclick={()=>{
|
||||
p = new Promise((resolve, reject) => {
|
||||
reject("??");
|
||||
});
|
||||
}}>Reject (immediate)</button>
|
||||
<button onclick={()=>{
|
||||
p = new Promise((resolve, reject) => {
|
||||
setTimeout(() => reject("Yeah"), 1);
|
||||
});
|
||||
}}>Reject (timeout)</button>
|
||||
|
||||
<p>
|
||||
{#await p}
|
||||
...
|
||||
{:then v}
|
||||
resolved [{v}]
|
||||
{:catch err}
|
||||
err [{err}]
|
||||
{/await}
|
||||
</p>
|
||||
@ -0,0 +1,5 @@
|
||||
import { test } from '../../test';
|
||||
|
||||
export default test({
|
||||
html: `42`
|
||||
});
|
||||
@ -0,0 +1,8 @@
|
||||
<script module>
|
||||
function foo() {
|
||||
const foo = $derived(42);
|
||||
return () => foo;
|
||||
}
|
||||
</script>
|
||||
|
||||
{foo()()}
|
||||
@ -0,0 +1,11 @@
|
||||
import { test } from '../../test';
|
||||
|
||||
export default test({
|
||||
test_ssr({ assert, logs }) {
|
||||
assert.deepEqual(logs, [0, 2, { count: 2 }, 0, 0, { local_count: 1 }]);
|
||||
},
|
||||
|
||||
test({ assert, logs }) {
|
||||
assert.deepEqual(logs, [0, 2, { count: 2 }, 0, 0, { local_count: 1 }]);
|
||||
}
|
||||
});
|
||||
@ -0,0 +1,21 @@
|
||||
<script>
|
||||
import { reset, increment, get, count } from './state.svelte.js';
|
||||
|
||||
reset();
|
||||
console.log(get());
|
||||
increment();
|
||||
console.log(get());
|
||||
console.log({ count });
|
||||
|
||||
let local_count = 0;
|
||||
|
||||
let s = $state(0);
|
||||
let d = $derived.by(() => {
|
||||
local_count += 1;
|
||||
return s * 2;
|
||||
});
|
||||
|
||||
console.log(d);
|
||||
console.log(d);
|
||||
console.log({ local_count });
|
||||
</script>
|
||||
@ -0,0 +1,20 @@
|
||||
let s = $state(0);
|
||||
let d = $derived.by(() => {
|
||||
count += 1;
|
||||
return s * 2;
|
||||
});
|
||||
|
||||
export let count = 0;
|
||||
|
||||
export function reset() {
|
||||
count = 0;
|
||||
s = 0;
|
||||
}
|
||||
|
||||
export function increment() {
|
||||
s += 1;
|
||||
}
|
||||
|
||||
export function get() {
|
||||
return d;
|
||||
}
|
||||
@ -0,0 +1,6 @@
|
||||
import { test } from '../../test';
|
||||
|
||||
export default test({
|
||||
mode: ['async-server', 'server'],
|
||||
html: '<p>postfix: 0, postfix_minus: 1, prefix: 1, prefix_minus: 0, count: 0</p><p>postfix_n: 0, postfix_minus_n: 1, prefix_n: 1, prefix_minus_n: 0, count_n: 0</p>'
|
||||
});
|
||||
@ -0,0 +1,17 @@
|
||||
<script>
|
||||
let count = $derived(0);
|
||||
let postfix = count++;
|
||||
let postfix_minus = count--;
|
||||
let prefix = ++count;
|
||||
let prefix_minus = --count;
|
||||
|
||||
let count_n = $derived(0n);
|
||||
let postfix_n = count_n++;
|
||||
let postfix_minus_n = count_n--;
|
||||
let prefix_n = ++count_n;
|
||||
let prefix_minus_n = --count_n;
|
||||
</script>
|
||||
|
||||
<p>postfix: {postfix}, postfix_minus: {postfix_minus}, prefix: {prefix}, prefix_minus: {prefix_minus}, count: {count}</p>
|
||||
<p>postfix_n: {postfix_n}, postfix_minus_n: {postfix_minus_n}, prefix_n: {prefix_n}, prefix_minus_n: {prefix_minus_n}, count_n: {count_n}</p>
|
||||
|
||||
@ -0,0 +1,7 @@
|
||||
<div>Hello</div>
|
||||
|
||||
<style>
|
||||
div {
|
||||
color: var(--color);
|
||||
}
|
||||
</style>
|
||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in new issue