4

I get an error while running my Jest test file:

TypeError: Class constructor EventEmitter_ cannot be invoked without 'new'

  at new ZoneAwareEventEmitter (node_modules/@progress/kendo-angular-grid/dist/npm/common/event-emitter.js:16:28)
  at new GridComponent (node_modules/@progress/kendo-angular-grid/dist/npm/grid.component.js:328:1)

I tried all possibilities for target (es5, es6, es2019 ...) and module (commonJs, es6, es2015, es2020....)

"compilerOptions": { "outDir": "./out-tsc/spec", "target": "es2019", "module": "es2020", "moduleResolution": "node", },

package.json

{
  "name": "jest-angular",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "watch": "ng build --watch --configuration development",
    "test": "jest",
    "test-esm": "node --experimental-vm-modules --no-warnings node_modules/jest/bin/jest.js -c=jest-esm.config.mjs --no-cache",
    "test:w": "jest --watchAll",
    "cover": "jest --coverage"
  },
  "private": true,
  "dependencies": {
    "core-js": "^3.21.1",
    "@angular/animations": "^13.3.0",
    "@angular/cdk": "^13.3.0",
    "@angular/common": "^13.3.0",
    "@angular/compiler": "^13.3.0",
    "@angular/core": "^13.3.0",
    "@angular/forms": "^13.3.0",
    "@angular/localize": "^13.3.0",
    "@angular/platform-browser": "^13.3.0",
    "@angular/platform-browser-dynamic": "^13.3.0",
    "@angular/router": "^13.3.0",
    "web-animations-js": "2.3.2",
    "@progress/kendo-angular-l10n": "3.0.4",
    "@progress/kendo-licensing": "1.2.2",
    "@progress/kendo-angular-popup": "4.0.5",
    "@progress/kendo-angular-buttons": "7.0.4",
    "@progress/kendo-angular-intl": "3.1.3",
    "@progress/kendo-drawing": "1.16.3",
    "@progress/kendo-angular-dateinputs": "6.0.3",
    "@progress/kendo-angular-inputs": "8.0.8",
    "@progress/kendo-angular-dropdowns": "6.0.2",
    "@progress/kendo-angular-treeview": "6.0.2",
    "@progress/kendo-angular-label": "3.1.3",
    "@progress/kendo-data-query": "1.5.6",
    "@progress/kendo-angular-pdf-export": "3.0.4",
    "@progress/kendo-angular-excel-export": "4.0.4",
    "@progress/kendo-angular-grid": "6.1.1",
    "rxjs": "~7.5.5",
    "tslib": "^2.3.1",
    "zone.js": "~0.11.5"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "^13.3.0",
    "@angular/cli": "^13.3.0",
    "@angular/compiler-cli": "^13.3.0",
    "@types/jest": "^27.0.3",
    "@types/node": "^12.11.1",
    "jest": "^27.5.1",
    "jest-preset-angular": "^11.1.1",
    "typescript": "~4.5.2"
  }
}

jest.config.js

module.exports = {
  verbose: true,
  testPathIgnorePatterns: [
    "<rootDir>/node_modules/",
  ],
  preset: "jest-preset-angular",
  setupFilesAfterEnv: ["<rootDir>/setup-jest.ts"],
};

setup-jest.ts

import '@angular/localize/init';
import 'jest-preset-angular/setup-jest';

app.component.html

<kendo-grid></kendo-grid>

app.component.spec.ts

import { ComponentFixture, TestBed } from '@angular/core/testing';
import { AppComponent } from './app.component';
import { AppModule } from './app.module';

let fixture: ComponentFixture<AppComponent>;
let app: AppComponent;

beforeEach(() => {
  TestBed.configureTestingModule({
    imports: [AppModule],
    providers: [],
    declarations: [AppComponent],
  }).compileComponents();
 
  fixture = TestBed.createComponent(AppComponent);
  app = fixture.componentInstance;
});

describe('class AppComponent{}', () => {

  it('Should create the app', () => {
    expect(app).toBeTruthy();
  });
});
MStephan
  • 131
  • 3
  • Please provide enough code so others can better understand or reproduce the problem. – Community Mar 22 '22 at 03:16
  • Telerik is aware of the described issue as Jest preset isn't working with Angular v13 without the Ivy packages. The team is currently in the process of switching to the Ivy library format expected to release in R2 May 2022. The progression can be followed in the following thread in the GitHub repository: https://github.com/telerik/kendo-angular/issues/3502 After the switch to the Ivy engine, the issue will be resolved. – MStephan Mar 28 '22 at 08:21
  • @MStephan I have exactly the same issue currently, unfortunately, updating the Grid to v7 (which should be Ivy-ready, right?) did not change a thing. Is it working for anyone yet? – FloppyNotFound Apr 27 '22 at 08:31
  • I have opened a ticket on Github: https://github.com/telerik/kendo-angular/issues/3660 – FloppyNotFound Apr 27 '22 at 08:50
  • i've got the same anwser from Telerik on my ticket. Very disappointing. – MStephan Apr 28 '22 at 09:18
  • also found the same bug, so silly, even changing the package.json to point to the esm files and change those to .mjs will work – Nadav SInai Jul 06 '22 at 08:52

1 Answers1

0

For those who are just testing components that use the grid (instantiating), you can mock it!

jest.mock('@progress/kendo-angular-grid');
Paul Roub
  • 36,322
  • 27
  • 84
  • 93
Gustavo Costa
  • 129
  • 8