Gotcha! Well, another idea is to use CSS selectors that narrow the elements semantically and by their distinct qualities. For example, if the cards are accessible links with a border, you can do:

a[aria-labelledby].border {}

Are these cards created using a templating/component system (React, EJS, etc.)? If you have access to the code and can run a dev env you can add a custom class or data attribute to select it with CSS. I usually add data-cid="component-name" to the root element of my components to help with this.

Every now and then, I struggle with non-reactive logic, and I look into using something like useEffectEvent but that it is still experimental. It points to the main issue that useEffect's API is flawed and sorely needs improving.

Today I do feel much less frustrated when writing new code with useEffect. Mostly thanks to the new docs clearer guidance. However, I do constantly see colleagues struggling, similar to @jason.energy, but also in other more nuanced ways that can get you even if you understand the rules well.

Interesting. Don't think it's biased, I'm sure for some it's not been as problematic. I suppose my reflex to call out useEffect's flaws may be more due to it's history. Before the current docs, most misused it, including me, & working with a huge codebase I'm still paying that high legacy debt price

Oh no. Love React & understand it very well. But anything with Effects and subscriptions is rarely "not a big deal". Maybe for simple event listeners, but with almost any other web API or external class, once you figure it out you never dare to touch it again. The Effects API is React's biggest flaw

This is a very interesting perspective regarding React's evolution that I personally haven't heard articulated in this particular way before.

I would argue it can be a very valuable post for the community, even if not for everyone, at least to inspire more conversations around this framing.

To me any test that requires dependency injection or mocking internal dependencies is very hard to consider a unit test, no matter how small it is. So to me most tests fall in the integration category, including most React components. An e2e test is the ultimate integration test.