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
index 5d7232a1aa..a649d87726 100644
--- a/packages/svelte/src/compiler/phases/3-transform/client/visitors/RegularElement.js
+++ b/packages/svelte/src/compiler/phases/3-transform/client/visitors/RegularElement.js
@@ -257,7 +257,7 @@ export function RegularElement(node, context) {
if (name !== 'class' || value) {
context.state.template.set_prop(attribute.name, value === true ? '' : value);
}
- } else if (name === 'autofocus') {
+ } else if (name === 'autofocus' && !context.state.options.customRenderer) {
let { value } = build_attribute_value(attribute.value, context);
context.state.init.push(b.stmt(b.call('$.autofocus', node_id, value)));
} else if (name === 'class') {
@@ -615,7 +615,7 @@ function build_element_attribute_update(
attributes,
custom_renderer = false
) {
- if (name === 'muted') {
+ if (name === 'muted' && !custom_renderer) {
// Special case for Firefox who needs it set as a property in order to work
return b.assignment('=', b.member(node_id, b.id('muted')), value);
}
@@ -656,7 +656,7 @@ function build_element_attribute_update(
return b.call('$.set_default_checked', node_id, value);
}
- if (is_dom_property(name)) {
+ if (is_dom_property(name) && !custom_renderer) {
return b.assignment('=', b.member(node_id, name), value);
}
diff --git a/packages/svelte/tests/custom-renderers/samples/special-attributes/_config.js b/packages/svelte/tests/custom-renderers/samples/special-attributes/_config.js
index 270aa7975a..34ff2fe38c 100644
--- a/packages/svelte/tests/custom-renderers/samples/special-attributes/_config.js
+++ b/packages/svelte/tests/custom-renderers/samples/special-attributes/_config.js
@@ -2,10 +2,7 @@ import { flushSync } from 'svelte';
import { test } from '../../test';
export default test({
- test({ assert, target, serialize, dispatch_event }) {
- // Initial state
- const html = serialize(target);
-
+ test({ assert, target, dispatch_event }) {
// Find all inputs and the button
const inputs = target.children.filter(
(/** @type {any} */ n) => n.type === 'element' && n.name === 'input'
@@ -22,6 +19,8 @@ export default test({
assert.equal(input_value.attributes['value'], 'hello');
assert.equal(input_value.attributes['class'], 'hello');
assert.equal(input_value.attributes['style'], 'color: blue');
+ assert.equal(input_value.attributes['autofocus'], 'true');
+ assert.equal(input_value.attributes['muted'], 'true');
// Input 2: type="checkbox" checked=""
const input_checked = inputs[1];
diff --git a/packages/svelte/tests/custom-renderers/samples/special-attributes/main.svelte b/packages/svelte/tests/custom-renderers/samples/special-attributes/main.svelte
index 1139780d5b..2371fcac8b 100644
--- a/packages/svelte/tests/custom-renderers/samples/special-attributes/main.svelte
+++ b/packages/svelte/tests/custom-renderers/samples/special-attributes/main.svelte
@@ -8,7 +8,7 @@
let spread = $derived({value, class: class_name, style});
-
+