Add role="dialog" in modals via JavaScript

[rohit2sharma95]

Closes #30773
Updated documentation and unit tests as well, for the modal component

[patrickhlauke]

LGTM

[XhmikosR]

@patrickhlauke should we backport it?

Not sure how easy that will be, just wondering.

[patrickhlauke]

we could backport it yes. it's more of a refinement/nice to have - saves authors having to manually add role="dialog" themselves, but even if they did/have it in their current code, it will still work

[XhmikosR]

Ok, thanks! I'll think about backporting it, but it does seem this is a non-breaking change, i.e. if the attribute already exists, it will be updated.

[XhmikosR]

Now that I think about it, maybe we should not remove the role dialog on hide? It seems redundant.

/CC @Johann-S @patrickhlauke

[patrickhlauke]

doesn't really make a difference, since it's aria-hidden/display:none on hide. personally i like the idea that the script cleans up after itself, rather than modify the markup on first run and then leaving attributes hanging around that it injected...but it's probably more a philosophical matter and wouldn't be opposed to just leaving it there either.

[XhmikosR]

Yeah, it may be better. I was just thinking that it's also better the lest stuff we do with the DOM, the better, that's all :)