Fix changed trigger specifier with checkbox nodes

<input type="checkbox"> is special in that it shows up with a value of
"on", even if it is not checked. Introduce a helper function for getting
the effective value of a node by handling this pecularity.

Author: jsonn

src/htmx.js

@@ -332,6 +332,7 @@ var htmx = (function() {
     getAttributeValue,
     getClosestAttributeValue,
     getClosestMatch,
+    getElementValue,
     getExpressionVars,
     getHeaders,
     getInputValues,
@@ -2456,6 +2457,17 @@ var htmx = (function() {
     return false
   }
 
+  /*
+   * @param {Element} elt
+   */
+  function getElementValue(elt) {
+    if (elt.tagName.toLowerCase() === 'input' && elt.getAttribute('type') === 'checkbox') {
+      return elt.checked ? elt.value : ''
+    }
+    // @ts-ignore value will be undefined for non-input elements, which is fine
+    return elt.value
+  }
+
   /**
    * @param {Node} elt
    * @param {Event|MouseEvent|KeyboardEvent|TouchEvent} evt
@@ -2512,8 +2524,7 @@ var htmx = (function() {
         if (!elementData.lastValue.has(triggerSpec)) {
           elementData.lastValue.set(triggerSpec, new WeakMap())
         }
-        // @ts-ignore value will be undefined for non-input elements, which is fine
-        elementData.lastValue.get(triggerSpec).set(eltToListenOn, eltToListenOn.value)
+        elementData.lastValue.get(triggerSpec).set(eltToListenOn, getElementValue(eltToListenOn))
       })
     }
     forEach(eltsToListenOn, function(eltToListenOn) {
@@ -2556,8 +2567,7 @@ var htmx = (function() {
           }
           if (triggerSpec.changed) {
             const node = evt.target
-            // @ts-ignore value will be undefined for non-input elements, which is fine
-            const value = node.value
+            const value = getElementValue(node)
             const lastValue = elementData.lastValue.get(triggerSpec)
             if (lastValue.has(node) && lastValue.get(node) === value) {
               return

test/attributes/hx-trigger.js

@@ -40,6 +40,22 @@ describe('hx-trigger attribute', function() {
     div.innerHTML.should.equal('Requests: 1')
   })
 
+  it('changed modifier works for checkboxes', function() {
+    var requests = 0
+    this.server.respondWith('GET', '/test', function(xhr) {
+      requests++
+      xhr.respond(200, {}, 'Requests: ' + requests)
+    })
+    var input = make('<input type="checkbox" hx-trigger="click changed" hx-target="#d1" hx-get="/test"/>')
+    var div = make('<div id="d1"></div>')
+    input.click()
+    this.server.respond()
+    div.innerHTML.should.equal('Requests: 1')
+    input.click()
+    this.server.respond()
+    div.innerHTML.should.equal('Requests: 2')
+  })
+
   it('changed modifier works along from clause with single input', function() {
     var requests = 0
     this.server.respondWith('GET', '/test', function(xhr) {