createStringLiteral is not a function in InlineHtmlStripStylesTransformer

[walid1992d]

Hi, whenever I call compileComponents() or TestBed.createComponent I am getting this error in InlineHtmlStripStylesTransformer

  TypeError: ts.createStringLiteral is not a function

      at transfromPropertyAssignmentForJest (node_modules/jest-preset-angular/InlineHtmlStripStylesTransformer.js:69:50)
      at visitor (node_modules/jest-preset-angular/InlineHtmlStripStylesTransformer.js:104:30)
      at visitNodes (node_modules/typescript/lib/typescript.js:51104:48)
      at Object.visitEachChild (node_modules/typescript/lib/typescript.js:51257:53)
      at visitor (node_modules/jest-preset-angular/InlineHtmlStripStylesTransformer.js:108:33)
      at visitNodes (node_modules/typescript/lib/typescript.js:51104:48)
      at Object.visitEachChild (node_modules/typescript/lib/typescript.js:51263:156)
      at visitor (node_modules/jest-preset-angular/InlineHtmlStripStylesTransformer.js:108:33)
      at visitNode (node_modules/typescript/lib/typescript.js:51053:23)
      at Object.visitEachChild (node_modules/typescript/lib/typescript.js:51193:49)

I already have in the jest.config.js

    globals: {
        'ts-jest': {
            tsConfig: '<rootDir>/tsconfig.spec.json',
            stringifyContentPathRegex: '\\.html$',
            "astTransformers": ["jest-preset-angular/InlineHtmlStripStylesTransformer"],

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

and having this in the component test file

import {TestcomponentComponent} from './testcomponent';
import { TestBed, async, fakeAsync} from '@angular/core/testing'
import { BrowserDynamicTestingModule, platformBrowserDynamicTesting } from '@angular/platform-browser-dynamic/testing';
let component;
beforeEach(async()=> {
    TestBed.resetTestEnvironment();
 TestBed.initTestEnvironment(BrowserDynamicTestingModule,
    platformBrowserDynamicTesting());

       await TestBed.configureTestingModule({
        declarations: [
            TestcomponentComponent
        ],

      }).compileComponents();
 component = TestBed.createComponent(TestcomponentComponent);

})
describe("Test Component", ()=> {

    it('should match snapshot', ()=> {

        expect(true).toBe(true);
    })
})

[wtho]

Can you tell us what TypeScript version you are using?

Also can you try the following in a terminal inside your project: run node in tty, require typescript and check if the createStringLiteral function is available there:

$ node
> require('typescript').createStringLiteral('test-literal')

[wtho]

Just checked and saw the createStringLiteral function is only available since TypeScript v2.9 (commit).

To facilitate backwards-compatibility we have to call the more generic createNode method on the TypeScript compiler.

A workaround could look like this:

function createStringLiteralPolyfill(text: string) {
  const node = createNode(ts.SyntaxKind.StringLiteral, -1, -1);
        node.flags |= NodeFlags.Synthesized;
        node.text = text;
        return node;
}

Could totally go into #261

(taken from factory.ts)

If you use Angular 5 (or lower), you might not be able to use TypeScript v2.9.
If this is the case, I see the following options:

• upgrade your project to Angular 6 or higher (and therefore TypeScript v2.9 or higher)
• use an older version of jest-preset-angular (and jest)
• copy the InlineHtmlStripStylesTransformer.js from the preset package and polyfill it on your own

[walid1992d]

thanks, upgrading typescript to v3 fixed the issue