fix: ensure video elements autoplay in safari (#14095)

sveltejs · Nov 1, 2024 · a315a14 · a315a14
1 parent 7d11fa8
commit a315a14
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 1 deletion.
diff --git a/.changeset/empty-hairs-love.md b/.changeset/empty-hairs-love.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ensure video elements autoplay in safari
diff --git a/packages/svelte/src/compiler/phases/3-transform/client/visitors/RegularElement.js b/packages/svelte/src/compiler/phases/3-transform/client/visitors/RegularElement.js
@@ -61,11 +61,13 @@ export function RegularElement(node, context) {
 
 	const is_custom_element = is_custom_element_node(node);
 
-	if (is_custom_element) {
+	if (node.name === 'video' || is_custom_element) {
 		// cloneNode is faster, but it does not instantiate the underlying class of the
 		// custom element until the template is connected to the dom, which would
 		// cause problems when setting properties on the custom element.
 		// Therefore we need to use importNode instead, which doesn't have this caveat.
+		// Additionally, Webkit browsers need importNode for video elements for autoplay
+		// to work correctly.
 		context.state.metadata.context.template_needs_import_node = true;
 	}