Jest-preset-angular: Transforming HTML errors out when using "ts-jest" as transform, instead of preprocessor

[ilancohen]

Here's my jest.config.js:

module.exports = {
  "verbose": true,
  "preset": "jest-preset-angular",
  "globals": {
    "ts-jest": {
      "tsConfigFile": "client/tsconfig.spec.json",
      "skipBabel": true
    },
    "\_\_TRANSFORM_HTML\_\_": true
  },
  "transform": {
    "^.+\\.(ts|js|html)$": "<rootDir>/node_modules/jest-preset-angular/preprocessor.js"
  },
  "cacheDirectory": "./.jest-cache",
  "testURL": "http://localstorage:8080",
  "testMatch": [
    "**/+(*.)+(spec|test).+(ts|js)"
  ],
  "testPathIgnorePatterns": [
    "/node_modules/",
    "/tests/integration/"
  ],
  "moduleNameMapper": {
    "app/(.*)": "<rootDir>/client/app/$1",
    "store/(.*)": "<rootDir>/client/store/$1",
    "services/(.*)": "<rootDir>/client/services/$1",
    "models/(.*)": "<rootDir>/client/models/$1",
    "common/models": "<rootDir>/common/models",
    "shared/(.*)": "<rootDir>/client/app/shared/$1",
    "test-helpers/(.*)": "<rootDir>/client/test-helpers/$1"
  },
  "modulePaths": [
    "<rootDir>/client/"
  ],
  "moduleFileExtensions": [
    "ts",
    "js",
    "html"
  ],
  "coverageReporters": [
    "json",
    "lcov"
  ],
  "coverageDirectory": "coverage",
  "setupFiles": [
    "jest-localstorage-mock"
  ],
  "setupTestFrameworkScriptFile": "<rootDir>/client/test-helpers/setupJest.ts"
};

This works fine, but throws a deprecation warning for the transform. If I switch the transform to:

"transform": { "^.+\\.(ts|js|html)$": "ts-jest" },

then I get errors on every component test:

This test module uses the component MyComponent which is using a "templateUrl" or "styleUrls", but they were never compiled. Please call "TestBed.compileComponents" before your test.

What's going on here?

[ahnpnl]

In the preprocessor of our preset we override ts-jest preprocessor to be able to parse HTML of Angular. I think this is an expected error when switching to ts-jest transform preprocessor.

cc @thymikee

[thymikee]

Yup, expected and not a bug in library

[ilancohen]

@ahnpnl @thymikee
So what do I do to make it work without any deprecation warnings or errors?

[ahnpnl]

what kind of errors/deprecations do you get ?

[ilancohen]

Weird, I'm not getting the deprecation errors anymore. I guess it's fixed.

[mcblum]

@ilancohen did you get this to work? I'm seeing the exact same errors where almost all tests are failing with:

This test module uses the component MyComponent which is using a "templateUrl" or "styleUrls", but they were never compiled. Please call "TestBed.compileComponents" before your test.

[CraigHolloway24]

jest-preset-angular can not be updated as the new version does not play nicely with https://github.com/nrwl/nx/issues/1059

So if you're having issues it could be because of nrwl/nx