tests(test x in n syntax with data property)

dist/alpine-ie11.js

@@ -6382,18 +6382,19 @@
 
     if (ifAttribute && !component.evaluateReturnExpression(el, ifAttribute.expression)) {
       return [];
-    } // This adds support for the `i in n` syntax.
+    }
 
+    var items = component.evaluateReturnExpression(el, iteratorNames.items, extraVars); // This adds support for the `i in n` syntax.
 
-    if (isNumeric(iteratorNames.items)) {
-      return Array.from(Array(parseInt(iteratorNames.items, 10)).keys(), function (i) {
+    if (isNumeric(items) && items > 0) {
+      items = Array.from(Array(items).keys(), function (i) {
         _newArrowCheck(this, _this4);
 
         return i + 1;
       }.bind(this));
     }
 
-    return component.evaluateReturnExpression(el, iteratorNames.items, extraVars);
+    return items;
   }
 
   function addElementInLoopAfterCurrentEl(templateEl, currentEl) {

dist/alpine.js

@@ -577,14 +577,15 @@
 
     if (ifAttribute && !component.evaluateReturnExpression(el, ifAttribute.expression)) {
       return [];
-    } // This adds support for the `i in n` syntax.
+    }
 
+    let items = component.evaluateReturnExpression(el, iteratorNames.items, extraVars); // This adds support for the `i in n` syntax.
 
-    if (isNumeric(iteratorNames.items)) {
-      return Array.from(Array(parseInt(iteratorNames.items, 10)).keys(), i => i + 1);
+    if (isNumeric(items) && items > 0) {
+      items = Array.from(Array(items).keys(), i => i + 1);
     }
 
-    return component.evaluateReturnExpression(el, iteratorNames.items, extraVars);
+    return items;
   }
 
   function addElementInLoopAfterCurrentEl(templateEl, currentEl) {

package-lock.json

@@ -1,6 +1,6 @@
 {
     "name": "alpinejs",
-    "version": "2.6.0",
+    "version": "2.7.0",
     "lockfileVersion": 1,
     "requires": true,
     "dependencies": {

src/directives/for.js

@@ -95,7 +95,7 @@ function evaluateItemsAndReturnEmptyIfXIfIsPresentAndFalseOnElement(component, e
     let items = component.evaluateReturnExpression(el, iteratorNames.items, extraVars)
 
     // This adds support for the `i in n` syntax.
-    if (isNumeric(items)) {
+    if (isNumeric(items) && items > 0) {
         items = Array.from(Array(items).keys(), i => i + 1)
     }
 

test/for.spec.js

@@ -491,3 +491,17 @@ test('x-for over range using i in x syntax', async () => {
 
     expect(document.querySelectorAll('span').length).toEqual(10)
 })
+
+test('x-for over range using i in x syntax with data property', async () => {
+    document.body.innerHTML = `
+        <div x-data="{ count: 10 }">
+            <template x-for="i in count">
+                <span x-text="i"></span>
+            </template>
+        </div>
+    `
+
+    Alpine.start()
+
+    expect(document.querySelectorAll('span').length).toEqual(10)
+})