clean_children() — svelte Function Reference

Architecture documentation for the clean_children() function in html_equal.js from the svelte codebase.

Function javascript BuildSystem QualityControl called by 1

Entity Profile

BuildSystem→ QualityControl→ clean_children() — svelte Function Reference

Dependency Diagram

graph TD
  d424cec2_cc06_a0df_bec0_d22ad207a690["clean_children()"]
  7e13368c_af2f_099c_e7e1_de404629548f["html_equal.js"]
  d424cec2_cc06_a0df_bec0_d22ad207a690 -->|defined in| 7e13368c_af2f_099c_e7e1_de404629548f
  962cf561_9ad9_cab0_dcda_622ebeb2d812["normalize_html()"]
  962cf561_9ad9_cab0_dcda_622ebeb2d812 -->|calls| d424cec2_cc06_a0df_bec0_d22ad207a690
  style d424cec2_cc06_a0df_bec0_d22ad207a690 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/svelte/tests/html_equal.js lines 8–115

function clean_children(node, opts) {
	let previous = null;
	let has_element_children = false;
	let template =
		node.nodeName.toUpperCase() === 'TEMPLATE'
			? /** @type {HTMLTemplateElement} */ (node)
			: undefined;

	if (template) {
		const div = document.createElement('div');
		div.append(template.content);
		node = div;
	}

	// sort attributes
	const attributes = Array.from(node.attributes).sort((a, b) => {
		return a.name < b.name ? -1 : 1;
	});

	attributes.forEach((attr) => {
		if (attr.name !== 'xmlns') node.removeAttribute(attr.name);
	});

	attributes.forEach(({ name, value }) => {
		// Strip out the special onload/onerror hydration events from the test output
		if (['onload', 'onerror', 'xmlns'].includes(name) && value === 'this.__e=event') {
			return;
		}

		if (name === 'class') {
			value = value.replace(/svelte-\w+/, 'svelte-xyz123');
		}

		node.setAttribute(name, value);
	});

	for (let child of [...node.childNodes]) {
		if (child.nodeType === TEXT_NODE) {
			let text = /** @type {Text} */ (child);

			if (
				node.namespaceURI === 'http://www.w3.org/2000/svg' &&
				node.tagName !== 'text' &&
				node.tagName !== 'tspan'
			) {
				node.removeChild(child);
				continue;
			}

			text.data = text.data.replace(/[^\S]+/g, ' ');

			if (previous && previous.nodeType === TEXT_NODE) {
				const prev = /** @type {Text} */ (previous);

				prev.data += text.data;
				node.removeChild(text);

				text = prev;
				text.data = text.data.replace(/[^\S]+/g, ' ');

				continue;
			}
		}

		if (child.nodeType === COMMENT_NODE && !opts.preserveComments) {
			// comment
			child.remove();
			continue;
		}

		// add newlines for better readability and potentially recurse into children
		if (child.nodeType === ELEMENT_NODE || child.nodeType === COMMENT_NODE) {
			if (previous?.nodeType === TEXT_NODE) {
				const prev = /** @type {Text} */ (previous);
				prev.data = prev.data.replace(/^[^\S]+$/, '\n');
			} else if (previous?.nodeType === ELEMENT_NODE || previous?.nodeType === COMMENT_NODE) {
				node.insertBefore(document.createTextNode('\n'), child);
			}

			if (child.nodeType === ELEMENT_NODE) {
				has_element_children = true;