From 4c9b2142ec0a1af1752d8bb18c169049f3ff5866 Mon Sep 17 00:00:00 2001 From: MichaelWest22 Date: Sat, 25 Jul 2026 10:56:04 +1200 Subject: [PATCH 1/3] add extension point for view transitions --- src/htmx.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/htmx.js b/src/htmx.js index e53ee80ba..11c4a6860 100644 --- a/src/htmx.js +++ b/src/htmx.js @@ -2291,9 +2291,9 @@ var htmx = (() => { try { if (document.startViewTransition) { - this.__trigger(document, "htmx:before:viewTransition", {task}) - await document.startViewTransition(task).finished; - this.__trigger(document, "htmx:after:viewTransition", {task}) + let detail = { task, transition: () => document.startViewTransition(task).finished }; + this.__triggerExtensions(document, "htmx:before:viewTransition", detail); + await detail.transition(); } else { await task(); } From 3fbe8848f2864f7c76c84da1349350f94cc004b1 Mon Sep 17 00:00:00 2001 From: MichaelWest22 Date: Sat, 25 Jul 2026 11:10:40 +1200 Subject: [PATCH 2/3] simplify --- src/htmx.js | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/src/htmx.js b/src/htmx.js index 11c4a6860..aba95a426 100644 --- a/src/htmx.js +++ b/src/htmx.js @@ -2291,9 +2291,10 @@ var htmx = (() => { try { if (document.startViewTransition) { - let detail = { task, transition: () => document.startViewTransition(task).finished }; - this.__triggerExtensions(document, "htmx:before:viewTransition", detail); - await detail.transition(); + let detail = {task}; + this.__trigger(document, "htmx:before:viewTransition", detail) + await document.startViewTransition(detail.task).finished; + this.__trigger(document, "htmx:after:viewTransition", detail) } else { await task(); } From cef9472278b5212f9399d4005e7d36d257a13ef7 Mon Sep 17 00:00:00 2001 From: MichaelWest22 Date: Wed, 29 Jul 2026 02:31:32 +1200 Subject: [PATCH 3/3] add ctx to events so you have context to allow changes to be conditional on something --- src/htmx.js | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/src/htmx.js b/src/htmx.js index aba95a426..f0fd949ad 100644 --- a/src/htmx.js +++ b/src/htmx.js @@ -1294,7 +1294,7 @@ var htmx = (() => { await this.__insertContent(task, false) } } - swapPromises.push(this.__submitTransitionTask(tasksWrapper)); + swapPromises.push(this.__submitTransitionTask(tasksWrapper, ctx)); } await Promise.all(swapPromises); @@ -2271,10 +2271,10 @@ var htmx = (() => { } } - __submitTransitionTask(task) { + __submitTransitionTask(task, ctx) { return new Promise((resolve) => { this.#transitionQueue ||= []; - this.#transitionQueue.push({ task, resolve }); + this.#transitionQueue.push({ task, resolve, ctx }); if (!this.#processingTransition) { this.__processTransitionQueue(); } @@ -2287,14 +2287,14 @@ var htmx = (() => { } this.#processingTransition = true; - let { task, resolve } = this.#transitionQueue.shift(); + let { task, resolve, ctx } = this.#transitionQueue.shift(); try { if (document.startViewTransition) { - let detail = {task}; - this.__trigger(document, "htmx:before:viewTransition", detail) + let detail = {task, ctx}; + this.__trigger(ctx.sourceElement, "htmx:before:viewTransition", detail) await document.startViewTransition(detail.task).finished; - this.__trigger(document, "htmx:after:viewTransition", detail) + this.__trigger(ctx.sourceElement, "htmx:after:viewTransition", detail) } else { await task(); }