_config.js — svelte Source File

Source Code

import { flushSync, tick } from 'svelte';
import { test } from '../../test';

// This test counts mutations on hydration
// set_class() should not mutate class on hydration, except if mismatch
export default test({
	mode: ['server', 'hydrate'],

	server_props: {
		browser: false
	},

	props: {
		browser: true
	},

	html: `
		<main id="main" class="browser">
			<div class="custom svelte-1cjqok6 foo bar" title="a title"></div>
			<span class="svelte-1cjqok6 foo bar"></span>
			<b class="custom foo bar"></b>
			<i class="foo bar"></i>

			<div class="custom svelte-1cjqok6 foo bar" title="a title"></div>
			<span class="svelte-1cjqok6 foo bar"></span>
			<b class="custom foo bar"></b>
			<i class="foo bar"></i>
		</main>
	`,

	ssrHtml: `
		<main id="main">
			<div class="custom svelte-1cjqok6 foo bar" title="a title"></div>
			<span class="svelte-1cjqok6 foo bar"></span>
			<b class="custom foo bar"></b>
			<i class="foo bar"></i>

			<div class="custom svelte-1cjqok6 foo bar" title="a title"></div>
			<span class="svelte-1cjqok6 foo bar"></span>
			<b class="custom foo bar"></b>
			<i class="foo bar"></i>
		</main>
	`,

	async test({ target, assert, component, instance }) {
		flushSync();
		tick();
		assert.deepEqual(instance.get_and_clear_mutations(), ['MAIN']);

		component.foo = false;
		flushSync();
		tick();
		assert.deepEqual(
			instance.get_and_clear_mutations(),
			['DIV', 'SPAN', 'B', 'I', 'DIV', 'SPAN', 'B', 'I'],
			'first mutation'
		);

		assert.htmlEqual(
			target.innerHTML,
// ... (67 more lines)