1
0
Эх сурвалжийг харах

:bug: Allows Booleans in bound x-transitions (#3519)

Eric Kwoka 2 жил өмнө
parent
commit
ec73d44793

+ 2 - 2
packages/alpinejs/src/directives/x-transition.js

@@ -7,8 +7,8 @@ import { once } from '../utils/once'
 
 
 directive('transition', (el, { value, modifiers, expression }, { evaluate }) => {
 directive('transition', (el, { value, modifiers, expression }, { evaluate }) => {
     if (typeof expression === 'function') expression = evaluate(expression)
     if (typeof expression === 'function') expression = evaluate(expression)
-
-    if (! expression) {
+    if (expression === false) return
+    if (!expression || typeof expression === 'boolean') {
         registerTransitionsFromHelper(el, modifiers, value)
         registerTransitionsFromHelper(el, modifiers, value)
     } else {
     } else {
         registerTransitionsFromClassString(el, expression, value)
         registerTransitionsFromClassString(el, expression, value)

+ 28 - 0
tests/cypress/integration/directives/x-transition.spec.js

@@ -80,3 +80,31 @@ test('transition:enter in nested x-show visually runs',
         get('h1').should(haveComputedStyle('opacity', '1')) // Eventually opacity will be 1
         get('h1').should(haveComputedStyle('opacity', '1')) // Eventually opacity will be 1
     }
     }
 )
 )
+
+test(
+    'bound x-transition can handle empty string and true values',
+    html`
+        <script>
+            window.transitions = () => {
+                return {
+                    withEmptyString: {
+                        ["x-transition.opacity"]: "",
+                    },
+                    withBoolean: {
+                        ["x-transition.opacity"]: true,
+                    },
+                };
+            };
+        </script>
+        <div x-data="transitions()">
+            <button x-bind="withEmptyString"></button>
+            <span x-bind="withBoolean">thing</span>
+        </div>
+    `,
+    ({ get }) => 
+        {
+            get('span').should(beVisible())
+            get('span').should(beVisible())
+        }
+    
+);