[Bug]: RadioGroup - Setting its value in code is not reflected to the child Radios if some element is between RadioGroup and Radios

[norikois]

Which component(s) are affected?

Radio & Radio Group

Description

[Bug]: RadioGroup - Setting its value in code is not reflected to the child Radios if some element is between RadioGroup and Radios

Reproduction

1. Start the attached reproducible sample.

Expected:
"Orange", "Tomato" and "Flounder" in the "Actual (just put in a table)" table should be checked because they are set to their radio group's value.

Actual:
Orange, Tomato and Flounder are not checked.

C_00242270_WCApp8.zip

Workaround

I have not found a workaround.

Is this a regression?

No or unsure. This never worker, or I haven't tried before.

Affected versions

igniteui-webcomponents 5.1.2

Browser/OS/Node environment

Browser: Chrome (135.0.7049.95)
OS: Windows 11

[rkaraivanov]

After going over the provided sample I'm willing to mark this as not a bug due
to the scenario in which the radio group is used.

The HTML table element and the supporting cast around it (tbody, tr, etc.) have special behavior about what they accept as DOM children.

Let's take the <tr> element:

As per the image above only <td>/<th> elements are permitted to be slotted inside a <tr>.
Anything else is hoisted out of the whole table. Which is exactly what is happening in the provided sample.

The code:

The actual DOM:

All of the igc-radio-group elements are hoisted out of the table leaving only the radios inside the
<td> elements because they do accept flow content.

Because of this nothing is technically slotted inside the radio group and from its point of view it has nothing to manage in terms of radio components.

If that is reproducible outside of a table context then yes, it has to be fixed.