mirror of https://github.com/sveltejs/svelte
parent
a77eca23db
commit
575d0fcfe7
@ -0,0 +1,61 @@
|
||||
import { test } from '../../test';
|
||||
|
||||
export default test({
|
||||
skip: true, // TODO `array.reverse()` doesn't trigger each block update
|
||||
|
||||
html: `
|
||||
<button>1 + 2 + 3 = 6</button>
|
||||
<button>clear</button>
|
||||
<button>reverse</button>
|
||||
<span>1</span>
|
||||
<span>2</span>
|
||||
<span>3</span>
|
||||
<strong>array[1]: 2</strong>
|
||||
`,
|
||||
|
||||
async test({ assert, target }) {
|
||||
const [add, clear, reverse] = target.querySelectorAll('button');
|
||||
|
||||
await add?.click();
|
||||
assert.htmlEqual(
|
||||
target.innerHTML,
|
||||
`
|
||||
<button>1 + 2 + 3 + 4 = 10</button>
|
||||
<button>clear</button>
|
||||
<button>reverse</button>
|
||||
<span>1</span>
|
||||
<span>2</span>
|
||||
<span>3</span>
|
||||
<span>4</span>
|
||||
<strong>array[1]: 2</strong>
|
||||
`
|
||||
);
|
||||
|
||||
await reverse?.click();
|
||||
assert.htmlEqual(
|
||||
target.innerHTML,
|
||||
`
|
||||
<button>4 + 3 + 2 + 1 = 10</button>
|
||||
<button>clear</button>
|
||||
<button>reverse</button>
|
||||
<span>4</span>
|
||||
<span>3</span>
|
||||
<span>2</span>
|
||||
<span>1</span>
|
||||
<strong>array[1]: 3</strong>
|
||||
`
|
||||
);
|
||||
|
||||
await clear?.click();
|
||||
assert.htmlEqual(
|
||||
target.innerHTML,
|
||||
`
|
||||
<button>4 = 4</button>
|
||||
<button>clear</button>
|
||||
<button>reverse</button>
|
||||
<span>4</span>
|
||||
<strong>array[1]: undefined</strong>
|
||||
`
|
||||
);
|
||||
}
|
||||
});
|
@ -0,0 +1,24 @@
|
||||
<script>
|
||||
import { magic } from 'svelte';
|
||||
|
||||
const array = magic([1, 2, 3]);
|
||||
const sum = $derived(array.reduce((a, b) => a + b, 0));
|
||||
</script>
|
||||
|
||||
<button onclick={() => array.push(array.length + 1)}>
|
||||
{array.join(' + ')} = {sum}
|
||||
</button>
|
||||
|
||||
<button onclick={() => array.length = 1}>
|
||||
clear
|
||||
</button>
|
||||
|
||||
<button onclick={() => array.reverse()}>
|
||||
reverse
|
||||
</button>
|
||||
|
||||
{#each array as n}
|
||||
<span>{n}</span>
|
||||
{/each}
|
||||
|
||||
<strong>array[1]: {array[1]}</strong>
|
Loading…
Reference in new issue