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

A11y: A form label must be associated with a control. (When label actually has control element) #5528

Closed
ZerdoX-x opened this issue Oct 15, 2020 · 9 comments · Fixed by #5323

Comments

@ZerdoX-x
Copy link
Contributor

Case when labelable element is not direct child of label element triggers current warning

https://svelte.dev/repl/418bcf45f55741e49361839687cf11fa?version=3.29.0

Expected behavior: compiler recursively checks if label has labelable element

Additional context:
I started to write recursive function to get this warning working properly but then I found #5323 PR that covers my issue

@ZerdoX-x
Copy link
Contributor Author

There is opened PR but there are no opened issues about this bug. That's the reason why I opened this issue

@stephane-vanraes
Copy link
Contributor

Possible related:

https://svelte.dev/repl/c16ecfdb7f484b5190692bb08bd0ea32?version=3.29.0

Warning if the actual form element is conditional

<label>
	{#if A}
		<input type="text">
	{:else}
		<textarea></textarea>
	{/if}
</label>

This gives: "A11y: A form label must be associated with a control."

@ZerdoX-x ZerdoX-x changed the title A11y: A form label must be associated with a control. A11y: A form label must be associated with a control. (When label actually has control element) Oct 15, 2020
@ZerdoX-x
Copy link
Contributor Author

I guess this warning should be emitted? Checking recursively all child elements, components, conditions, etc. may be really slow and the implementation is not so easy

@ghost
Copy link

ghost commented Feb 21, 2021

I'm suffering this warning as well. If it happens on own components, we just set "id" and "for". But if it happens on library's components, we can't fix it. At least, I'd like to avoid this situation.

@ZerdoX-x
Copy link
Contributor Author

ZerdoX-x commented Mar 9, 2021

If it happens on own components, we just set "id" and "for".

Pay attention that if you will use one component with static id inside more than once in the same document it won't be valid html markup. That's the reason why this workaround is not for everyone.

@stale
Copy link

stale bot commented Jun 26, 2021

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

@stale stale bot added the stale-bot label Jun 26, 2021
@ZerdoX-x
Copy link
Contributor Author

I think this warning should appear only if label 100% can't have control element. I'll try to give example or even PR soon

@stale
Copy link

stale bot commented Dec 23, 2021

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

@Conduitry
Copy link
Member

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

Successfully merging a pull request may close this issue.

5 participants