Merge pull request material-components#5845 from austinw-fineart:patch-1

PiperOrigin-RevId: 804446918

Author: copybara-github

radio/internal/single-selection-controller.ts

@@ -74,22 +74,23 @@ export class SingleSelectionController implements ReactiveController {
   constructor(private readonly host: SingleSelectionElement) {}
 
   hostConnected() {
-    this.root = this.host.getRootNode() as ParentNode;
     this.host.addEventListener('keydown', this.handleKeyDown);
     this.host.addEventListener('focusin', this.handleFocusIn);
     this.host.addEventListener('focusout', this.handleFocusOut);
-    if (this.host.checked) {
-      // Uncheck other siblings when attached if already checked. This mimics
-      // native <input type="radio"> behavior.
-      this.uncheckSiblings();
-    }
 
     // Update siblings after a microtask to allow other synchronous connected
     // callbacks to settle before triggering additional Lit updates. This avoids
     // stack overflow issues when too many elements are being rendered and
     // connected at the same time.
     queueMicrotask(() => {
       // Update for the newly added host.
+      this.root = this.host.getRootNode() as ParentNode;
+      if (this.host.checked) {
+        // Uncheck other siblings when attached if already checked. This mimics
+        // native <input type="radio"> behavior.
+        this.uncheckSiblings();
+      }
+
       this.updateTabIndices();
     });
   }

radio/radio_test.ts

@@ -368,19 +368,22 @@ describe('<md-radio>', () => {
       // Connecting r1 shouldn't change anything, since it's the only one in the
       // group.
       container.appendChild(r1);
+      await env.waitForStability();
       expect(r1.checked).toBeTrue();
       expect(r2.checked).toBeTrue();
       expect(r3.checked).toBeFalse();
 
       // Appending r2 should uncheck r1, because when a new checked radio is
       // connected, it wins (this matches native input behavior).
       container.appendChild(r2);
+      await env.waitForStability();
       expect(r1.checked).toBeFalse();
       expect(r2.checked).toBeTrue();
       expect(r3.checked).toBeFalse();
 
       // Appending r3 shouldn't change anything, because it's not checked.
       container.appendChild(r3);
+      await env.waitForStability();
       expect(r1.checked).toBeFalse();
       expect(r2.checked).toBeTrue();
       expect(r3.checked).toBeFalse();