Skip to content
Merged
Show file tree
Hide file tree
Changes from 2 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions .changeset/wise-timers-look.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
'svelte': patch
---

fix: ensure muted DOM property works correctly in FF
Original file line number Diff line number Diff line change
Expand Up @@ -77,7 +77,9 @@ export function RegularElement(node, context) {

if (
node.attributes.some(
(attribute) => attribute.type === 'Attribute' && attribute.name === 'autofocus'
(attribute) =>
attribute.type === 'Attribute' &&
(attribute.name === 'autofocus' || attribute.name === 'muted')
)
) {
mark_subtree_dynamic(context.path);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -242,6 +242,7 @@
);
}
} else {
debugger;

Check failure on line 245 in packages/svelte/src/compiler/phases/3-transform/client/visitors/RegularElement.js

View workflow job for this annotation

GitHub Actions / Lint

Unexpected 'debugger' statement
/** If true, needs `__value` for inputs */
const needs_special_value_handling =
node.name === 'option' ||
Expand All @@ -263,6 +264,7 @@
if (
!is_custom_element &&
attribute.name !== 'autofocus' &&
attribute.name !== 'muted' &&
(attribute.value === true || is_text_attribute(attribute))
) {
const name = get_attribute_name(node, attribute);
Expand Down Expand Up @@ -530,6 +532,11 @@
return false;
}

if (name === 'muted') {
state.init.push(b.stmt(b.call('$.muted', node_id, value)));
return false;
}

/** @type {Statement} */
let update;

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -142,7 +142,7 @@ function is_static_element(node) {
return false;
}

if (attribute.name === 'autofocus') {
if (attribute.name === 'autofocus' || attribute.name === 'muted') {
return false;
}

Expand Down
9 changes: 9 additions & 0 deletions packages/svelte/src/internal/client/dom/elements/misc.js
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,15 @@ export function autofocus(dom, value) {
}
}

/**
* @param {HTMLVideoElement} dom
* @param {boolean} value
* @returns {void}
*/
export function muted(dom, value) {
dom.muted = value;
}

/**
* The child of a textarea actually corresponds to the defaultValue property, so we need
* to remove it upon hydration to avoid a bug when someone resets the form value.
Expand Down
2 changes: 1 addition & 1 deletion packages/svelte/src/internal/client/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -37,7 +37,7 @@ export {
} from './dom/elements/attributes.js';
export { set_class, set_svg_class, set_mathml_class, toggle_class } from './dom/elements/class.js';
export { apply, event, delegate, replay_events } from './dom/elements/events.js';
export { autofocus, remove_textarea_child } from './dom/elements/misc.js';
export { autofocus, muted, remove_textarea_child } from './dom/elements/misc.js';
export { set_style } from './dom/elements/style.js';
export { animation, transition } from './dom/elements/transitions.js';
export { bind_active_element } from './dom/elements/bindings/document.js';
Expand Down
Original file line number Diff line number Diff line change
@@ -1,2 +1,2 @@
<div><video class="svelte-xyz" autoplay muted></video>
<video muted></video></div>
<div><video class="svelte-xyz" autoplay></video>
<video></video></div>
Loading