Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Bug: onfocus is not called when focused in an action #14385

Closed
abdel-17 opened this issue Nov 21, 2024 · 1 comment · Fixed by #14387
Closed

Bug: onfocus is not called when focused in an action #14385

abdel-17 opened this issue Nov 21, 2024 · 1 comment · Fixed by #14387
Assignees
Labels

Comments

@abdel-17
Copy link

Describe the bug

The onfocus handler is not called when the focus action focuses the input.

<script lang="ts">
	let attributes = {};

	const focus = (input) => {
		input.focus();
	};
</script>

<input
	{...attributes}
	onfocus={() => console.log("onfocus", "1")}
	use:focus
/>

If you remove the object spread, it mysteriously starts working again.

<script lang="ts">
	const focus = (input) => {
		input.focus();
	};
</script>

<input
	onfocus={() => console.log("onfocus", "1")}
	use:focus
/>

Reproduction

https://svelte.dev/playground/hello-world?version=5.2.7#H4sIAAAAAAAAE42QwWrDMBBEf0Vse7DB2CRH1zL01n-oenDsdStQV8ZaJy1C_14kOZRAoL2JN7szs_JAwydCCy9ojBUXu5pJFDhpxqmECmZt0EH76oG_lzgXAVTXredlqd0ZDUd2Ghze46MlRmIHLXRuXPXCwgz0LhWwU9ArUmyQxcC86tPG6IQUPjwpispoybGY7bhFXGhaNi6F7IWPquIE6qQXZdzh62b0dB_2QkKKR8cDY6HgoCBOdU0uEsOpm_Q5tegcGhxZnDRN7XkwG0qfHEKfwzq7sLbUH7pmf93y4w3vmuzXx7w9g_yDnq-1pBSpUUjT6ZLs5-u6_v2OkKGldKX0Rbo_fow1WBv7XijYRQVVtiz3pc1hmxVS3PSKfKPncLfI8U6R_2ce_8qEChi_GFpeNwxv4QcTXTJoegIAAA==

Logs

No response

System Info

Not needed

Severity

annoyance

@paoloricciuti
Copy link
Member

I was looking into this and i guess the problem is here: when using set_attributes all events are on the next microtask to allow for the bindings event to take precedence. This means the focus event is added after the action called focus.

// On the first run, ensure that events are added after bindings so
// that their listeners fire after the binding listeners
if (!prev) {
queue_micro_task(() => {
if (!element.isConnected) return;
for (const [key, value, evt] of events) {
if (current[key] === value) {
evt();
}
}
});
}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants