History, errors, and enhancement

Test without JavaScript

Complete the core navigation and form flow using only the href, action, method, validation, and full server responses.

8 minute lesson

~~~

Disable JavaScript and complete the core workflow as an ordinary website.

Links need real href values. Forms need action, method, named controls, and submit buttons. The server must return complete pages with preserved safe values and readable validation errors.

Native forms support GET and POST, not DELETE or PATCH. Give an enhanced destructive action a POST fallback route:

<form action="/tasks/42/delete" method="post"
  hx-delete="/tasks/42"
  hx-target="closest li"
  hx-swap="delete">
  <button>Delete</button>
</form>

The server supports both routes with the same authorization and deletion logic. Without JavaScript, the POST returns a redirect or complete page. With HTMX, the DELETE returns a fragment-compatible result.

Active search can fall back to a normal GET submit. Inline completion can fall back to a small POST form and full-page response. The enhanced experience may be faster, but it should not be the only path to the essential task.

Also simulate a failed script request, not only a deliberate browser setting. Progressive enhancement protects the period before HTMX loads as well as users who disable it.

Lesson completed