Search code examples
typescriptjestjsts-jest

SyntaxError: Unexpected token, expected "," in typescript file


i have 2 files, one is Helper.ts that has some functions and Helper.spec.ts that is the test file for the Helper.ts using jest.

I was using this with pure javascript but i changed it to typescript, i installed types/jest , my jest file was Helper.test.js and i changed it to Helper.spec.ts, since then i'm having this error, can someone help me to figure it out? Error print

Here is a part of my Helper.ts:

export class Helper {
  static isDefined(value: any): boolean {
    const s = value;
    const status = s !== null && s !== undefined;
    return status;
  }

  static isNotDefined(value: any): boolean {
    return !this.isDefined(value);
  }
}

And here is a part of my Helper.spec.ts:

import { Helper } from './Helper';

describe('Helpers tests', () => {
  test('isDefined deve retornar true se o valor estiver definido', () => {
    expect(Helper.isDefined('')).toBeTruthy();
    expect(Helper.isDefined(null)).toBeFalsy();
    expect(Helper.isDefined(undefined)).toBeFalsy();
    expect(Helper.isDefined(0)).toBeTruthy();
    expect(Helper.isDefined('hello')).toBeTruthy();
  });

  test('isNotDefined deve retornar true se o valor não estiver definido', () => {
    expect(Helper.isNotDefined('')).toBeFalsy();
    expect(Helper.isNotDefined(null)).toBeTruthy();
    expect(Helper.isNotDefined(undefined)).toBeTruthy();
  });

}

That's my tsconfig.json, i dont know if it is helpful

{
  "compilerOptions": {
    "target": "ESNext",
    "module": "ESNext",
    "strict": true,
    "jsxImportSource": "vue",
    "noImplicitThis": true,
    "jsx": "preserve",
    "allowImportingTsExtensions": true,
    "moduleResolution": "node",
    "esModuleInterop": true,
    "skipLibCheck": true,
    "forceConsistentCasingInFileNames": true,
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true
  },
  "types": ["@types/node", "@types/vue", "webpack-env"],
  "include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"],
  "exclude": ["node_modules"]
}

I don't have any jest configuration in my package.json, just the :

    "@types/jest": "^29.5.12",
    "@typescript-eslint/eslint-plugin": "^7.6.0",
    "@typescript-eslint/parser": "^7.6.0",
    "babel-jest": "^29.7.0",
    "jest": "^29.7.0",

I checked the logic and i couldn't see anything wrong, maybe i'm missing something


Solution

  • Solution :

    I was able to fix the problem by installing: @babel/preset-typescript

    And creating a babel.config.js file with this configuration:

    module.exports = { presets: [
    ['@babel/preset-env', { targets: { node: 'current' } }],
    '@babel/preset-typescript',
    ], };