Screenshot of first error message (after): Error: Render function did not return kitten.html`` class Count extends kitten.Component { html { kitten.html`<h1 morph>${kitten.db.counter.count}</h1>` } onIncrement { kitten.db.counter.count++ this.update } }

Notices where this attachment appears

1. Aral Balkan (aral@mastodon.ar.al)'s status on Wednesday, 22-Jan-2025 20:05:39 JST Aral Balkan

   in reply to

   So last night, while recording the preview of Kitten’s¹ improved component model², I made a silly mistake (copying raw HTML into a JavaScript function instead of wrapping it in a kitten.html`` tagged template, easy to do when you’re refactoring to pull out components from pages).

   Then, once I figured out what I’d done, I made another one by forgetting to return the value from the function (easy to do when you’re used to using one-line closures as render functions).

   I would have caught both of those so much faster if Kitten had helpful error messages for those two pitfalls. And guess what, this morning, it does :)

   Attached are screenshot showing the before and after error messages.

   Enjoy!

   :kitten:💕

   ¹ https://kitten.small-web.org
   ² Scroll up the thread to watch the video.

   #Kitten #SmallWeb #PeerToPeerWeb #web #server #framework #platform #design #usability #errorMessages #authoring #dev #JavaScript #HTML #CSS #htmx #hypermedia #WebSocket #StreamingHTML #SmallTech