Fix error: TypeError: i is not a function

[fredden]

There is a race condition in Alpine when using x-transition and x-show. It's tricky to reproduce. The code change here removes the JavaScript error: Uncaught (in promise) TypeError: i is not a function.

Normally, el._x_hidePromise is a Promise, so calling this is fine. However, when this code runs more than once in quick succession, one copy works just fine, and the next copy passes an undefined into the Promise.all(), so the .then() gets an undefined, which it then attempts to call as a function, resulting in the error reported.

The scenario that I've been looking into is a drop-down menu layout where putting my mouse over a top-level element reveals a sub menu. When I move my pointer over these top-level elements slowly, all is well. When I move my pointer over these top-level elements quickly, all is well. When I move my pointer back-and-forth over these top-level elements quickly, I can trigger this bug.

With the code changes in this pull request applied, I am no longer able to reproduce the bug with these same steps. As far as I can tell, this fixes #1672 and fixes #3832 (comment).

[ekwoka]

woohoo!!!!

I'ts mostly a non-destructive error, but nice to get it fixed.

[ekwoka]

Suggested change

	]).then(([i]) => i && i())
	]).then(([i]) => i?.())

Not sure if we want to reopen this can of worms with people using decade old webpack versions that can't support optional chaining, but we can dream.

[fredden]

Thanks for the suggestion. Support for optional chaining seems to be wide-spread now: https://caniuse.com/mdn-javascript_operators_optional_chaining
And it seems that we're already using this feature in this code-base, so let's use this here.

alpine/packages/alpinejs/src/scope.js

Line 74 in 0d5a190

if (descriptor?.set && descriptor?.get)

alpine/packages/ui/src/combobox.js

Line 27 in 0d5a190

let active = data.__context?.getActiveItem()

[calebporzio]

Thanks!!