js^Σ=10

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.

The latest TS doesn’t support the types key at the package.json root level. Paul Zaczkiewicz raised an issue on our GH tracker about it, and together we were able to come up with a repoduction (later I also discovered a related ticket on TS issues board). From there on, it was easy to solve; here’s how.

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.

Consider a function written in TS, which multiplies two numbers…

The npm package object-path is a getter/setter for nested arrays and plain objects. Here we use it directly and also align our API’s to it. Here’s why.

A decade ago, Chris Coyier from CSS-Tricks described ways to consume SVG, which can be distilled into two groups: to link and to embed.

Fast forward to 2022, the market has shifted from WordPress+PHP to React+TypeScript, but the same dilemma “to link or to embed?” still applies because, at the bottom of it, we’re still dealing with the same HTML and CSS as we did a decade ago.

So what’s the best way to import SVG in MDX?

Back in the day, before native ES Modules, UMD builds were superior to IIFE because we could unit test them.

And while Rollup and Webpack can produce UMD, esbuild can only make IIFE, so that was an argument against using the esbuild.

One line in Babel config, env preset’s loose set to true was causing a spread operator to disappear on only CommonJS builds (not ES Modules or UMD), which led to broken logic (program could not calculate opts.breakToTheLeftOf correctly any more), program inserted extra blank lines. A crazy bug, isn’t it?

Imagine the HTML: <a></b>.

Parser-wise, how would you design the AST architecture, considering cases like that?

Tooling choices are a subjective matter. Lately, I’ve been observing colorette taking over erroding chalk, and I have few thoughts on this subject.