This error message has been a headache for me this week. I noticed that there were no good posts to cover it in the internet, so I decided to write this post. Hopefully, it will help someone in the future.

Technology stack

  • React
  • Typescript
  • testing-library/react
  • Jest

Definition of the problem

This error occurs while running a unit test. The component that you are running has probably some 3rd party code which contains class components and your EcmaScript configuration in tsconfig.json is not able to compile this file. Therefore, your test fails at some random point in the 3rd party code.

Solution

Unfortunately, there is no single solution for this error because every environment has its own problem because of similar situation. I will show how I handled it while I was using NRK’s core library.

1) Install custom elements es5 adapter for your project.

npm i custom-elements-es5-adapter

2) Import custom elements adapter to your setupTests file

import '@webcomponents/webcomponentsjs/custom-elements-es5-adapter';

3) Run your test again. It should work 🙂

Sercan Leylek

One thought on “TypeError: Class constructor HTMLElement cannot be invoked without ‘new’

  1. hello, I am having the same issues but on Nodejs, trying to connect session with mongobd database. its reads,
    TypeError: Class constructor MongoStore cannot be invoked without ‘new’.. pls am new to this so i really don’t understand some documentations when i research

    Like

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s