Closed lsagetlethias closed 1 month ago
@lsagetlethias Thank you for reporting.
@enguerranws Would you have a look... if it's a quick fix. Thanks a lot
@garronej Sure, I'll check it asap.
Thanks a lot!
Well, I've looked into this.
The DSFR core js expect that we handle quick access tools duplication by ourselves (which is something that we're already doing) and check it. The check expects that we use the exact same id suffix structure (eg. "my-super-id" -> "my-super-id-mobile", when we're using something like "my-super-id_mobile-${elementIndex}". Both are HTML valid, but the check seems pretty strict.
We can make adjustments to avoid this warning (by removing the index and editing generateValidHtmlId
to allow dashes), but right now, it's accessible, the HTML structure is valid, and the warning does its job recommanding us to handle the duplication by ourselves in case we are not.
Another option would be that the DSFR team perform a more flexible check (like, taking duplicated elements and check their length > 0 and if they have a suffix on their ids - IMO whatever suffix should be ok).
However, it's just a warning, no urge on this. @garronej what do you think about 1 or 2?
Hi @enguerranws, First of all, thank you very much for taking the time to look into this! I didn't understand on my first read, so I wanted to take the time to examine it properly before responding.
I believe option 1 is the best choice. It won't introduce any breaking changes and will offer a quicker resolution.
Feel free to change the code, but please keep in mind that we can't remove the IDs. When Eulerian analytics is enabled, it prints a warning for every component that doesn't have an explicit ID.
Hello @enguerranws,
You seem to have a clear understanding of the problem (unlike me) do you think you could address this or you don't have the bandwith right now?
Best,
Fixed, thanks for reporting!
Actually fixed nox
Straight from storybook in Header component page:![image](https://github.com/codegouvfr/react-dsfr/assets/5783789/3bfed26b-7db9-49f7-8d0d-b051e10a5f7e)
Node : 20.6.0 React DSFR : 0.75.5 Chrome : 116.0