spring-boot-demo/thymeleaf-htmx/output/02-history-restore-gets-full-page.txt

# htmx sends BOTH headers when the history cache misses; it swaps the reply into <body>
# request (curl notation, sent through MockMvc): curl -H 'HX-Request: true' -H 'HX-History-Restore-Request: true' '/contacts?page=1'
HTTP 200
Vary: HX-Request
Vary: HX-History-Restore-Request
---- body (3937 chars) ----
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Contacts</title>
  <!-- htmx 2 swaps 2xx/3xx only. 422 must be allowed to swap, or validation errors never appear. -->
  <meta name="htmx-config"
        content='{"responseHandling":[{"code":"204","swap":false},{"code":"[23]..","swap":true},{"code":"422","swap":true,"error":false},{"code":"[45]..","swap":false,"error":true},{"code":"...","swap":false}]}'>
  <link rel="stylesheet" href="/css/app.css">
  <script src="/webjars/htmx.org/2.0.11/dist/htmx.min.js" defer></script>
</head>
<body>
  <header><a href="/contacts">Contacts</a></header>
  <main>
  <h1>Contacts</h1>

  <p><a href="/contacts/new">New contact</a></p>

  <form action="/contacts" method="get" role="search">
    <input type="search" name="q" value="" placeholder="Search name or email"
           hx-get="/contacts" hx-trigger="input changed delay:300ms, search"
           hx-target="#contact-table" hx-swap="outerHTML" hx-push-url="true">
    <noscript><button type="submit">Search</button></noscript>
  </form>

  <!-- th:fragment "table" is exactly what an htmx request gets back -->
  <div id="contact-table" hx-trigger="contactsChanged from:body" hx-target="this" hx-swap="outerHTML" hx-get="/contacts?page=1">
    <table>
      <thead><tr><th>Name</th><th>Email</th><th>Role</th><th></th></tr></thead>
      <tbody>
        
          <tr id="contact-6">
  <td>Farah Sheikh</td>
  <td>[email protected]</td>
  <td>Tester</td>
  <td>
    <button type="button"
            hx-target="closest tr" hx-swap="outerHTML" hx-get="/contacts/6/edit">Edit</button>
    <button type="button"
            hx-target="closest tr" hx-swap="outerHTML" hx-delete="/contacts/6" hx-confirm="Delete Farah Sheikh?">Delete</button>
  </td>
</tr>
        
          <tr id="contact-7">
  <td>Gauri Deshpande</td>
  <td>[email protected]</td>
  <td>Architect</td>
  <td>
    <button type="button"
            hx-target="closest tr" hx-swap="outerHTML" hx-get="/contacts/7/edit">Edit</button>
    <button type="button"
            hx-target="closest tr" hx-swap="outerHTML" hx-delete="/contacts/7" hx-confirm="Delete Gauri Deshpande?">Delete</button>
  </td>
</tr>
        
          <tr id="contact-8">
  <td>Harsh Mehta</td>
  <td>[email protected]</td>
  <td>Manager</td>
  <td>
    <button type="button"
            hx-target="closest tr" hx-swap="outerHTML" hx-get="/contacts/8/edit">Edit</button>
    <button type="button"
            hx-target="closest tr" hx-swap="outerHTML" hx-delete="/contacts/8" hx-confirm="Delete Harsh Mehta?">Delete</button>
  </td>
</tr>
        
          <tr id="contact-9">
  <td>Isha Rao</td>
  <td>[email protected]</td>
  <td>Developer</td>
  <td>
    <button type="button"
            hx-target="closest tr" hx-swap="outerHTML" hx-get="/contacts/9/edit">Edit</button>
    <button type="button"
            hx-target="closest tr" hx-swap="outerHTML" hx-delete="/contacts/9" hx-confirm="Delete Isha Rao?">Delete</button>
  </td>
</tr>
        
          <tr id="contact-10">
  <td>Jayesh Pawar</td>
  <td>[email protected]</td>
  <td>Tester</td>
  <td>
    <button type="button"
            hx-target="closest tr" hx-swap="outerHTML" hx-get="/contacts/10/edit">Edit</button>
    <button type="button"
            hx-target="closest tr" hx-swap="outerHTML" hx-delete="/contacts/10" hx-confirm="Delete Jayesh Pawar?">Delete</button>
  </td>
</tr>
        
        
      </tbody>
    </table>
    <nav class="pager" aria-label="Pages">
      <a href="/contacts?page=0" hx-target="#contact-table" hx-push-url="true" hx-get="/contacts?page=0">&laquo; Prev</a>
      <span>Page 2 of 5 (23 contacts)</span>
      <a href="/contacts?page=2" hx-target="#contact-table" hx-push-url="true" hx-get="/contacts?page=2">Next &raquo;</a>
    </nav>
  </div>
</main>
</body>
</html>