Add thymeleaf-htmx module: Spring Boot 4.1.2 + Thymeleaf 3.1.5 + htmx 2.0.11 CRUD UI with fragment rendering, 422 validation re-render, pagination, inline edit, delete, MockMvc tests and a Chromium check

Co-Authored-By: Claude Sonnet 5.5 <[email protected]> Claude-Session: https://claude.ai/code/session_017ic4b7rnC7jppGGdHGESvy
2026-10-28 18:23:46 +00:00
parent 93c709c34d
commit 99a8a0df42
37 changed files with 1840 additions and 0 deletions
@@ -0,0 +1,52 @@
+== 1. load, then search without a page reload
+htmx loaded: object 2.0.11
+rows on first page: 5
+after typing "kamat": ["Sneha Kamat"]
+address bar: /contacts?q=kamat
+elements with id contact-table: 1
+document survived (no reload): same-document
+
+== 2. pagination + back button
+page 2 names: ["Farah Sheikh","Gauri Deshpande","Harsh Mehta","Isha Rao","Jayesh Pawar"]
+address bar: /contacts?page=1
+Back request: GET /contacts?q=  HX-Request=true HX-History-Restore-Request=true
+after Back: h1="Contacts", pager="Page 1 of 5 (23 contacts)"
+
+== 3. inline edit with a validation error
+row still editing, errors: ["Name is required","Email must look like name@host"]
+saved, row is read-only again: ["Aarav K.","Bhavna Joshi","Chinmay Desai","Divya Nair","Eshaan Patil"]
+
+== 4. delete with confirm
+confirm dialog: "Delete Aarav K.?"
+pager after delete: "Page 1 of 5 (22 contacts)"
+requests caused by one delete: ["DELETE /contacts/1  HX-Request=true HX-History-Restore-Request=-","GET /contacts?page=0  HX-Request=true HX-History-Restore-Request=-"]
+
+== 5. create form: 422 re-render, then success
+errors shown in place: ["Name is required","Email must look like name@host"]
+still on: /contacts/new, typed email kept: x
+HX-Redirect landed on: /contacts
+
+== 6. the two status-code traps, observed
+DELETE answered 204: rows before=5, after=5 (row not removed)
+htmx-config meta present: 0
+Save answered 422 without the meta tag: errors visible = 0
+
+== requests the browser made (excluding static files)
+GET /contacts  HX-Request=- HX-History-Restore-Request=-
+GET /contacts?q=kamat  HX-Request=true HX-History-Restore-Request=-
+GET /contacts?q=  HX-Request=true HX-History-Restore-Request=-
+GET /contacts?page=1  HX-Request=true HX-History-Restore-Request=-
+GET /contacts?q=  HX-Request=true HX-History-Restore-Request=true
+GET /contacts/1/edit  HX-Request=true HX-History-Restore-Request=-
+PUT /contacts/1  HX-Request=true HX-History-Restore-Request=-
+PUT /contacts/1  HX-Request=true HX-History-Restore-Request=-
+DELETE /contacts/1  HX-Request=true HX-History-Restore-Request=-
+GET /contacts?page=0  HX-Request=true HX-History-Restore-Request=-
+GET /contacts/new  HX-Request=- HX-History-Restore-Request=-
+POST /contacts  HX-Request=true HX-History-Restore-Request=-
+POST /contacts  HX-Request=true HX-History-Restore-Request=-
+GET /contacts  HX-Request=- HX-History-Restore-Request=-
+DELETE /contacts/2  HX-Request=true HX-History-Restore-Request=-
+GET /contacts  HX-Request=- HX-History-Restore-Request=-
+GET /contacts/2/edit  HX-Request=true HX-History-Restore-Request=-
+PUT /contacts/2  HX-Request=true HX-History-Restore-Request=-