'Accessing React component displayName in HTML

How can I access a rendered React component's displayName property in HTML? There seems to be some way to do it given React DevTools, but I've been reading through the source code for that package and can't figure out how they're doing it. I recognize that this might be cross-referenced from the associated JS file, but I'm hopeful that's not the case.

Context: I have a script that identifies certain components in the prod version of our app and adds a red border around them, which works fine. In React DevTools I can see the displayNames of those components even on prod (they're not minified for whatever reason, which is beyond my scope of curiosity right now). I'd love to be able to surface those displayNames in addition to the added border.



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source