[Bug]: `sp-action-group` throws error when using `appendChild`

[charlessuh]

trafficstars

Code of conduct

• [X] I agree to follow this project's code of conduct.

Impacted component(s)

sp-action-group

Expected behavior

No response

Actual behavior

Using appendChild to programatically add children to a sp-action-group throws an error:

Cannot read properties of null (reading 'assignedElements')
    at ActionGroup.manageButtons (<dependencies>)
    at MutationController.callback (<dependencies>)
    at MutationController.handleChanges (<dependencies>)
    at MutationObserver.<anonymous> (<dependencies>

Screenshots

No response

What browsers are you seeing the problem in?

No response

How can we reproduce this issue?

1. Go to https://studio.webcomponents.dev/edit/1tFqQB4IrNnI3SmfHs6w/src/index.ts?p=stories

Sample code that illustrates the problem

No response

Logs taken while reproducing problem

No response

[Westbrook]

Callback should be gated by hadUpdated/isConnected or attached later in the component lifecycle.

[Westbrook]

I'm having a peculiar time reproing this outside of the demo you sent, like it's related to some load time realities. @charlessuh how are you actually running into this situation? I feel like the fix in a one liner, but without a failing test I'm always worried about adding things to the library without a clear reason.

[charlessuh]

I can also reproduce it by going here and typing the following into the console:

const group = document.createElement('sp-action-group');
document.body.appendChild(group);
const button = document.createElement('sp-button');
group.appendChild(button);

Maybe sp-action-group is not loaded and registered when you're executing this code?