How to paste markdown tables in Google Sheets and preserve style?

Today I worked on a pretty nice "bug" where the markdown table could not be pasted in the native Google Sheets format. It would paste in the regular markdown style with the pipes (|) and all. Not a great UX, to be honest. Let me show you how it looked.

I initially thought I needed something fancy to get it to show up like this:

Turns out it was actually pretty simple.

You see, the navigator.clipboard.write() method accepts MIME types, and what we needed was the text/html MIME type instead of the default text/plain type.

if (tableHTML && window.ClipboardItem && navigator.clipboard.write) {
  navigator.clipboard.write([
    new ClipboardItem({
      "text/html": new Blob([tableHTML], { type: "text/html" }),
      "text/plain": new Blob([rawMarkdown], {
        type: "text/plain",
      }),
    }),
  ]);
} else {
  navigator.clipboard.writeText(rawMarkdown);
}

Done. You can now paste the markdown table into Google Sheets without seeing the ugly syntax, and a bonus, you can still paste it into your editor as regular markdown.