wip

package.json

@@ -18,6 +18,7 @@
         "test": "jest test && cypress run",
         "cypress": "cypress open",
         "jest": "jest test",
-        "update-docs": "node ./scripts/update-docs.js"
+        "update-docs": "node ./scripts/update-docs.js",
+        "release": "node ./scripts/release.js"
     }
 }

packages/alpinejs/package.json

@@ -1,6 +1,6 @@
 {
     "name": "alpinejs",
-    "version": "3.0.1",
+    "version": "3.0.4",
     "description": "The rugged, minimal JavaScript framework",
     "author": "Caleb Porzio",
     "license": "MIT",

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

@@ -155,7 +155,7 @@ window.Element.prototype._x_toggleAndCascadeWithTransitions = function (el, valu
                     let carry = Promise.all([
                         el._x_hidePromise,
                         ...(el._x_hideChildren || []).map(hideAfterChildren)
-                    ]).then(([i]) => i())
+                    ]).then(([i]) => i && i())
 
                     delete el._x_hidePromise
                     delete el._x_hideChildren
@@ -235,7 +235,9 @@ export function performTransition(el, stages, entering) {
     el._x_transitioning = {
         beforeCancels: [],
         beforeCancel(callback) { this.beforeCancels.push(callback) },
-        cancel: once(function () { while (this.beforeCancels.length) { this.beforeCancels.shift()() }; finish(); }),
+        cancel: once(function () {
+            while (this.beforeCancels.length) { this.beforeCancels.shift()() }; finish();
+        }),
         finish,
         entering
     }

packages/alpinejs/src/magics.js

@@ -12,7 +12,7 @@ export function injectMagics(obj, el) {
         Object.defineProperty(obj, `$${name}`, {
             get() { return callback(el, { Alpine, interceptor }) },
 
-            enumerable: true,
+            enumerable: false,
         })
     })
 

packages/alpinejs/src/reactivity.js

@@ -43,6 +43,8 @@ export function elementBoundEffect(el) {
         el._x_effects.add(effectReference)
 
         cleanup = () => {
+            if (effectReference === undefined) return
+
             el._x_effects.delete(effectReference)
 
             release(effectReference)

packages/docs/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@alpinejs/docs",
-    "version": "3.0.1-revision.7",
+    "version": "3.0.4.revision.1",
     "description": "The documentation for Alpine",
     "author": "Caleb Porzio",
     "license": "MIT"

scripts/release.js

@@ -0,0 +1,56 @@
+let { runFromPackage, writeToPackageDotJson } = require('./utils')
+let chalk = require('chalk');
+let log = message => console.log(chalk.green(message))
+let version = process.argv[2]
+
+if (! version) {
+    return console.log('Whoops, you must pass in a version number to this command as the argument')
+}
+
+if (! /[0-9]+\.[0-9]+\.[0-9]+/.test(version)) {
+    return console.log('Whoops, the supplies version is invalid: '+version)
+}
+
+writeNewAlpineVersion()
+writeNewDocsVersion()
+buildAssets()
+
+let readline = require('readline').createInterface({
+    input: process.stdin,
+    output: process.stdout
+});
+
+setTimeout(() => {
+    readline.question('Are you sure you want to publish this release: '+version+'?', answer => {
+        if (['y', 'Y', 'yes', 'Yes', 'YES'].includes(answer)) publish()
+
+        readline.close();
+    });
+}, 1000)
+
+function writeNewAlpineVersion() {
+    writeToPackageDotJson('alpinejs', 'version', version)
+    console.log('Bumping alpinejs package.json: '+version);
+}
+
+function writeNewDocsVersion() {
+    let versionWithRevisionSuffix = `${version}.revision.1`
+
+    writeToPackageDotJson('docs', 'version', versionWithRevisionSuffix)
+    console.log('Bumping @alpinejs/docs package.json: '+version);
+}
+
+function buildAssets() {
+    console.log('Building assets...')
+    require('./build')
+}
+
+function publish() {
+    console.log('Publishing alpinejs on NPM...');
+    runFromPackage('alpinejs', 'npm publish')
+
+    console.log('Publishing @alpinejs/docs on NPM...');
+    runFromPackage('docs', 'npm publish')
+
+    log('\n\nFinished!')
+}

scripts/update-docs.js

@@ -2,7 +2,6 @@ let fs = require('fs')
 let chalk = require('chalk');
 let log = message => console.log(chalk.green(message))
 
-
 let DotJson = require('dot-json');
 
 let { exec } = require('child_process')

scripts/utils.js

@@ -0,0 +1,22 @@
+let DotJson = require('dot-json');
+let { exec } = require('child_process')
+
+module.exports.runFromPackage = function (package, command) {
+    exec(command, { cwd: __dirname+'/../packages/'+package })
+}
+
+module.exports.run = function (command) {
+    exec(command, { cwd: __dirname+'/..' })
+}
+
+module.exports.writeToPackageDotJson = function (package, key, value) {
+    let dotJson = new DotJson(`./packages/${package}/package.json`)
+
+    dotJson.set(key, value).save()
+}
+
+module.exports.getFromPackageDotJson = function (package, key) {
+    let dotJson = new DotJson(`./packages/${package}/package.json`)
+
+    return dotJson.get(key)
+}

tests/cypress/integration/custom-magics.spec.js

@@ -16,3 +16,25 @@ test('can register custom magic properties',
     `,
     ({ get }) => get('span').should(haveText('baz'))
 )
+
+test('magics are lazily accessed',
+    html`
+        <script>
+            window.hasBeenAccessed = false
+
+            document.addEventListener('alpine:initializing', () => {
+                Alpine.magic('foo', (el) => {
+                    window.hasBeenAccessed = true
+                })
+            })
+        </script>
+
+        <div x-data>
+            <button @click="$el.textContent = window.hasBeenAccessed">clickme</button>
+        </div>
+    `,
+    ({ get }) => {
+        get('button').click()
+        get('button').should(haveText('false'))
+    }
+)