react^Σ=6

At first glance, it seems that React Testing Library (abbreviated RTL) await waitFor + get can be replaced with find everywhere, but it’s not so.

Syntax highlighting is done using either highlight.js or prism.js. Once you’ve picked one, you’ll have to set it up for code blocks: 1. within MDX and 2. outside MDX. That’s how it works on all kinds of frameworks, not just Remix, although I’ll post examples for Remix.

This setup is mostly a trivial task; however, there are a few niggles worth mentioning.

This weekend I was tinkering with string-strip-html GUI; I wanted to sync the state with URL params so that users could bookmark the page and visit later and automatically get those settings restored.

Here’s an MVP based on a forked Remix.js starter template on StackBlitz.

When building the string-strip-html GUI, I wanted: line wrapping, full-screen flexbox layout, with scrollbars on Codemirror box only. That’s a common layout seen on code-oriented sites like Codepen or Stackblitz. I created a minimal proof-of-concept sandbox to prove it works.

The npm package sort-package-json migrated to ES Modules in their v2 release and indirectly broke their named exports which our packages have been consuming. It was a major semver bump, but breaking changes slipped from their changelog and readme radar, so I wanted to explain what actually happened there.

I used to believe that three-theme UI toggle (auto-dark-light) was superior to the two-theme, dark-light. But I don’t think that way anymore.