Skip to content

Commit 688ab3c

Browse files
asynclizcopybara-github
authored andcommitted
fix(radio): stack overflow error when rendering many radios
PiperOrigin-RevId: 791255859
1 parent 67ea11a commit 688ab3c

File tree

1 file changed

+17
-5
lines changed

1 file changed

+17
-5
lines changed

radio/internal/single-selection-controller.ts

Lines changed: 17 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -84,17 +84,29 @@ export class SingleSelectionController implements ReactiveController {
8484
this.uncheckSiblings();
8585
}
8686

87-
// Update for the newly added host.
88-
this.updateTabIndices();
87+
// Update siblings after a microtask to allow other synchronous connected
88+
// callbacks to settle before triggering additional Lit updates. This avoids
89+
// stack overflow issues when too many elements are being rendered and
90+
// connected at the same time.
91+
queueMicrotask(() => {
92+
// Update for the newly added host.
93+
this.updateTabIndices();
94+
});
8995
}
9096

9197
hostDisconnected() {
9298
this.host.removeEventListener('keydown', this.handleKeyDown);
9399
this.host.removeEventListener('focusin', this.handleFocusIn);
94100
this.host.removeEventListener('focusout', this.handleFocusOut);
95-
// Update for siblings that are still connected.
96-
this.updateTabIndices();
97-
this.root = null;
101+
// Update siblings after a microtask to allow other synchronous disconnected
102+
// callbacks to settle before triggering additional Lit updates. This avoids
103+
// stack overflow issues when too many elements are being rendered and
104+
// connected at the same time.
105+
queueMicrotask(() => {
106+
// Update for siblings that are still connected.
107+
this.updateTabIndices();
108+
this.root = null;
109+
});
98110
}
99111

100112
/**

0 commit comments

Comments
 (0)