summaryrefslogtreecommitdiffstatshomepage
path: root/www
diff options
context:
space:
mode:
Diffstat (limited to 'www')
-rw-r--r--www/content/_index.md8
-rw-r--r--www/content/docs.md10
-rw-r--r--www/content/extensions/head-support.md2
-rw-r--r--www/content/extensions/htmx-1-compat.md2
-rw-r--r--www/content/extensions/idiomorph.md2
-rw-r--r--www/content/extensions/preload.md2
-rw-r--r--www/content/extensions/response-targets.md2
-rw-r--r--www/content/extensions/sse.md2
-rw-r--r--www/content/extensions/ws.md2
-rw-r--r--www/static/src/htmx.js6
-rw-r--r--www/static/test/core/internals.js5
-rw-r--r--www/static/test/core/regressions.js42
-rw-r--r--www/themes/htmx-theme/static/js/htmx.js6
13 files changed, 68 insertions, 23 deletions
diff --git a/www/content/_index.md b/www/content/_index.md
index c6c42fc6..020f2897 100644
--- a/www/content/_index.md
+++ b/www/content/_index.md
@@ -91,12 +91,6 @@ if(window.location.search=="?ads=true") {
</a>
</div>
-<div class="alert">
-<b>NEWS:</b> htmx 2.0 has been released! It is not currently marked as <a href="https://docs.npmjs.com/cli/v10/commands/npm-dist-tag#purpose"><code>latest</code></a>
-in NPM so that people using the <a href="https://v1.htmx.org">1.x line</a> are not accidentally upgraded. We will mark
-2.0 as <code>latest</code> at some point in 2025.
-</div>
-
<h2>introduction</h2>
htmx gives you access to [AJAX](@/docs.md#ajax), [CSS Transitions](@/docs.md#css_transitions), [WebSockets](@/docs.md#websockets-and-sse) and [Server Sent Events](@/docs.md#websockets-and-sse)
@@ -120,7 +114,7 @@ By removing these constraints, htmx completes HTML as a [hypertext](https://en.w
<h2>quick start</h2>
```html
- <script src="https://cdn.jsdelivr.net/npm/htmx.org@2.0.5/dist/htmx.min.js"></script>
+ <script src="https://cdn.jsdelivr.net/npm/htmx.org@2.0.6/dist/htmx.min.js"></script>
<!-- have a button POST a click via AJAX -->
<button hx-post="/clicked" hx-swap="outerHTML">
Click Me
diff --git a/www/content/docs.md b/www/content/docs.md
index dfba110a..f64f4d5f 100644
--- a/www/content/docs.md
+++ b/www/content/docs.md
@@ -123,13 +123,13 @@ The fastest way to get going with htmx is to load it via a CDN. You can simply a
your head tag and get going:
```html
-<script src="https://cdn.jsdelivr.net/npm/htmx.org@2.0.5/dist/htmx.min.js" integrity="sha384-t4DxZSyQK+0Uv4jzy5B0QyHyWQD2GFURUmxKMBVww9+e2EJ0ei/vCvv7+79z0fkr" crossorigin="anonymous"></script>
+<script src="https://cdn.jsdelivr.net/npm/htmx.org@2.0.6/dist/htmx.min.js" integrity="sha384-Akqfrbj/HpNVo8k11SXBb6TlBWmXXlYQrCSqEWmyKJe+hDm3Z/B2WVG4smwBkRVm" crossorigin="anonymous"></script>
```
An unminified version is also available as well:
```html
-<script src="https://cdn.jsdelivr.net/npm/htmx.org@2.0.5/dist/htmx.js" integrity="sha384-5DNWP7/6VfmFjDrEgZ0MwJiuIz0/juUdZwgMAqxCaHBd/BH8MF4yWxDv+mo/o9CG" crossorigin="anonymous"></script>
+<script src="https://cdn.jsdelivr.net/npm/htmx.org@2.0.6/dist/htmx.js" integrity="sha384-2ksKjJrwjL5VxqAkAZAVOPXvMkwAykMaNYegdixAESVr+KqLkKE8XBDoZuwyWVUDv" crossorigin="anonymous"></script>
```
While the CDN approach is extremely simple, you may want to consider
@@ -139,7 +139,7 @@ While the CDN approach is extremely simple, you may want to consider
The next easiest way to install htmx is to simply copy it into your project.
-Download `htmx.min.js` [from jsDelivr](https://cdn.jsdelivr.net/npm/htmx.org@2.0.5/dist/htmx.min.js) and add it to the appropriate directory in your project
+Download `htmx.min.js` [from jsDelivr](https://cdn.jsdelivr.net/npm/htmx.org@2.0.6/dist/htmx.min.js) and add it to the appropriate directory in your project
and include it where necessary with a `<script>` tag:
```html
@@ -151,7 +151,7 @@ and include it where necessary with a `<script>` tag:
For npm-style build systems, you can install htmx via [npm](https://www.npmjs.com/):
```sh
-npm install htmx.org@2.0.5
+npm install htmx.org@2.0.6
```
After installing, you’ll need to use appropriate tooling to use `node_modules/htmx.org/dist/htmx.js` (or `.min.js`).
@@ -1140,7 +1140,7 @@ You can see all available extensions on the [Extensions](/extensions) page.
The fastest way to install htmx extensions created by others is to load them via a CDN. Remember to always include the core htmx library before the extensions and [enable the extension](#enabling-extensions). For example, if you would like to use the [response-targets](/extensions/response-targets) extension, you can add this to your head tag:
```HTML
<head>
- <script src="https://cdn.jsdelivr.net/npm/htmx.org@2.0.5/dist/htmx.min.js" integrity="sha384-t4DxZSyQK+0Uv4jzy5B0QyHyWQD2GFURUmxKMBVww9+e2EJ0ei/vCvv7+79z0fkr" crossorigin="anonymous"></script>
+ <script src="https://cdn.jsdelivr.net/npm/htmx.org@2.0.6/dist/htmx.min.js" integrity="sha384-Akqfrbj/HpNVo8k11SXBb6TlBWmXXlYQrCSqEWmyKJe+hDm3Z/B2WVG4smwBkRVm" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/htmx-ext-response-targets@2.0.2" integrity="sha384-UMuM7P2CPg9i2/dfvBlAeqjXITmEWe9k17Mp9X07Z4jXPN21Ychng569t+sUL8oa" crossorigin="anonymous"></script>
</head>
<body hx-ext="extension-name">
diff --git a/www/content/extensions/head-support.md b/www/content/extensions/head-support.md
index 5eb8b324..8414ff59 100644
--- a/www/content/extensions/head-support.md
+++ b/www/content/extensions/head-support.md
@@ -18,7 +18,7 @@ a feature of the library. This extension addresses that shortcoming.
The fastest way to install `head-support` is to load it via a CDN. Remember to always include the core htmx library before the extension and [enable the extension](#usage).
```HTML
<head>
- <script src="https://cdn.jsdelivr.net/npm/htmx.org@2.0.5/dist/htmx.min.js" integrity="sha384-HGfztofotfshcF7+8n44JQL2oJmowVChPTg48S+jvZoztPfvwD79OC/LTtG6dMp+" crossorigin="anonymous"></script>
+ <script src="https://cdn.jsdelivr.net/npm/htmx.org@2.0.6/dist/htmx.min.js" integrity="sha384-HGfztofotfshcF7+8n44JQL2oJmowVChPTg48S+jvZoztPfvwD79OC/LTtG6dMp+" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/htmx-ext-head-support@2.0.2" integrity="sha384-cvMqHzjCJsOHgGuyB3sWXaUSv/Krm0BdzjuI1rtkjCbL1l1oHJx+cHyVRJhyuEz0" crossorigin="anonymous"></script>
</head>
<body hx-ext="head-support">
diff --git a/www/content/extensions/htmx-1-compat.md b/www/content/extensions/htmx-1-compat.md
index 19fb25a8..b266d2c9 100644
--- a/www/content/extensions/htmx-1-compat.md
+++ b/www/content/extensions/htmx-1-compat.md
@@ -9,7 +9,7 @@ The `htmx-1-compat` extension allows you to almost seamlessly upgrade from htmx
The fastest way to install `htmx-1-compat` is to load it via a CDN. Remember to always include the core htmx library before the extension and enable the extension.
```HTML
<head>
- <script src="https://cdn.jsdelivr.net/npm/htmx.org@2.0.5/dist/htmx.min.js" integrity="sha384-HGfztofotfshcF7+8n44JQL2oJmowVChPTg48S+jvZoztPfvwD79OC/LTtG6dMp+" crossorigin="anonymous"></script>
+ <script src="https://cdn.jsdelivr.net/npm/htmx.org@2.0.6/dist/htmx.min.js" integrity="sha384-HGfztofotfshcF7+8n44JQL2oJmowVChPTg48S+jvZoztPfvwD79OC/LTtG6dMp+" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/htmx-ext-htmx-1-compat@2.0.0" integrity="sha384-lcvVWaNjF5zPPUeeWmC0OkJ2MLqoWLlkAabuGm+EuMSTfGo5WRyHrNaAp0cJr9Pg" crossorigin="anonymous"></script>
</head>
<body hx-ext="htmx-1-compat">
diff --git a/www/content/extensions/idiomorph.md b/www/content/extensions/idiomorph.md
index 43b41723..c095ea72 100644
--- a/www/content/extensions/idiomorph.md
+++ b/www/content/extensions/idiomorph.md
@@ -15,7 +15,7 @@ extension.
The fastest way to install `idiomorph` is to load it via a CDN. Remember to always include the core htmx library before the extension and [enable the extension](#usage).
```HTML
<head>
- <script src="https://cdn.jsdelivr.net/npm/htmx.org@2.0.5/dist/htmx.min.js@2.0.5" integrity="sha384-HGfztofotfshcF7+8n44JQL2oJmowVChPTg48S+jvZoztPfvwD79OC/LTtG6dMp+" crossorigin="anonymous"></script>
+ <script src="https://cdn.jsdelivr.net/npm/htmx.org@2.0.6/dist/htmx.min.js@2.0.6" integrity="sha384-HGfztofotfshcF7+8n44JQL2oJmowVChPTg48S+jvZoztPfvwD79OC/LTtG6dMp+" crossorigin="anonymous"></script>
<script src="https://unpkg.com/idiomorph@0.7.3" integrity="sha384-JcorokHTL/m+D6ZHe2+yFVQopVwZ+91GxAPDyEZ6/A/OEPGEx1+MeNSe2OGvoRS9" crossorigin="anonymous"></script>
<script src="https://unpkg.com/idiomorph@0.7.3/dist/idiomorph-ext.min.js" integrity="sha384-szktAZju9fwY15dZ6D2FKFN4eZoltuXiHStNDJWK9+FARrxJtquql828JzikODob" crossorigin="anonymous"></script>
</head>
diff --git a/www/content/extensions/preload.md b/www/content/extensions/preload.md
index 729d5a2f..762ccbd7 100644
--- a/www/content/extensions/preload.md
+++ b/www/content/extensions/preload.md
@@ -15,7 +15,7 @@ unused requests. Use this extension carefully!
The fastest way to install `preload` is to load it via a CDN. Remember to always include the core htmx library before the extension and [enable the extension](#usage).
```HTML
<head>
- <script src="https://cdn.jsdelivr.net/npm/htmx.org@2.0.5/dist/htmx.min.js" integrity="sha384-HGfztofotfshcF7+8n44JQL2oJmowVChPTg48S+jvZoztPfvwD79OC/LTtG6dMp+" crossorigin="anonymous"></script>
+ <script src="https://cdn.jsdelivr.net/npm/htmx.org@2.0.6/dist/htmx.min.js" integrity="sha384-HGfztofotfshcF7+8n44JQL2oJmowVChPTg48S+jvZoztPfvwD79OC/LTtG6dMp+" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/htmx-ext-preload@2.1.0" integrity="sha384-fkzubQiTB69M7XTToqW6tplvxAOJkqPl5JmLAbumV2EacmuJb8xEP9KnJafk/rg8" crossorigin="anonymous"></script>
</head>
<body hx-ext="preload">
diff --git a/www/content/extensions/response-targets.md b/www/content/extensions/response-targets.md
index 60c3e975..55649102 100644
--- a/www/content/extensions/response-targets.md
+++ b/www/content/extensions/response-targets.md
@@ -27,7 +27,7 @@ The value of each attribute can be:
The fastest way to install `response-targets` is to load it via a CDN. Remember to always include the core htmx library before the extension and [enable the extension](#usage).
```HTML
<head>
- <script src="https://cdn.jsdelivr.net/npm/htmx.org@2.0.5/dist/htmx.min.js" integrity="sha384-HGfztofotfshcF7+8n44JQL2oJmowVChPTg48S+jvZoztPfvwD79OC/LTtG6dMp+" crossorigin="anonymous"></script>
+ <script src="https://cdn.jsdelivr.net/npm/htmx.org@2.0.6/dist/htmx.min.js" integrity="sha384-HGfztofotfshcF7+8n44JQL2oJmowVChPTg48S+jvZoztPfvwD79OC/LTtG6dMp+" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/htmx-ext-response-targets@2.0.2" integrity="sha384-T41oglUPvXLGBVyRdZsVRxNWnOOqCynaPubjUVjxhsjFTKrFJGEMm3/0KGmNQ+Pg" crossorigin="anonymous"></script>
</head>
<body hx-ext="response-targets">
diff --git a/www/content/extensions/sse.md b/www/content/extensions/sse.md
index 4da6118f..83756c52 100644
--- a/www/content/extensions/sse.md
+++ b/www/content/extensions/sse.md
@@ -29,7 +29,7 @@ Use the following attributes to configure how SSE connections behave:
The fastest way to install `sse` is to load it via a CDN. Remember to always include the core htmx library before the extension and [enable the extension](#usage).
```HTML
<head>
- <script src="https://cdn.jsdelivr.net/npm/htmx.org@2.0.5/dist/htmx.min.js" integrity="sha384-HGfztofotfshcF7+8n44JQL2oJmowVChPTg48S+jvZoztPfvwD79OC/LTtG6dMp+" crossorigin="anonymous"></script>
+ <script src="https://cdn.jsdelivr.net/npm/htmx.org@2.0.6/dist/htmx.min.js" integrity="sha384-HGfztofotfshcF7+8n44JQL2oJmowVChPTg48S+jvZoztPfvwD79OC/LTtG6dMp+" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/htmx-ext-sse@2.2.2" integrity="sha384-Y4gc0CK6Kg+hmulDc6rZPJu0tqvk7EWlih0Oh+2OkAi1ZDlCbBDCQEE2uVk472Ky" crossorigin="anonymous"></script>
</head>
<body hx-ext="sse">
diff --git a/www/content/extensions/ws.md b/www/content/extensions/ws.md
index e938c624..2002e7d6 100644
--- a/www/content/extensions/ws.md
+++ b/www/content/extensions/ws.md
@@ -23,7 +23,7 @@ Use the following attributes to configure how WebSockets behave:
The fastest way to install `ws` is to load it via a CDN. Remember to always include the core htmx library before the extension and [enable the extension](#usage).
```HTML
<head>
- <script src="https://cdn.jsdelivr.net/npm/htmx.org@2.0.5/dist/htmx.min.js" integrity="sha384-HGfztofotfshcF7+8n44JQL2oJmowVChPTg48S+jvZoztPfvwD79OC/LTtG6dMp+" crossorigin="anonymous"></script>
+ <script src="https://cdn.jsdelivr.net/npm/htmx.org@2.0.6/dist/htmx.min.js" integrity="sha384-HGfztofotfshcF7+8n44JQL2oJmowVChPTg48S+jvZoztPfvwD79OC/LTtG6dMp+" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/htmx-ext-ws@2.0.2" integrity="sha384-vuKxTKv5TX/b3lLzDKP2U363sOAoRo5wSvzzc3LJsbaQRSBSS+3rKKHcOx5J8doU" crossorigin="anonymous"></script>
</head>
<body hx-ext="ws">
diff --git a/www/static/src/htmx.js b/www/static/src/htmx.js
index 69348460..4c8203ef 100644
--- a/www/static/src/htmx.js
+++ b/www/static/src/htmx.js
@@ -289,7 +289,7 @@ var htmx = (function() {
location,
/** @type {typeof internalEval} */
_: null,
- version: '2.0.5'
+ version: '2.0.6'
}
// Tsc madness part 2
htmx.onLoad = onLoadHelper
@@ -2435,7 +2435,9 @@ var htmx = (function() {
if (elt.form && elt.type === 'submit') {
return true
}
- if (elt instanceof HTMLAnchorElement && elt.href &&
+ elt = elt.closest('a')
+ // @ts-ignore check for a link wrapping the event elt or if elt is a link. elt will be link so href check is fine
+ if (elt && elt.href &&
(elt.getAttribute('href') === '#' || elt.getAttribute('href').indexOf('#') !== 0)) {
return true
}
diff --git a/www/static/test/core/internals.js b/www/static/test/core/internals.js
index e3d4f96d..9b6d0b97 100644
--- a/www/static/test/core/internals.js
+++ b/www/static/test/core/internals.js
@@ -107,6 +107,11 @@ describe('Core htmx internals Tests', function() {
htmx._('shouldCancel')({ type: 'submit', target: anchorThatShouldNotCancel }, form).should.equal(false)
htmx._('shouldCancel')({ type: 'click', target: divThatShouldNotCancel }, form).should.equal(false)
+ // check elements inside links getting click events should cancel parent links
+ var anchorWithButton = make("<a href='/foo'><button></button></a>")
+ htmx._('shouldCancel')({ type: 'click', target: anchorWithButton.firstChild }, anchorWithButton).should.equal(true)
+ htmx._('shouldCancel')({ type: 'click', target: anchorWithButton.firstChild }, anchorWithButton.firstChild).should.equal(true)
+
form = make('<form id="f1">' +
'<input id="insideInput" type="submit">' +
'<button id="insideFormBtn"></button>' +
diff --git a/www/static/test/core/regressions.js b/www/static/test/core/regressions.js
index 015b5815..91a35a0e 100644
--- a/www/static/test/core/regressions.js
+++ b/www/static/test/core/regressions.js
@@ -291,4 +291,46 @@ describe('Core htmx Regression Tests', function() {
byId('datefield').click()
})
+
+ it('a button clicked inside an htmx enabled link will prevent the link from navigating on click', function(done) {
+ var defaultPrevented = 'unset'
+ var link = make('<a href="/foo" hx-get="/foo"><button>test</button></a>')
+ var button = link.firstChild
+
+ htmx.on(link, 'click', function(evt) {
+ // we need to wait so the state of the evt is finalized
+ setTimeout(() => {
+ defaultPrevented = evt.defaultPrevented
+ try {
+ defaultPrevented.should.equal(true)
+ done()
+ } catch (err) {
+ done(err)
+ }
+ }, 0)
+ })
+
+ button.click()
+ })
+
+ it('a htmx enabled button clicked inside a link will prevent the link from navigating on click', function(done) {
+ var defaultPrevented = 'unset'
+ var link = make('<a href="/foo"><button hx-get="/foo">test</button></a>')
+ var button = link.firstChild
+
+ htmx.on(link, 'click', function(evt) {
+ // we need to wait so the state of the evt is finalized
+ setTimeout(() => {
+ defaultPrevented = evt.defaultPrevented
+ try {
+ defaultPrevented.should.equal(true)
+ done()
+ } catch (err) {
+ done(err)
+ }
+ }, 0)
+ })
+
+ button.click()
+ })
})
diff --git a/www/themes/htmx-theme/static/js/htmx.js b/www/themes/htmx-theme/static/js/htmx.js
index 69348460..4c8203ef 100644
--- a/www/themes/htmx-theme/static/js/htmx.js
+++ b/www/themes/htmx-theme/static/js/htmx.js
@@ -289,7 +289,7 @@ var htmx = (function() {
location,
/** @type {typeof internalEval} */
_: null,
- version: '2.0.5'
+ version: '2.0.6'
}
// Tsc madness part 2
htmx.onLoad = onLoadHelper
@@ -2435,7 +2435,9 @@ var htmx = (function() {
if (elt.form && elt.type === 'submit') {
return true
}
- if (elt instanceof HTMLAnchorElement && elt.href &&
+ elt = elt.closest('a')
+ // @ts-ignore check for a link wrapping the event elt or if elt is a link. elt will be link so href check is fine
+ if (elt && elt.href &&
(elt.getAttribute('href') === '#' || elt.getAttribute('href').indexOf('#') !== 0)) {
return true
}