Repository: sveltejs/svelte
File: packages/svelte/src/compiler/phases/3-transform/client/visitors/RegularElement.js (JavaScript)

Code before:
 * 		// or
 * 		$.set_attribute(element, property, value);
 * 	}
 * });
 * ```
 * Returns true if attribute is deemed reactive, false otherwise.
 * @param {AST.RegularElement} element
 * @param {Identifier} node_id
 * @param {AST.Attribute} attribute
 * @param {ComponentContext} context
 * @returns {boolean}
 */
function build_element_attribute_update_assignment(element, node_id, attribute, context) {
	const state = context.state;
	const name = get_attribute_name(element, attribute);
	const is_svg = context.state.metadata.namespace === 'svg' || element.name === 'svg';
	const is_mathml = context.state.metadata.namespace === 'mathml';
	let { has_call, value } = build_attribute_value(attribute.value, context);

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

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

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

	if (name === 'class') {
		if (attribute.metadata.expression.has_state && has_call) {
			// ensure we're not creating a separate template effect for this so that
			// potential class directives are added to the same effect and therefore always apply
			const id = b.id(state.scope.generate('class_derived'));
			state.init.push(b.const(id, create_derived(state, b.thunk(value))));
			value = b.call('$.get', id);
			has_call = false;
		}
		update = b.stmt(
			b.call(
				is_svg ? '$.set_svg_class' : is_mathml ? '$.set_mathml_class' : '$.set_class',
				node_id,
				value
			)
		);
	} else if (name === 'value') {
		update = b.stmt(b.call('$.set_value', node_id, value));
	} else if (name === 'checked') {

Review comment (suggestion):
```suggestion
	// Special case for Firefox who needs it set as a property in order to work
	if (name === 'muted') {
```

Code after:
 * 		// or
 * 		$.set_attribute(element, property, value);
 * 	}
 * });
 * ```
 * Returns true if attribute is deemed reactive, false otherwise.
 * @param {AST.RegularElement} element
 * @param {Identifier} node_id
 * @param {AST.Attribute} attribute
 * @param {ComponentContext} context
 * @returns {boolean}
 */
function build_element_attribute_update_assignment(element, node_id, attribute, context) {
	const state = context.state;
	const name = get_attribute_name(element, attribute);
	const is_svg = context.state.metadata.namespace === 'svg' || element.name === 'svg';
	const is_mathml = context.state.metadata.namespace === 'mathml';
	let { has_call, value } = build_attribute_value(attribute.value, context);

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

	// Special case for Firefox who needs it set as a property in order to work
	if (name === 'muted') {
		state.init.push(b.stmt(b.assignment('=', b.member(node_id, b.id('muted')), value)));
		return false;
	}

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

	if (name === 'class') {
		if (attribute.metadata.expression.has_state && has_call) {
			// ensure we're not creating a separate template effect for this so that
			// potential class directives are added to the same effect and therefore always apply
			const id = b.id(state.scope.generate('class_derived'));
			state.init.push(b.const(id, create_derived(state, b.thunk(value))));
			value = b.call('$.get', id);
			has_call = false;
		}
		update = b.stmt(
			b.call(
				is_svg ? '$.set_svg_class' : is_mathml ? '$.set_mathml_class' : '$.set_class',
				node_id,
				value
			)
		);
	} else if (name === 'value') {
		update = b.stmt(b.call('$.set_value', node_id, value));