javascript

backgroundColor in the file, background-color in the reader: both legal, never meeting. An empty palette with zero errors anywhere.

TL;DR: MockForge's capture emitted camelCase JSON keys, but the derivation step looked up kebab-case names, yielding an empty palette and fonts with zero errors. Every layer was individually correct: getComputedStyle supports both spellings, JSON allows any keys, and getPropertyValue returns empty strings on misses. Fix: producer now emits kebab-case keys, plus a guard script validating shape at the boundary.

A client-side filter over a paginated endpoint drops rows it never fetched. The fix: a 500-row fetch ceiling, aria-pressed, and a sort deliberately left out.

TL;DR: The chip filters submissions in the browser. It works with a limited set of rows. A 500-row limit was added with a comment naming the ceiling.

A date input ships a plain string, the old payload carried a UTC instant. How one day vanished and the contract that stopped it.

TL;DR: A date input saved as December 20 came back as December 19 because wrapping the plain yyyy-mm-dd string in a Date, then calling toISOString, shifted local midnight to the previous day in UTC-negative timezones. The fix anchors the input string at UTC midnight explicitly. Keeping the Go backend strict on RFC 3339 prevents this class of bug entirely.

An API outage and an expired session were treated the same by a single catch, until one server restart logged out every admin.

TL;DR: A single catch-all deleted the session token on any error, so a brief backend outage logged out every admin. The fix: classify failures first—only 401 purges the token, 403 shows an access-denied notice, and 5xx or network errors keep the session with a retry banner. Five unit tests lock the classification.

The group-network section got split out of about-teaser, then went portable: rebuilt as a shadow-DOM custom element any page can drop in.

TL;DR: Refactoring a React section into a standalone file raised a portability problem: non-React teams couldn't reuse it without shipping a framework bundle. Copy-pasting rendered HTML failed because utility styles depended on the build pipeline and manual hover handling was brittle. Rebuilding it as an autonomous web component with shadow DOM and a template made it lightweight and portable.

Build a Next.js App Router locale switcher that preserves the current path with usePathname and a regex swap, plus an accessible active state.

TL;DR: A naive locale switcher sent users to the locale homepage instead of the same page. The fix: a small client component that swaps the /en or /id prefix while preserving the rest of the pathname, plus aria-current for the active state. Stick with this for simple sites; adopt next-intl once routing grows complex.

A server monitoring dashboard becomes noise when attention items pile up with no organization. Three complementary fixes transform a flat grid into a usable workflow.

TL;DR: Dashboard Guy Eighteen flat grid of alerts made it impossible to find critical issues across nine servers. Backend search with debounce, severity filter buttons, and collapsible server groups solved the noise problem by pushing all filtering logic server-side. Three tools together let you triage from hundreds of items in two taps or three words.

Scraping an AI chat answer from the DOM gets you half of it. The full text lives behind the Copy button, plus a strict output contract.

TL;DR: Chat UIs use virtualization, so most of the AI's answer never exists in the DOM and scrolling won't load it. The fix layers a Copy-button click to read the clipboard, an accessibility tree snapshot, and innerText as fallbacks. The real win: define an output contract upfront — code block plus sentinel marker — so scraping becomes deterministic.

A double code block bug on the blog: a module-level /g regex's lastIndex gets clobbered across parallel async calls. The fix is eight lines.