[w3c/webcomponents] input radio name isolation in shadow DOM (#824)

Hi folks,

1. Create a custom element with shadow DOM
2. Add some `<input type=radio>` in the shadow DOM with a `name` that is always the same for all instance of the component. (ex: `name=foobar`)

IMO, shadow DOM boundaries should isolate "radio groups".
It is the case in Firefox and Chromium but not in Safari.
I looked for a definitive/specific reference to this is the spec without luck.

## Spec questions?

* Can someone confirm Firefox and Chromium are correct and Safari has a bug?
* Can someone refer to a part of the spec that would clarify this?

I created a reduced test/demo:

https://jsbin.com/wequqojaca/1/edit?html,css,js,output

I also commented on this Webkit issue:

https://bugs.webkit.org/show_bug.cgi?id=199568

## Best practices questions?

I discussed this in the polymer Slack and someone mentioned it was not a good idea to rely on this.

Obviously this fails in Safari right now and in other browsers that rely on polyfills so I used a random unique name for each instance of my component to fix the problem.

* If we were in a world where this behaviour was the same everywhere, would it we bad practice to rely on the isolation and have the same static name for all instance?
* I mean, I rely on the isolation of ids and other CSS stuffs so why not input radio names?
* Am I missing a11y problems with this?

Thanks :wink:

-- 
You are receiving this because you are subscribed to this thread.
Reply to this email directly or view it on GitHub:
https://github.com/w3c/webcomponents/issues/824

Received on Friday, 12 July 2019 10:03:04 UTC