return instance _and_ props in runes mode, move flushSync into shared code, don't set accessors in runes mode

pull/11277/head
Simon Holthausen 2 months ago
parent 758ac0065d
commit a47827e57d

@ -131,7 +131,7 @@ async function common_setup(cwd: string, runes: boolean | undefined, config: Run
generate: 'client',
...config.compileOptions,
immutable: config.immutable,
accessors: 'accessors' in config ? config.accessors : true,
accessors: 'accessors' in config ? config.accessors : runes ? undefined : true,
runes
};
@ -284,20 +284,35 @@ async function run_test_variant(
};
let instance: any;
let props: any;
let component: any;
if (runes) {
props = proxy({ ...(config.props || {}) });
const props: any = proxy({ ...(config.props || {}) });
const render = variant === 'hydrate' ? hydrate : mount;
instance = render(mod.default, {
target,
props,
intro: config.intro,
recover: config.recover ?? false
});
component = new Proxy(instance, {
get(target, key) {
if (key in target) return target[key];
return props[key];
},
set(target, key, value) {
if (key in target) {
target[key] = value;
} else {
flushSync(() => (props[key] = value));
}
return true;
}
});
} else {
instance = createClassComponent({
instance = component = createClassComponent({
component: mod.default,
props: config.props,
target,
@ -336,7 +351,7 @@ async function run_test_variant(
htmlEqualWithOptions: assert_html_equal_with_options
},
variant,
component: runes ? props : instance,
component,
mod,
target,
snapshot,

@ -1,4 +1,3 @@
import { flushSync } from 'svelte';
import { test } from '../../test';
export default test({
@ -28,7 +27,7 @@ export default test({
logs.length = 0;
flushSync(() => (component.n += 1));
component.n += 1;
assert.deepEqual(logs, [
'parent: $effect.pre 1',

@ -1,4 +1,3 @@
import { flushSync } from 'svelte';
import { test } from '../../test';
export default test({
@ -23,7 +22,7 @@ export default test({
logs.length = 0;
flushSync(() => (component.n += 1));
component.n += 1;
assert.deepEqual(logs, [
'parent: render 1',

@ -1,4 +1,3 @@
import { flushSync } from 'svelte';
import { test } from '../../test';
export default test({
@ -27,8 +26,7 @@ export default test({
]);
logs.length = 0;
flushSync(() => (component.n += 1));
component.n += 1;
assert.deepEqual(logs, [
'parent: $effect.pre 1',

@ -1,4 +1,3 @@
import { flushSync } from 'svelte';
import { test } from '../../test';
export default test({
@ -10,7 +9,7 @@ export default test({
assert.deepEqual(logs, ['$effect.pre 0', 'another $effect.pre 1', 'render n0', 'render i1']);
logs.length = 0;
flushSync(() => (component.n += 1));
component.n += 1;
assert.deepEqual(logs, ['$effect.pre 1', 'another $effect.pre 2', 'render n1', 'render i2']);
}

@ -1,4 +1,3 @@
import { flushSync } from 'svelte';
import { test } from '../../test';
export default test({
@ -23,8 +22,7 @@ export default test({
]);
logs.length = 0;
flushSync(() => (component.n += 1));
component.n += 1;
assert.deepEqual(logs, [
'parent: $effect.pre 1',

@ -1,4 +1,3 @@
import { flushSync } from '../../../../src/index-client.js';
import { test } from '../../test';
// Tests that default values only fire lazily when the prop is undefined, and every time
@ -13,24 +12,20 @@ export default test({
html: `<p>props: 0 0 0 0 1 1 1 1</p><p>log: nested.fallback_value,fallback_fn`,
async test({ assert, target, component }) {
flushSync(() => {
component.p0 = undefined;
component.p1 = undefined;
component.p2 = undefined;
component.p3 = undefined;
});
component.p0 = undefined;
component.p1 = undefined;
component.p2 = undefined;
component.p3 = undefined;
assert.htmlEqual(
target.innerHTML,
`<p>props: 1 1 1 1 1 1 1 1</p><p>log: nested.fallback_value,fallback_fn,nested.fallback_value,fallback_fn`
);
flushSync(() => {
component.p4 = undefined;
component.p5 = undefined;
component.p6 = undefined;
component.p7 = undefined;
});
component.p4 = undefined;
component.p5 = undefined;
component.p6 = undefined;
component.p7 = undefined;
assert.htmlEqual(
target.innerHTML,

@ -1,4 +1,3 @@
import { flushSync } from 'svelte';
import { test } from '../../test';
export default test({
@ -9,7 +8,7 @@ export default test({
html: `hello`,
async test({ assert, target, component }) {
flushSync(() => (component['kebab-case'] = 'goodbye'));
component['kebab-case'] = 'goodbye';
assert.htmlEqual(target.innerHTML, `goodbye`);
}
});

@ -1,4 +1,3 @@
import { flushSync } from 'svelte';
import { test } from '../../test';
export default test({
@ -14,10 +13,10 @@ export default test({
html: `x 1 2 3 z`,
async test({ assert, target, component }) {
flushSync(() => (component.foo = 'y'));
component.foo = 'y';
assert.htmlEqual(target.innerHTML, `y 1 2 3 z`);
flushSync(() => (component.bar = 'w'));
component.bar = 'w';
assert.htmlEqual(target.innerHTML, `y 1 2 3 w`);
}
});

@ -1,4 +1,3 @@
import { flushSync } from '../../../../src/index-client.js';
import { test } from '../../test';
export default test({
@ -6,10 +5,8 @@ export default test({
const div = /** @type {HTMLDivElement & { foo?: number }} */ (target.querySelector('div'));
assert.equal(div.foo, undefined);
flushSync(() => {
component.foo = 2;
component.visible = false;
});
component.foo = 2;
component.visible = false;
assert.equal(div.foo, 2);
}
});

Loading…
Cancel
Save