Comment by gavinray | Hacker News Reader

Comment by gavinray | Hacker News Reader

Parent Full thread

I was just trying that, it seemed not to be working for some reason.

I manually copy-pasted the source code into my app, and got:

    htmx.min.js:1 TypeError: Cannot set property 'Content-Type' of undefined
        at Object.encodeParameters ((index):11)
        at htmx.min.js:1

The code for it is:

xhr.requestHeaders['Content-Type'] = 'application/json'

But I believe it should be

xhr.setRequestHeader('Content-Type', 'application/json')

When I do this, it seems to work

https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequ...

looks like there's a bug in the json-enc extension: it's relying on the test mock which has a requestHeaders property that a real xhr won't.

so the tests passed but it doesn't work irl...

good catch! want to submit a pull request fix?

Sure =D

Done!

Also this extension API is pretty straightforward, the element reference and parameters are right in the args so it's an easy mapping to GraphQL query strings from there. Awesome!

I was able to get a minimal version working using just this (with json-enc extension patch):

    <input
      type="text"
      name="query"
      hx-ext="json-enc"
      hx-post="http://localhost:8080/v1/graphql"
      hx-trigger="keyup changed delay:500ms"
      hx-target="#search-results"
      placeholder="<GRAPHQL QUERY TEXT HERE>"
    />
    <div id="search-results"></div>

Pretty cool

i'd love a graphql extension for the next release, if you are interested

Yeah, definitely game to help out there =)

Hell yea

Reply on news.ycombinator.com