All files / src/internal/client/dom/blocks svelte-component.js

100% Statements 41/41
100% Branches 8/8
100% Functions 1/1
100% Lines 38/38

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 392x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 2x 79x 79x 79x 79x 79x 79x 79x 79x 79x 79x 79x 79x 152x 148x 152x 67x 67x 67x 148x 152x 134x 134x 134x 79x 79x  
import { DEV } from 'esm-env';
import { block, branch, pause_effect } from '../../reactivity/effects.js';
import { empty } from '../operations.js';
 
/**
 * @template P
 * @template {(props: P) => void} C
 * @param {import('#client').TemplateNode} anchor
 * @param {() => C} get_component
 * @param {(anchor: import('#client').TemplateNode, component: C) => import('#client').Dom | void} render_fn
 * @returns {void}
 */
export function component(anchor, get_component, render_fn) {
	/** @type {C} */
	let component;
 
	/** @type {import('#client').Effect | null} */
	let effect;
 
	var component_anchor = anchor;
 
	// create a dummy anchor for the HMR wrapper, if such there be
	if (DEV) component_anchor = empty();
 
	block(anchor, 0, () => {
		if (component === (component = get_component())) return;
 
		if (effect) {
			pause_effect(effect);
			effect = null;
		}
 
		if (component) {
			if (DEV) anchor.before(component_anchor);
			effect = branch(() => render_fn(component_anchor, component));
		}
	});
}