telerik / kendo-angular

Issue tracker - Kendo UI for Angular
http://www.telerik.com/kendo-angular-ui/
Other
468 stars 216 forks source link

All Jest tests fail - TextEncoder is not defined #4244

Closed geo242 closed 7 months ago

geo242 commented 7 months ago

Describe the bug

This only applies to projects using Angular 17+ and the new built in Jest testing support

Any tests of any components that include a Kendo module import (sample uses ButtonsModule) will fail with the following error message:

 FAIL  dist/test-out/browser/app.component.spec.mjs
  ● Test suite failed to run

    ReferenceError: TextEncoder is not defined

      20 | var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
      21 | var __esm = (fn2, res) => function __init() {
    > 22 |   return fn2 && (res = (0, fn2[__getOwnPropNames(fn2)[0]])(fn2 = 0)), res;
         |                                                           ^
      23 | };
      24 | var __commonJS = (cb, mod) => function __require() {
      25 |   return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;

      at fingerprint (node_modules/@angular/compiler/fesm2022/compiler.mjs:647:25)
      at computeMsgId (node_modules/@angular/compiler/fesm2022/compiler.mjs:659:26)
      at computeDecimalDigest (node_modules/@angular/compiler/fesm2022/compiler.mjs:519:12)
      at decimalDigest (node_modules/@angular/compiler/fesm2022/compiler.mjs:511:26)
      at I18nMetaVisitor._setMessageId (node_modules/@angular/compiler/fesm2022/compiler.mjs:19967:64)
      at I18nMetaVisitor._generateI18nMessage (node_modules/@angular/compiler/fesm2022/compiler.mjs:19840:14)
      at I18nMetaVisitor.visitElement (node_modules/@angular/compiler/fesm2022/compiler.mjs:19887:42)
      at Element2.visit (node_modules/@angular/compiler/fesm2022/compiler.mjs:15084:24)
      at node_modules/@angular/compiler/fesm2022/compiler.mjs:19845:47
          at Array.map (<anonymous>)
      at I18nMetaVisitor.visitAllWithErrors (node_modules/@angular/compiler/fesm2022/compiler.mjs:19845:30)
      at parseTemplate (node_modules/@angular/compiler/fesm2022/compiler.mjs:30252:44)
      at parseJitTemplate (node_modules/@angular/compiler/fesm2022/compiler.mjs:32569:20)
      at convertDeclareComponentFacadeToMetadata (node_modules/@angular/compiler/fesm2022/compiler.mjs:32485:54)
      at CompilerFacadeImpl.compileComponentDeclaration (node_modules/@angular/compiler/fesm2022/compiler.mjs:32292:22)
      at ɵɵngDeclareComponent (node_modules/@angular/core/fesm2022/core.mjs:35617:21)
      at node_modules/@progress/kendo-angular-buttons/fesm2020/progress-kendo-angular-buttons.mjs (node_modules/@progress/kendo-angular-buttons/fesm2020/progress-kendo-angular-buttons.mjs:2546:32)
      at __init (chunk-T4LQY2AG.mjs:22:59)
      at src/app/app.component.ts (src/app/app.component.ts:3:1)
      at __init (chunk-T4LQY2AG.mjs:22:59)
      at init_app_component (src/app/app.component.spec.ts:2:1)
      at __require (chunk-T4LQY2AG.mjs:25:50)
      at app.component.spec.mjs:13980:16

Component

import { Component } from '@angular/core';
import { RouterOutlet } from '@angular/router';
import {ButtonsModule} from "@progress/kendo-angular-buttons";

@Component({
  selector: 'app-root',
  standalone: true,
  imports: [RouterOutlet, ButtonsModule],
  templateUrl: './app.component.html',
  styleUrl: './app.component.scss'
})
export class AppComponent {
  title = 'test-angular-jest';
}

Test

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

describe('AppComponent', () => {
  beforeEach(async () => {
    await TestBed.configureTestingModule({
      imports: [AppComponent],
    }).compileComponents();
  });

  it('should create the app', () => {
    const fixture = TestBed.createComponent(AppComponent);
    const app = fixture.componentInstance;
    expect(app).toBeTruthy();
  });
});

To Reproduce

  1. Create new angular project using ng new
  2. Convert project to use jest using instructions like this
  3. Add any Kendo package (e.g. ng add @progress/kendo-angular-buttons)
  4. Run ng test - verify that tests are working
  5. Add corresponding Kendo module to imports of app.component (e.g. ButtonsModule)
  6. Run ng test - verify that tests are now not working

Expected behavior Tests should pass

Screenshots N/A

Browser

Additional context

npm ls --depth 0                                                                                                                                                                                                                                                                                                                                                                                            
test-angular-jest@0.0.0 C:\Users\gtrip\code\personal\test-angular-jest
+-- @angular-devkit/build-angular@17.2.3
+-- @angular/animations@17.2.4
+-- @angular/cli@17.2.3
+-- @angular/common@17.2.4
+-- @angular/compiler-cli@17.2.4
+-- @angular/compiler@17.2.4
+-- @angular/core@17.2.4
+-- @angular/forms@17.2.4
+-- @angular/localize@17.2.4
+-- @angular/platform-browser-dynamic@17.2.4
+-- @angular/platform-browser@17.2.4
+-- @angular/router@17.2.4
+-- @progress/kendo-angular-buttons@15.1.0
+-- @progress/kendo-angular-common@15.1.0
+-- @progress/kendo-angular-icons@15.1.0
+-- @progress/kendo-angular-l10n@15.1.0
+-- @progress/kendo-angular-popup@15.1.0
+-- @progress/kendo-licensing@1.3.5
+-- @progress/kendo-svg-icons@2.1.0
+-- @progress/kendo-theme-default@7.2.1
+-- @types/jest@29.5.12
+-- jest-environment-jsdom@29.7.0
+-- jest@29.7.0
+-- rxjs@7.8.1
+-- tslib@2.6.2
+-- typescript@5.3.3
`-- zone.js@0.14.4
stnikolova commented 7 months ago

Hi @geo242,

Thank you for the report. This, however, isn't an issue within the Kendo UI for Angular issue but rather a known incompatibility issue between Jest and Angular v17. Please refer to the following issues:

https://github.com/jestjs/jest/issues/14876 https://github.com/jestjs/jest/issues/14875

As a workaround, please see this suggestion: https://github.com/jsdom/jsdom/issues/2524#issuecomment-897707183