Replies: 2 comments 1 reply
-
I noticed this yesterday too. Guess Chrome has recently introduced this check. I think Chrome is incorrect here though, according to https://www.w3.org/WAI/WCAG21/Techniques/aria/ARIA9 The value of the aria-labelledby attribute is then a space-separated list of all ids in the order in which the label strings referenced should be read by screen readers. The |
Beta Was this translation helpful? Give feedback.
-
Technically, from an HTML perspective, the We could fix this warning by having each Alternatively, we could change these |
Beta Was this translation helpful? Give feedback.
-
everytime my react app initializes a videojs element i get some chrome warnings around labels:
![image](https://private-user-images.githubusercontent.com/78234668/265055257-6bfe9b37-51f2-401c-95d2-30f6f44f1d8f.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MTk4MTc2OTcsIm5iZiI6MTcxOTgxNzM5NywicGF0aCI6Ii83ODIzNDY2OC8yNjUwNTUyNTctNmJmZTliMzctNTFmMi00MDFjLTk1ZDItMzBmNmY0NGYxZDhmLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA3MDElMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwNzAxVDA3MDMxN1omWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTU2NWFkY2UzYjA0YjU2NGRmNWU1OWMxNzU2NjA2YTg3MWZlOTQ3MWQwYThmOTYzN2U5YzIyMTUxNTNmY2NkYTQmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.rAgF6HuoDaFMt8UW4LwOC2CgArMF5tygMHqnedHTGW8)
the 'violating node' is this:
![image](https://private-user-images.githubusercontent.com/78234668/265056292-9b7acbdd-1126-44e6-b97d-39ed58723bda.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MTk4MTc2OTcsIm5iZiI6MTcxOTgxNzM5NywicGF0aCI6Ii83ODIzNDY2OC8yNjUwNTYyOTItOWI3YWNiZGQtMTEyNi00NGU2LWI5N2QtMzllZDU4NzIzYmRhLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA3MDElMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwNzAxVDA3MDMxN1omWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTNlNGZjM2VmMmYxNzU2ZWNjY2IxMGU5N2M0MWRmMzJlNmNlZjlkYzAxNzQzM2FlZTJhMjA3MGYzYTlkZDkyOTEmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.4IpIkk4xgY2aXj20ovogCyw4MWc6biV5UFJA9jmZSZg)
i believe it is because the select elements from videojs have no id/name properties.
and then the second warning:
![image](https://private-user-images.githubusercontent.com/78234668/265057093-1bb234e0-3eca-4291-80d7-f027b859ed38.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MTk4MTc2OTcsIm5iZiI6MTcxOTgxNzM5NywicGF0aCI6Ii83ODIzNDY2OC8yNjUwNTcwOTMtMWJiMjM0ZTAtM2VjYS00MjkxLTgwZDctZjAyN2I4NTllZDM4LnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA3MDElMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwNzAxVDA3MDMxN1omWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPWE2ZmFhNDJkYjJlNWY4NzUxNDhiMTdkYTdkNmFjYThhMzkxZWIzN2Q1NjIwMmE5YjUzYjJmNzZkM2ZhNWU2ZGQmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.IfNtkPWma0j72qlJcvjotGVygaUbugQzucQ9LumID4g)
![image](https://private-user-images.githubusercontent.com/78234668/265057231-8c6ce0d0-2fc0-465b-96df-a2d861d5ab4a.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MTk4MTc2OTcsIm5iZiI6MTcxOTgxNzM5NywicGF0aCI6Ii83ODIzNDY2OC8yNjUwNTcyMzEtOGM2Y2UwZDAtMmZjMC00NjViLTk2ZGYtYTJkODYxZDVhYjRhLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA3MDElMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwNzAxVDA3MDMxN1omWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTAzMWZjZDM4MTFhZTEwZDE5OTY2OGM5MWY4ODk0NjQ0OGFiNWE5NjE1NDU3M2RkZGNhYzBlMjFlOTMxZjRjMWEmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.3eqW37BDMJQ-7mUug4U_i0LMp8ot7VUioIwbxBvqKHM)
coming from multiple elements, here's one:
im wondering if in react i could fix these label issue by attaching specific id/name attributes or update these label associations?
Beta Was this translation helpful? Give feedback.
All reactions