Outlets: Add observers for controller element attributes by seanpdoyle · Pull Request #624 · hotwired/stimulus

IsraelDCastro

marcoroth

marcoroth

In some cases, calls to `Element.setAttribute`,
`Element.removeAttribute`, `Node.appendChild`, or `Element.remove` must
be followed up with a call to `await this.nextFrame` so that Stimulus
has an opportunity to synchronize.

This commit introduces asynchronous helper method versions of those
calls that bake-in the subsequent call to `this.nextFrame`.
With the current Outlet implementation, they're only ever connected or
disconnected when an element _matching_ the outlet selector connects or
disconnects. The selector _declared on the controller_ element can only
ever be set once: when it's connected. If that attribute ever changes
(for example, when it's set to a new value or removed entirely), the
outlets are not updated.

This commit adds test coverage to ensure the list of outlets and their
items is synchronized with changes on both sides: when matching elements
are connected and disconnected _as well as_ when the selector that
dictates whether or not they match is added, updated, or removed.

To do so, this commit extends the `SelectorObserver` to also manage the
lifecycle of an `AttributeObserver` instance alongside its internally
managed `ElementObserver`.

@seanpdoyle

@seanpdoyle

@marcoroth

@marcoroth

marcoroth

@seanpdoyle seanpdoyle deleted the outlet-attribute-test-coverage branch

January 30, 2023 03:37