From 9749ee869c4a3473a50a3a42daa2ee8896d41898 Mon Sep 17 00:00:00 2001 From: 7nik Date: Sat, 7 Feb 2026 01:09:42 +0200 Subject: [PATCH] chore: add xhtml tests (#17597) * add xhtml tests * unused * tweak * more tests * tweak * we don't need to actually check the HTML - if it's malformed in SSR or mount, it will throw * same here * unused, so we can revert this * and this --------- Co-authored-by: Rich Harris --- eslint.config.js | 1 + packages/svelte/tests/html_equal.js | 16 ++++++++-------- .../samples/attribute-quotes/_config.js | 3 +++ .../samples/attribute-quotes/main.svelte | 2 ++ .../samples/autoclosed-tags/_config.js | 3 +++ .../samples/autoclosed-tags/main.svelte | 6 ++++++ .../samples/boolean-attributes/_config.js | 5 +++++ .../samples/boolean-attributes/main.svelte | 1 + .../samples/comment-marker/_config.js | 3 +++ .../samples/comment-marker/main.svelte | 1 + .../runtime-xhtml/samples/is-xhtml/_config.js | 8 ++++++++ .../samples/is-xhtml/main.svelte | 5 +++++ .../samples/void-tags/_config.js | 3 +++ .../samples/void-tags/main.svelte | 15 +++++++++++++++ packages/svelte/tests/runtime-xhtml/test.ts | 9 +++++++++ vitest-xhtml-environment.ts | 19 +++++++++++++++++++ 16 files changed, 92 insertions(+), 8 deletions(-) create mode 100644 packages/svelte/tests/runtime-xhtml/samples/attribute-quotes/_config.js create mode 100644 packages/svelte/tests/runtime-xhtml/samples/attribute-quotes/main.svelte create mode 100644 packages/svelte/tests/runtime-xhtml/samples/autoclosed-tags/_config.js create mode 100644 packages/svelte/tests/runtime-xhtml/samples/autoclosed-tags/main.svelte create mode 100644 packages/svelte/tests/runtime-xhtml/samples/boolean-attributes/_config.js create mode 100644 packages/svelte/tests/runtime-xhtml/samples/boolean-attributes/main.svelte create mode 100644 packages/svelte/tests/runtime-xhtml/samples/comment-marker/_config.js create mode 100644 packages/svelte/tests/runtime-xhtml/samples/comment-marker/main.svelte create mode 100644 packages/svelte/tests/runtime-xhtml/samples/is-xhtml/_config.js create mode 100644 packages/svelte/tests/runtime-xhtml/samples/is-xhtml/main.svelte create mode 100644 packages/svelte/tests/runtime-xhtml/samples/void-tags/_config.js create mode 100644 packages/svelte/tests/runtime-xhtml/samples/void-tags/main.svelte create mode 100644 packages/svelte/tests/runtime-xhtml/test.ts create mode 100644 vitest-xhtml-environment.ts diff --git a/eslint.config.js b/eslint.config.js index 0e0e0bc729..04d9294394 100644 --- a/eslint.config.js +++ b/eslint.config.js @@ -102,6 +102,7 @@ export default [ 'playgrounds/sandbox/**', // exclude top level config files '*.config.js', + 'vitest-xhtml-environment.ts', // documentation can contain invalid examples 'documentation', 'tmp/**' diff --git a/packages/svelte/tests/html_equal.js b/packages/svelte/tests/html_equal.js index 76a4a957a5..cdb8f52e37 100644 --- a/packages/svelte/tests/html_equal.js +++ b/packages/svelte/tests/html_equal.js @@ -9,7 +9,9 @@ function clean_children(node, opts) { let previous = null; let has_element_children = false; let template = - node.nodeName === 'TEMPLATE' ? /** @type {HTMLTemplateElement} */ (node) : undefined; + node.nodeName.toUpperCase() === 'TEMPLATE' + ? /** @type {HTMLTemplateElement} */ (node) + : undefined; if (template) { const div = document.createElement('div'); @@ -23,22 +25,20 @@ function clean_children(node, opts) { }); attributes.forEach((attr) => { - node.removeAttribute(attr.name); + if (attr.name !== 'xmlns') node.removeAttribute(attr.name); }); - attributes.forEach((attr) => { + attributes.forEach(({ name, value }) => { // Strip out the special onload/onerror hydration events from the test output - if ((attr.name === 'onload' || attr.name === 'onerror') && attr.value === 'this.__e=event') { + if (['onload', 'onerror', 'xmlns'].includes(name) && value === 'this.__e=event') { return; } - let value = attr.value; - - if (attr.name === 'class') { + if (name === 'class') { value = value.replace(/svelte-\w+/, 'svelte-xyz123'); } - node.setAttribute(attr.name, value); + node.setAttribute(name, value); }); for (let child of [...node.childNodes]) { diff --git a/packages/svelte/tests/runtime-xhtml/samples/attribute-quotes/_config.js b/packages/svelte/tests/runtime-xhtml/samples/attribute-quotes/_config.js new file mode 100644 index 0000000000..f47bee71df --- /dev/null +++ b/packages/svelte/tests/runtime-xhtml/samples/attribute-quotes/_config.js @@ -0,0 +1,3 @@ +import { test } from '../../test'; + +export default test({}); diff --git a/packages/svelte/tests/runtime-xhtml/samples/attribute-quotes/main.svelte b/packages/svelte/tests/runtime-xhtml/samples/attribute-quotes/main.svelte new file mode 100644 index 0000000000..82db611c12 --- /dev/null +++ b/packages/svelte/tests/runtime-xhtml/samples/attribute-quotes/main.svelte @@ -0,0 +1,2 @@ +
+
diff --git a/packages/svelte/tests/runtime-xhtml/samples/autoclosed-tags/_config.js b/packages/svelte/tests/runtime-xhtml/samples/autoclosed-tags/_config.js new file mode 100644 index 0000000000..f47bee71df --- /dev/null +++ b/packages/svelte/tests/runtime-xhtml/samples/autoclosed-tags/_config.js @@ -0,0 +1,3 @@ +import { test } from '../../test'; + +export default test({}); diff --git a/packages/svelte/tests/runtime-xhtml/samples/autoclosed-tags/main.svelte b/packages/svelte/tests/runtime-xhtml/samples/autoclosed-tags/main.svelte new file mode 100644 index 0000000000..18a4463ce1 --- /dev/null +++ b/packages/svelte/tests/runtime-xhtml/samples/autoclosed-tags/main.svelte @@ -0,0 +1,6 @@ + +
+

+ + +
diff --git a/packages/svelte/tests/runtime-xhtml/samples/boolean-attributes/_config.js b/packages/svelte/tests/runtime-xhtml/samples/boolean-attributes/_config.js new file mode 100644 index 0000000000..f965e04b02 --- /dev/null +++ b/packages/svelte/tests/runtime-xhtml/samples/boolean-attributes/_config.js @@ -0,0 +1,5 @@ +import { test } from '../../test'; + +export default test({ + skip: true +}); diff --git a/packages/svelte/tests/runtime-xhtml/samples/boolean-attributes/main.svelte b/packages/svelte/tests/runtime-xhtml/samples/boolean-attributes/main.svelte new file mode 100644 index 0000000000..3d2fc88d10 --- /dev/null +++ b/packages/svelte/tests/runtime-xhtml/samples/boolean-attributes/main.svelte @@ -0,0 +1 @@ + diff --git a/packages/svelte/tests/runtime-xhtml/samples/comment-marker/_config.js b/packages/svelte/tests/runtime-xhtml/samples/comment-marker/_config.js new file mode 100644 index 0000000000..f47bee71df --- /dev/null +++ b/packages/svelte/tests/runtime-xhtml/samples/comment-marker/_config.js @@ -0,0 +1,3 @@ +import { test } from '../../test'; + +export default test({}); diff --git a/packages/svelte/tests/runtime-xhtml/samples/comment-marker/main.svelte b/packages/svelte/tests/runtime-xhtml/samples/comment-marker/main.svelte new file mode 100644 index 0000000000..8dd87ce81e --- /dev/null +++ b/packages/svelte/tests/runtime-xhtml/samples/comment-marker/main.svelte @@ -0,0 +1 @@ +{#each [1,2] as i}{i}{/each} diff --git a/packages/svelte/tests/runtime-xhtml/samples/is-xhtml/_config.js b/packages/svelte/tests/runtime-xhtml/samples/is-xhtml/_config.js new file mode 100644 index 0000000000..52dddb4ad7 --- /dev/null +++ b/packages/svelte/tests/runtime-xhtml/samples/is-xhtml/_config.js @@ -0,0 +1,8 @@ +import { test } from '../../test'; + +export default test({ + mode: ['client'], + test({ assert, target }) { + assert.htmlEqual(target.innerHTML, `
div
`); + } +}); diff --git a/packages/svelte/tests/runtime-xhtml/samples/is-xhtml/main.svelte b/packages/svelte/tests/runtime-xhtml/samples/is-xhtml/main.svelte new file mode 100644 index 0000000000..27a4378d0f --- /dev/null +++ b/packages/svelte/tests/runtime-xhtml/samples/is-xhtml/main.svelte @@ -0,0 +1,5 @@ + +
{nodeName}
diff --git a/packages/svelte/tests/runtime-xhtml/samples/void-tags/_config.js b/packages/svelte/tests/runtime-xhtml/samples/void-tags/_config.js new file mode 100644 index 0000000000..f47bee71df --- /dev/null +++ b/packages/svelte/tests/runtime-xhtml/samples/void-tags/_config.js @@ -0,0 +1,3 @@ +import { test } from '../../test'; + +export default test({}); diff --git a/packages/svelte/tests/runtime-xhtml/samples/void-tags/main.svelte b/packages/svelte/tests/runtime-xhtml/samples/void-tags/main.svelte new file mode 100644 index 0000000000..08ea2838b3 --- /dev/null +++ b/packages/svelte/tests/runtime-xhtml/samples/void-tags/main.svelte @@ -0,0 +1,15 @@ + + +
+ + +
+ + + + + + + + + diff --git a/packages/svelte/tests/runtime-xhtml/test.ts b/packages/svelte/tests/runtime-xhtml/test.ts new file mode 100644 index 0000000000..416300dc58 --- /dev/null +++ b/packages/svelte/tests/runtime-xhtml/test.ts @@ -0,0 +1,9 @@ +// @vitest-environment vitest-xhtml-environment.ts + +import { runtime_suite, ok } from '../runtime-legacy/shared'; + +const { test, run } = runtime_suite(true); + +export { test, ok }; + +await run(__dirname); diff --git a/vitest-xhtml-environment.ts b/vitest-xhtml-environment.ts new file mode 100644 index 0000000000..dc8b271440 --- /dev/null +++ b/vitest-xhtml-environment.ts @@ -0,0 +1,19 @@ +import { type Environment, builtinEnvironments } from 'vitest/environments'; + +const xhtml_page = ` + +`; + +export default { + name: 'jsdom-xhtml', + transformMode: 'web', + setup(global, { jsdom = {} }) { + return builtinEnvironments.jsdom.setup(global, { + jsdom: { + ...jsdom, + html: xhtml_page, + contentType: 'application/xhtml+xml' + } + }); + } +};