mirror of https://github.com/sveltejs/svelte
parent
954eb8d839
commit
3cb7b7926b
@ -0,0 +1,23 @@
|
||||
import { flushSync } from 'svelte';
|
||||
import { test } from '../../test';
|
||||
|
||||
export default test({
|
||||
async test({ assert, target, logs }) {
|
||||
const [btn, btn2, btn3] = target.querySelectorAll('button');
|
||||
|
||||
flushSync(() => {
|
||||
btn.click();
|
||||
});
|
||||
assert.deepEqual(logs, ['arr']);
|
||||
|
||||
flushSync(() => {
|
||||
btn2.click();
|
||||
});
|
||||
assert.deepEqual(logs, ['arr', 'arr']);
|
||||
|
||||
flushSync(() => {
|
||||
btn3.click();
|
||||
});
|
||||
assert.deepEqual(logs, ['arr', 'arr', 'arr']);
|
||||
}
|
||||
});
|
@ -0,0 +1,11 @@
|
||||
<script>
|
||||
let arr = $state([0,1,2], {
|
||||
onchange(){
|
||||
console.log("arr");
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<button onclick={()=> arr.push(arr.length)}>push</button>
|
||||
<button onclick={()=>arr.splice(0, 2)}>splice</button>
|
||||
<button onclick={()=>arr.sort((a,b)=>b-a)}>sort</button>
|
@ -0,0 +1,27 @@
|
||||
import { flushSync } from 'svelte';
|
||||
import { test } from '../../test';
|
||||
|
||||
export default test({
|
||||
async test({ assert, target, logs }) {
|
||||
const [btn, btn2, btn3] = target.querySelectorAll('button');
|
||||
|
||||
assert.deepEqual(logs, ['constructor count', 'constructor proxy']);
|
||||
|
||||
logs.length = 0;
|
||||
|
||||
flushSync(() => {
|
||||
btn.click();
|
||||
});
|
||||
assert.deepEqual(logs, ['class count']);
|
||||
|
||||
flushSync(() => {
|
||||
btn2.click();
|
||||
});
|
||||
assert.deepEqual(logs, ['class count', 'class proxy']);
|
||||
|
||||
flushSync(() => {
|
||||
btn3.click();
|
||||
});
|
||||
assert.deepEqual(logs, ['class count', 'class proxy', 'class proxy']);
|
||||
}
|
||||
});
|
@ -0,0 +1,37 @@
|
||||
<script>
|
||||
class Test{
|
||||
count = $state(0, {
|
||||
onchange(){
|
||||
console.log("class count");
|
||||
}
|
||||
})
|
||||
proxy = $state({count: 0}, {
|
||||
onchange(){
|
||||
console.log("class proxy");
|
||||
}
|
||||
})
|
||||
|
||||
#in_constructor = $state(0, {
|
||||
onchange(){
|
||||
console.log("constructor count");
|
||||
}
|
||||
});
|
||||
|
||||
#in_constructor_proxy = $state({ count: 0 }, {
|
||||
onchange(){
|
||||
console.log("constructor proxy");
|
||||
}
|
||||
});
|
||||
|
||||
constructor(){
|
||||
this.#in_constructor = 42;
|
||||
this.#in_constructor_proxy.count++;
|
||||
}
|
||||
}
|
||||
|
||||
const class_test = new Test();
|
||||
</script>
|
||||
|
||||
<button onclick={()=> class_test.count++}>{class_test.count}</button>
|
||||
<button onclick={()=> class_test.proxy.count++}>{class_test.proxy.count}</button>
|
||||
<button onclick={()=> class_test.proxy = {count: class_test.proxy.count+1}}>{class_test.proxy.count}</button>
|
@ -0,0 +1,18 @@
|
||||
import { flushSync } from 'svelte';
|
||||
import { test } from '../../test';
|
||||
|
||||
export default test({
|
||||
async test({ assert, target, logs }) {
|
||||
const [btn, btn2] = target.querySelectorAll('button');
|
||||
|
||||
flushSync(() => {
|
||||
btn.click();
|
||||
});
|
||||
assert.deepEqual(logs, ['proxy']);
|
||||
|
||||
flushSync(() => {
|
||||
btn2.click();
|
||||
});
|
||||
assert.deepEqual(logs, ['proxy', 'proxy']);
|
||||
}
|
||||
});
|
@ -0,0 +1,10 @@
|
||||
<script>
|
||||
let proxy = $state({count: 0}, {
|
||||
onchange(){
|
||||
console.log("proxy");
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<button onclick={()=> proxy.count++}>{proxy.count}</button>
|
||||
<button onclick={()=> proxy = {count: proxy.count+1}}>{proxy.count}</button>
|
Loading…
Reference in new issue