security options

• can disable a single elt1ms ‣

  this.server.respondWith('GET', '/test', 'Clicked!')
  var btn = make('<button hx-disable hx-get="/test">Initial</button>')
  btn.click()
  this.server.respond()
  btn.innerHTML.should.equal('Initial')

• can disable a parent elt0ms ‣

  this.server.respondWith('GET', '/test', 'Clicked!')
  var div = make('<div hx-disable><button id="b1" hx-get="/test">Initial</button></div>')
  var btn = byId('b1')
  btn.click()
  this.server.respond()
  btn.innerHTML.should.equal('Initial')

• can disable a single elt dynamically9ms ‣

  this.server.respondWith('GET', '/test', 'Clicked!')
  var btn = make('<button id="b1" hx-get="/test">Initial</button>')
  btn.click()
  this.server.respond()
  btn.innerHTML.should.equal('Clicked!')
  this.server.respondWith('GET', '/test', 'Clicked a second time')
  btn.setAttribute('hx-disable', '')
  btn.click()
  this.server.respond()
  btn.innerHTML.should.equal('Clicked!')

• can disable a single elt dynamically & enable it back3ms ‣

  this.server.respondWith('GET', '/test', 'Clicked!')
  var btn = make('<button id="b1" hx-get="/test">Initial</button>')
  btn.click()
  this.server.respond()
  btn.innerHTML.should.equal('Clicked!')
  this.server.respondWith('GET', '/test', 'Clicked a second time')
  btn.setAttribute('hx-disable', '')
  btn.click()
  this.server.respond()
  btn.innerHTML.should.equal('Clicked!')
  btn.removeAttribute('hx-disable')
  htmx.process(btn)
  btn.click()
  this.server.respond()
  btn.innerHTML.should.equal('Clicked a second time')

• can disable a single parent elt dynamically2ms ‣

  this.server.respondWith('GET', '/test', 'Clicked!')
  var div = make('<div><button id="b1" hx-get="/test">Initial</button></div>')
  var btn = byId('b1')
  btn.click()
  this.server.respond()
  btn.innerHTML.should.equal('Clicked!')
  this.server.respondWith('GET', '/test', 'Clicked a second time')
  div.setAttribute('hx-disable', '')
  btn.click()
  this.server.respond()
  btn.innerHTML.should.equal('Clicked!')

• can disable a single parent elt dynamically & enable it back2ms ‣

  this.server.respondWith('GET', '/test', 'Clicked!')
  var div = make('<div><button id="b1" hx-get="/test">Initial</button></div>')
  var btn = byId('b1')
  btn.click()
  this.server.respond()
  btn.innerHTML.should.equal('Clicked!')
  this.server.respondWith('GET', '/test', 'Clicked a second time')
  div.setAttribute('hx-disable', '')
  btn.click()
  this.server.respond()
  btn.innerHTML.should.equal('Clicked!')
  div.removeAttribute('hx-disable')
  htmx.process(div)
  btn.click()
  this.server.respond()
  btn.innerHTML.should.equal('Clicked a second time')

• can make egress cross site requests when htmx.config.selfRequestsOnly is disabled287ms ‣

  this.timeout(4000)
  htmx.config.selfRequestsOnly = false
  // should trigger send error, rather than reject
  var listener = htmx.on('htmx:sendError', function() {
    htmx.config.selfRequestsOnly = true
    htmx.off('htmx:sendError', listener)
    done()
  })
  this.server.restore() // use real xhrs
  // will 404, but should respond
  var btn = make('<button hx-get="https://hypermedia.systems/www/test">Initial</button>')
  btn.click()

• can disable hx-on on a single elt0ms ‣

  var btn = make("<button hx-disable hx-on:click='window.foo = true'>Foo</button>")
  btn.click()
  should.equal(window.foo, undefined)
  delete window.foo

• can disable hx-on on a parent elt0ms ‣

  var div = make("<div hx-disable><button id='b1' hx-on:click='window.foo = true'>Foo</button></div>")
  var btn = byId('b1')
  btn.click()
  should.equal(window.foo, undefined)
  delete window.foo

• can disable hx-on on a single elt dynamically0ms ‣

  var btn = make("<button hx-on:click='window.foo = true'>Foo</button>")
  btn.click()
  should.equal(window.foo, true)
  delete window.foo
  btn.setAttribute('hx-disable', '')
  btn.click()
  should.equal(window.foo, undefined)
  delete window.foo

• can disable hx-on on a parent elt dynamically0ms ‣

  var div = make("<div><button id='b1' hx-on:click='window.foo = true'>Foo</button></div>")
  var btn = byId('b1')
  btn.click()
  should.equal(window.foo, true)
  delete window.foo
  div.setAttribute('hx-disable', '')
  btn.click()
  should.equal(window.foo, undefined)
  delete window.foo

• can't make egress cross site requests when htmx.config.selfRequestsOnly is true1ms ‣

  this.timeout(4000)
  // should trigger send error, rather than reject
  var listener = htmx.on('htmx:invalidPath', function() {
    htmx.off('htmx:invalidPath', listener)
    done()
  })
  this.server.restore() // use real xhrs
  // will 404, but should respond
  var btn = make('<button hx-get="https://hypermedia.systems/www/test">Initial</button>')
  btn.click()

• can cancel egress request based on htmx:validateUrl event0ms ‣

  this.timeout(4000)
  // should trigger send error, rather than reject
  var pathVerifier = htmx.on('htmx:validateUrl', function(evt) {
    evt.preventDefault()
    htmx.off('htmx:validateUrl', pathVerifier)
  })
  var listener = htmx.on('htmx:invalidPath', function() {
    htmx.off('htmx:invalidPath', listener)
    done()
  })
  this.server.restore() // use real xhrs
  // will 404, but should respond
  var btn = make('<button hx-get="https://hypermedia.systems/www/test">Initial</button>')
  btn.click()

• can cancel egress request based on htmx:validateUrl event, sameHost is false0ms ‣

  this.timeout(4000)
  // should trigger send error, rather than reject
  var pathVerifier = htmx.on('htmx:validateUrl', function(evt) {
    if (evt.detail.sameHost === false) {
      evt.preventDefault()
    }
    htmx.off('htmx:validateUrl', pathVerifier)
  })
  var listener = htmx.on('htmx:invalidPath', function() {
    htmx.off('htmx:invalidPath', listener)
    done()
  })
  this.server.restore() // use real xhrs
  // will 404, but should respond
  var btn = make('<button hx-get="https://hypermedia.systems/www/test">Initial</button>')
  btn.click()

• can disable script tag support with htmx.config.allowScriptTags0ms ‣

  var globalWasCalled = false
  window.callGlobal = function() {
    globalWasCalled = true
  }
  try {
    htmx.config.allowScriptTags = false
    this.server.respondWith('GET', '/test', '<div><script>callGlobal()</script></div>')
    var div = make("<div hx-get='/test'></div>")
    div.click()
    this.server.respond()
    globalWasCalled.should.equal(false)
  } finally {
    htmx.config.allowScriptTags = true
    delete window.callGlobal
  }