如何控制动态类名称，这些动态类名称是使用用户定义的过滤器或其他方法通过CSS模块或样式化组件自动生成的

Question

Many websites today auto-generate dynamic class names via CSS modules or styled-components. This practice has the unfortunate and perhaps even deliberately malicious effect of disabling many user-defined filters and/or scripts; eg Reddit overrides all manner of client-side cosmetic changes; even simple things like karma are being forced upon the user due to the fact that there's apparently no persistent global identifier which the user could invoke to forbid the display of karma:

An example screenshot of Reddit code illustrating the dynamic class names at hand

I think this is authoritarian, inappropriate, and creates a horrible user experience. I don't believe it's reasonable that websites should exercise this kind of control. What exactly can the user do to reign in these seemingly un-manipulable dynamic class names? eg, is there a way to reverse engineer the build processes used by CSS modules or styled-components in order to then inject the proper identifiers into a user-defined filter and/or script? Or are there better methods?

Note: I've already asked and received no decent response to this question on Webmaster, UX, and SuperUser. Is this the end of the road? Or is there a StackOverflow guru with a workable solution?

Answer 1

To hide karma spans on a comments page on Reddit, today, you could run the following JavaScript:

Array.from(document.querySelectorAll('span')).filter(i => /(\d+)\spoint/.test(i.innerHTML)).forEach(i => i.style.display = 'none');

Tested it here .
However, it only hides karma on the rendered comments, not on the ones that are not yet loaded.

To programatically open all "moreComments" links on a page, you'd need to run:

Array.from(document.querySelectorAll('div')).filter(i => /moreComments-/.test(i.id)).forEach(i => i.querySelector('p').click())

Depending on how many hidden comments are on the page, you'd need to wait a while until all requests resolve and all comments are rendered.

At which point running the first line will hide all karma spans on the page.

---

And this might not work tomorrow, as Reddit own that code and have the right, the ability and the resources to change its inner structure, layout or design as they see fit, any number of times a day, so that any puny attempts of altering the rendered output of their service, by coder wannabes like me and you, remain futile.

---

Edit: Ever since I answered your question I wanted to provide some helpful insight on how to approach StackOverflow. I hope you find it helpful or, at least, entertaining.