Fix x-if sub expressions still being evaluated after x-if evals to false

[kylethielk]

Hi There!

This PR is to address an issue where after an <template x-if="expression"></template> has evaluated to false and thus the DOM element has been removed, sub expressions are still evaluated. Example reports of this issue are: #2540 #2296 #1837 #1917

Imagine the following code:

<div x-data="{user: {name: 'lebowski'}}">
  <button @click="user=null">Logout</logout>
  <template x-if="user">
    <span x-text="user.name"></span>
  </template>
</div>

Before the suggested fix the above code would produce the following when "Logout" is clicked:

This is because of the following pseudo timeline:

1. user is set to null
2. This causes effect() on the x-text directive to queue an expression evaluation i.e user.name.
3. The x-if="user" expression is evaluated and the result is now false. The cleanup tasks run and removes the <span></span> element from the DOM.
4. The queue runs and evaluates the expression from Step 2. At this point user is null and thus user.name throws an exception.

My solution is to simply remove the queued effect from the queue in the el._x_undoIf() method call. I am however not sure how maintainers will feel about exposing a new method in scheduler.js though. I could not determine a better way though.

This was my first peek into the internals of Alpine so there very well may be a better way to solve this issue. I added a new Cypress test to demonstrate this bug and to also demonstrate how this solution fixes the bug.

Very open to feedback on a better solution.

[kylethielk]

I've pushed a new commit 2dc402b to extend this fix for x-for as well thanks to comment by @SimoTod here.

[markjaquith]

This is working great, and fixes a seriously annoying bug. Nicely done. 👏🏻 Ran my own tests, and this definitely fixes the issue.

All I have is a bunch of boring code formatting consistency advice.

[kylethielk]

Thanks @markjaquith . Pushed recommended changes.

[calebporzio]

This looks great. Thanks for contributing!