If text in a web component seems unselectable, your first instinct might be to check the CSS user-select property. So you pop open your browser's developer tools, inspect the elements... and find that none of them are using user-select: none.
What gives?
In my case, the issue was much simpler: it wasn't a CSS property at all - it was a color illusion.
I was using Chakra UI's gray.200 (#e4e4e7) as the background, and the default text selection highlight color happened to match it almost exactly. So when I tried selecting text, it was actually being highlighted - it just looked like nothing was happening.
No real bug here - just a case of indistinguishable colors. Crisis averted. Carry on.
Photo by Igor Omilaev on Unsplash