Migrate away from Enzyme tests in favor of React Testing Library

[adamstankiewicz]

We recently noticed during our attempt to ensure Paragon is compatible with React 18 that using Enzyme with this React version for JavaScript tests will not be compatible, as Enzyme is largely no longer maintained. See https://dev.to/wojtekmaj/enzyme-is-dead-now-what-ekl for additional context, but the short of it is:

• Enzyme is no longer actively maintained.
• It does not support React hooks.
• There is no and will be no support for React 18.

The recommended alternative to Enzyme is React Testing Library. Migrating between these test frameworks will not be as trivial as drop-in replacements; the mindsets in using Enzyme vs. React Testing Library are different: with Enzyme, you can (and sometimes have to) rely on implementation details of what you're testing whereas with React Testing Library, you're encouraged more to think about testing from a user's perspective (e.g., is there an element with this matching {text | a11y role | data-testid | etc) rendered. From there, you can access the underlying DOM node to make further assertions about class names, etc. if needed.

Related, there is a proposal to officially deprecate Enzyme through Open edX and amend the OEP-11 that recommends the use of Enzyme to suggest the use of React Testing Library instead: openedx/open-edx-proposals#487

[arbrandes]

I checked frontend-template-application, and for better or worse there's no enzyme in there. (Maybe because there are no real tests. :P) So, for now, the only urgent thing to do is change OEP-11.

[adamstankiewicz]

I checked frontend-template-application, and for better or worse there's no enzyme in there. (Maybe because there are no real tests. :P) So, for now, the only urgent thing to do is change OEP-11.

Yep, that sounds about right 😃

[arbrandes]

Closing as duplicate of openedx/public-engineering#195.