chore: improve test cases (#14984)

* chore: improve test cases * lint
sveltejs · Jan 13, 2025 · 36ef59d · 36ef59d
1 parent ab3290f
commit 36ef59d
Show file tree

Hide file tree

Showing 38 changed files with 164 additions and 86 deletions.
diff --git a/...ages/svelte/tests/runtime-browser/custom-elements-samples/camel-case-attribute/_config.js b/...ages/svelte/tests/runtime-browser/custom-elements-samples/camel-case-attribute/_config.js
@@ -1,3 +1,4 @@
+import { flushSync } from 'svelte';
 import { test } from '../../assert';
 const tick = () => Promise.resolve();
 
@@ -14,8 +15,7 @@ export default test({
 		el.setAttribute('camel-case', 'universe');
 		el.setAttribute('an-array', '[3,4]');
 		el.setAttribute('camelcase2', 'Hi');
-		await tick();
-		await tick();
+		flushSync();
 		assert.htmlEqual(el.shadowRoot.innerHTML, '<h1>Hi universe!</h1> <p>3</p><p>4</p>');
 		assert.htmlEqual(
 			target.innerHTML,
@@ -25,8 +25,7 @@ export default test({
 		el.camelCase = 'galaxy';
 		el.camelCase2 = 'Hey';
 		el.anArray = [5, 6];
-		await tick();
-		await tick();
+		flushSync();
 		assert.htmlEqual(el.shadowRoot.innerHTML, '<h1>Hey galaxy!</h1> <p>5</p><p>6</p>');
 		assert.htmlEqual(
 			target.innerHTML,

diff --git a/packages/svelte/tests/runtime-browser/custom-elements-samples/custom-method/_config.js b/packages/svelte/tests/runtime-browser/custom-elements-samples/custom-method/_config.js
@@ -1,3 +1,4 @@
+import { flushSync } from 'svelte';
 import { test } from '../../assert';
 const tick = () => Promise.resolve();
 
@@ -8,7 +9,8 @@ export default test({
 		/** @type {any} */
 		const el = target.querySelector('custom-element');
 
-		await el.updateFoo(42);
+		el.updateFoo(42);
+		flushSync();
 
 		const p = el.shadowRoot.querySelector('p');
 		assert.equal(p.textContent, '42');

diff --git a/...es/svelte/tests/runtime-browser/custom-elements-samples/element-effect-context/_config.js b/...es/svelte/tests/runtime-browser/custom-elements-samples/element-effect-context/_config.js
@@ -1,4 +1,5 @@
 import { test } from '../../assert';
+import { flushSync } from 'svelte';
 const tick = () => Promise.resolve();
 
 export default test({
@@ -16,7 +17,7 @@ export default test({
 		assert.equal(p.innerHTML, 'false');
 
 		button.click();
-		await tick();
+		flushSync();
 
 		assert.equal(button.innerHTML, '1');
 		assert.equal(p.innerHTML, 'false');

diff --git a/.../tests/runtime-legacy/samples/action-custom-event-handler-in-each-destructured/_config.js b/.../tests/runtime-legacy/samples/action-custom-event-handler-in-each-destructured/_config.js
@@ -1,3 +1,4 @@
+import { flushSync } from 'svelte';
 import { test } from '../../test';
 
 export default test({
@@ -10,12 +11,13 @@ export default test({
 		<p>second: </p>
 	`,
 
-	async test({ assert, component, target, window }) {
+	test({ assert, component, target, window }) {
 		const event = new window.MouseEvent('click');
 
 		const buttons = target.querySelectorAll('button');
 
-		await buttons[1].dispatchEvent(event);
+		buttons[1].dispatchEvent(event);
+		flushSync();
 
 		assert.htmlEqual(
 			target.innerHTML,

diff --git a/packages/svelte/tests/runtime-legacy/samples/action-custom-event-handler-in-each/_config.js b/packages/svelte/tests/runtime-legacy/samples/action-custom-event-handler-in-each/_config.js
@@ -1,3 +1,4 @@
+import { flushSync } from 'svelte';
 import { test } from '../../test';
 
 export default test({
@@ -10,12 +11,13 @@ export default test({
 		<p>fromState: </p>
 	`,
 
-	async test({ assert, component, target, window }) {
+	test({ assert, component, target, window }) {
 		const event = new window.MouseEvent('click');
 
 		const buttons = target.querySelectorAll('button');
 
-		await buttons[1].dispatchEvent(event);
+		buttons[1].dispatchEvent(event);
+		flushSync();
 
 		assert.htmlEqual(
 			target.innerHTML,

diff --git a/...s/svelte/tests/runtime-legacy/samples/action-custom-event-handler-node-context/_config.js b/...s/svelte/tests/runtime-legacy/samples/action-custom-event-handler-node-context/_config.js
@@ -1,17 +1,19 @@
+import { flushSync } from 'svelte';
 import { ok, test } from '../../test';
 
 export default test({
 	mode: ['client', 'hydrate'],
 
 	html: '<button>10</button>',
 
-	async test({ assert, target, window }) {
+	test({ assert, target, window }) {
 		const event = new window.MouseEvent('click');
 
 		const button = target.querySelector('button');
 		ok(button);
 
-		await button.dispatchEvent(event);
+		button.dispatchEvent(event);
+		flushSync();
 
 		assert.htmlEqual(target.innerHTML, '<button>11</button>');
 	}

diff --git a/...s/svelte/tests/runtime-legacy/samples/action-custom-event-handler-with-context/_config.js b/...s/svelte/tests/runtime-legacy/samples/action-custom-event-handler-with-context/_config.js
@@ -1,9 +1,10 @@
+import { flushSync } from 'svelte';
 import { ok, test } from '../../test';
 
 export default test({
 	html: '<button>???</button>',
 
-	async test({ assert, target, window }) {
+	test({ assert, target, window }) {
 		const event = new window.MouseEvent('click', {
 			clientX: 42,
 			clientY: 42
@@ -12,7 +13,8 @@ export default test({
 		const button = target.querySelector('button');
 		ok(button);
 
-		await button.dispatchEvent(event);
+		button.dispatchEvent(event);
+		flushSync();
 
 		assert.htmlEqual(target.innerHTML, '<button>42</button>');
 	}

diff --git a/packages/svelte/tests/runtime-legacy/samples/action-custom-event-handler/_config.js b/packages/svelte/tests/runtime-legacy/samples/action-custom-event-handler/_config.js
@@ -1,9 +1,10 @@
+import { flushSync } from 'svelte';
 import { ok, test } from '../../test';
 
 export default test({
 	html: '<button>0, 0</button>',
 
-	async test({ assert, target, window }) {
+	test({ assert, target, window }) {
 		const event = new window.MouseEvent('click', {
 			clientX: 42,
 			clientY: 42
@@ -12,7 +13,8 @@ export default test({
 		const button = target.querySelector('button');
 		ok(button);
 
-		await button.dispatchEvent(event);
+		button.dispatchEvent(event);
+		flushSync();
 
 		assert.htmlEqual(target.innerHTML, '<button>42, 42</button>');
 	}

diff --git a/packages/svelte/tests/runtime-legacy/samples/action-this/_config.js b/packages/svelte/tests/runtime-legacy/samples/action-this/_config.js
@@ -1,3 +1,4 @@
+import { flushSync } from 'svelte';
 import { ok, test } from '../../test';
 
 export default test({
@@ -8,7 +9,8 @@ export default test({
 		const click = new window.MouseEvent('click');
 
 		assert.htmlEqual(target.innerHTML, '<button>1</button>');
-		await button.dispatchEvent(click);
+		button.dispatchEvent(click);
+		flushSync();
 		assert.htmlEqual(target.innerHTML, '<button>2</button>');
 	}
 });
diff --git a/packages/svelte/tests/runtime-legacy/samples/await-mutate-array/_config.js b/packages/svelte/tests/runtime-legacy/samples/await-mutate-array/_config.js
@@ -1,3 +1,4 @@
+import { flushSync } from 'svelte';
 import { test } from '../../test';
 
 export default test({
@@ -11,7 +12,9 @@ export default test({
 		const [b1] = target.querySelectorAll('button');
 
 		b1.click();
-		await Promise.resolve();
+		Promise.resolve();
+		flushSync();
+
 		assert.htmlEqual(
 			target.innerHTML,
 			`<button>2</button><button>3</button><button>4</button>\n-------\n<button>1</button>`

diff --git a/packages/svelte/tests/runtime-legacy/samples/await-then-destruct-object-if/_config.js b/packages/svelte/tests/runtime-legacy/samples/await-then-destruct-object-if/_config.js
@@ -1,3 +1,4 @@
+import { flushSync } from 'svelte';
 import { test } from '../../test';
 
 export default test({
@@ -11,6 +12,7 @@ export default test({
 
 	async test({ assert, component, target }) {
 		await (component.thePromise = Promise.resolve({ result: 1 }));
+		flushSync();
 
 		assert.htmlEqual(
 			target.innerHTML,
@@ -21,6 +23,7 @@ export default test({
 		);
 
 		await new Promise((resolve) => setTimeout(resolve, 1));
+		flushSync();
 
 		assert.htmlEqual(
 			target.innerHTML,

diff --git a/packages/svelte/tests/runtime-legacy/samples/before-render-chain/_config.js b/packages/svelte/tests/runtime-legacy/samples/before-render-chain/_config.js
@@ -1,3 +1,4 @@
+import { flushSync } from 'svelte';
 import { test } from '../../test';
 
 export default test({
@@ -9,8 +10,9 @@ export default test({
 		<span>1</span>
 	`,
 
-	async test({ assert, component, target }) {
-		await component.list.update();
+	test({ assert, component, target }) {
+		component.list.update();
+		flushSync();
 
 		assert.htmlEqual(
 			target.innerHTML,

diff --git a/packages/svelte/tests/runtime-legacy/samples/binding-contenteditable-text-initial/_config.js b/packages/svelte/tests/runtime-legacy/samples/binding-contenteditable-text-initial/_config.js
@@ -1,3 +1,4 @@
+import { flushSync } from 'svelte';
 import { ok, test } from '../../test';
 
 export default test({
@@ -18,7 +19,7 @@ export default test({
 		<p>hello</p>
 	`,
 
-	async test({ assert, component, target, window }) {
+	test({ assert, component, target, window }) {
 		assert.equal(component.name, 'world');
 
 		const el = target.querySelector('editor');
@@ -27,7 +28,8 @@ export default test({
 		const event = new window.Event('input');
 
 		el.textContent = 'everybody';
-		await el.dispatchEvent(event);
+		el.dispatchEvent(event);
+		flushSync();
 
 		assert.htmlEqual(
 			target.innerHTML,

diff --git a/packages/svelte/tests/runtime-legacy/samples/binding-contenteditable-text/_config.js b/packages/svelte/tests/runtime-legacy/samples/binding-contenteditable-text/_config.js
@@ -1,3 +1,4 @@
+import { flushSync } from 'svelte';
 import { ok, test } from '../../test';
 
 export default test({
@@ -10,15 +11,16 @@ export default test({
 		<p>hello world</p>
 	`,
 
-	async test({ assert, component, target, window }) {
+	test({ assert, component, target, window }) {
 		const el = target.querySelector('editor');
 		ok(el);
 		assert.equal(el.textContent, 'world');
 
 		const event = new window.Event('input');
 
 		el.textContent = 'everybody';
-		await el.dispatchEvent(event);
+		el.dispatchEvent(event);
+		flushSync();
 
 		assert.htmlEqual(
 			target.innerHTML,

diff --git a/packages/svelte/tests/runtime-legacy/samples/binding-input-checkbox-indeterminate/_config.js b/packages/svelte/tests/runtime-legacy/samples/binding-input-checkbox-indeterminate/_config.js
@@ -1,3 +1,4 @@
+import { flushSync } from 'svelte';
 import { ok, test } from '../../test';
 
 export default test({
@@ -17,7 +18,7 @@ export default test({
 		<p>indeterminate? true</p>
 	`,
 
-	async test({ assert, component, target, window }) {
+	test({ assert, component, target, window }) {
 		const input = target.querySelector('input');
 		ok(input);
 
@@ -28,7 +29,8 @@ export default test({
 
 		input.checked = true;
 		input.indeterminate = false;
-		await input.dispatchEvent(event);
+		input.dispatchEvent(event);
+		flushSync();
 
 		assert.equal(component.indeterminate, false);
 		assert.equal(component.checked, true);

diff --git a/packages/svelte/tests/runtime-legacy/samples/binding-select-in-yield/_config.js b/packages/svelte/tests/runtime-legacy/samples/binding-select-in-yield/_config.js
@@ -1,3 +1,4 @@
+import { flushSync } from 'svelte';
 import { ok, test } from '../../test';
 
 export default test({
@@ -7,8 +8,9 @@ export default test({
 		return { letter: 'b' };
 	},
 
-	async test({ assert, component, target, window }) {
-		await component.modal.toggle();
+	test({ assert, component, target, window }) {
+		component.modal.toggle();
+		flushSync();
 
 		assert.htmlEqual(
 			target.innerHTML,
@@ -28,7 +30,8 @@ export default test({
 		const change = new window.MouseEvent('change');
 
 		select.options[2].selected = true;
-		await select.dispatchEvent(change);
+		select.dispatchEvent(change);
+		flushSync();
 		assert.equal(component.letter, 'c');
 
 		assert.deepEqual(
@@ -49,9 +52,9 @@ export default test({
 		`
 		);
 
-		await component.modal.toggle();
-		await component.modal.toggle();
-		await Promise.resolve();
+		component.modal.toggle();
+		component.modal.toggle();
+		flushSync();
 
 		select = target.querySelector('select');
 		ok(select);

diff --git a/packages/svelte/tests/runtime-legacy/samples/bindings-coalesced/_config.js b/packages/svelte/tests/runtime-legacy/samples/bindings-coalesced/_config.js
@@ -1,7 +1,8 @@
+import { flushSync } from 'svelte';
 import { test } from '../../test';
 
 export default test({
-	async test({ assert, component }) {
+	test({ assert, component }) {
 		const { foo, p } = component;
 
 		/** @type {string[]} */
@@ -13,7 +14,8 @@ export default test({
 			}
 		});
 
-		await foo.double();
+		foo.double();
+		flushSync();
 
 		assert.deepEqual(values, ['6']);
 	}

diff --git a/packages/svelte/tests/runtime-legacy/samples/component-props-mutated/_config.js b/packages/svelte/tests/runtime-legacy/samples/component-props-mutated/_config.js
@@ -1,3 +1,4 @@
+import { flushSync } from 'svelte';
 import { test } from '../../test';
 
 const data = {
@@ -15,9 +16,10 @@ export default test({
 
 	html: '<p>hello</p>',
 
-	async test({ assert, component, target }) {
+	test({ assert, component, target }) {
 		data.message = 'goodbye';
-		await component.$set({ data });
+		component.$set({ data });
+		flushSync();
 
 		assert.htmlEqual(target.innerHTML, '<p>goodbye</p>');
 	}