default.test() — svelte Function Reference

Architecture documentation for the default.test() function in _config.js from the svelte codebase.

Function javascript BuildSystem MessageProcessor

Entity Profile

BuildSystem→ MessageProcessor→ default.test() — svelte Function Reference

Dependency Diagram

graph TD
  b76acdec_5294_8f46_d69d_5d68a4bebf14["default.test()"]
  39468cb2_2975_61dc_c017_bbb962b0c129["_config.js"]
  b76acdec_5294_8f46_d69d_5d68a4bebf14 -->|defined in| 39468cb2_2975_61dc_c017_bbb962b0c129
  style b76acdec_5294_8f46_d69d_5d68a4bebf14 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/svelte/tests/runtime-legacy/samples/key-block-transition-local/_config.js lines 8–40

	test({ assert, component, target, raf }) {
		component.x = true;

		let div = /** @type {HTMLDivElement & { foo: number }} */ (target.querySelector('div'));
		raf.tick(0);
		assert.equal(div.foo, undefined);

		// play both in and out transition when changed with `{#key}`
		component.y = 2;
		assert.htmlEqual(target.innerHTML, '<div></div><div></div>');
		const [leaving, incoming] = /** @type {NodeListOf<HTMLDivElement & { foo: number }>} */ (
			target.querySelectorAll('div')
		);

		raf.tick(50);
		assert.equal(leaving.foo, 0.5);
		assert.equal(incoming.foo, 0.5);

		raf.tick(100);
		assert.htmlEqual(target.innerHTML, '<div></div>');
		assert.equal(leaving.foo, 0);
		assert.equal(incoming.foo, 1);

		// do not play out transition when removed by `{#if}`
		component.x = false;
		assert.htmlEqual(target.innerHTML, '');

		// do not play in transition when added back with `{#if}`
		component.x = true;
		assert.htmlEqual(target.innerHTML, '<div></div>');
		div = /** @type {HTMLDivElement & { foo: number }} */ (target.querySelector('div'));
		assert.equal(div.foo, undefined);
	}