SyntaxError with TS: Unexpected token with [email protected]

[wegry]

🐛 Bug Report

jest-environment-puppeteer doesn't seem to respect @babel/preset-typescript when running a jest.setupFilesAfterEnv.ts (note the TS file extension).

My project's setup file begins with

function makeFunctionWrapTestArgs<F extends Function>(fn: F): F {
  const newFn: any = function (this: any, ...args: any[]) {
  }
}

And running the tests fails with a

 FAIL  test.test.ts
  ● Test suite failed to run

    SyntaxError: OBFUSCATED_PROJECT_PATH/test/mockGmail/jest.setupFilesAfterEnv.ts: Unexpected token, expected "(" (11:33)

    > 11 | function makeFunctionWrapTestArgs<F extends Function>(fn: F): F {

To Reproduce

Steps to reproduce the behavior:

With a package.json of

    "@babel/cli": "^7.18.10",
    "@babel/core": "^7.18.10",
    "@babel/node": "^7.18.10",
    "@babel/preset-env": "^7.18.10",
    "@babel/preset-react": "^7.18.6",
    "@babel/preset-typescript": "^7.18.6",
    "@babel/register": "^7.18.9",
    "@types/jest": "27",
    "babel-jest": "^28.1.3",
    "babel-loader": "^8.2.2",
    "jest": "^28.1.3",
    "@babel/eslint-parser": "^7.18.9",
    "@jest/globals": "^28.1.3",
    "@jest/types": "^28.1.3",
    "@types/expect-puppeteer": "^4.4.7",
    "@types/puppeteer": "^5.4.4",
    "expect-puppeteer": "^6.0.2",
    "jest-css-modules": "^2.1.0",
    "jest-environment-jsdom": "^28.1.3",
    "jest-environment-puppeteer": "^6.1.1",
    "jest-junit": "^14.0.0",
    "jest-puppeteer": "^6.1.1",
    "puppeteer": "^13.0.1",
    "puppeteer-har": "^1.1.2",

Debug config output

{
  "configs": [
    {
      "automock": false,
      "cache": true,
      "cacheDirectory": "/private/var/folders/k5/x6ks_wdd1b31y221zccrmbtm0000gn/T/jest_dx",
      "clearMocks": false,
      "coveragePathIgnorePatterns": [
        "/node_modules/"
      ],
      "cwd": "OBFUSCATED_PROJECT_PATH",
      "detectLeaks": false,
      "detectOpenHandles": false,
      "errorOnDeprecated": false,
      "extensionsToTreatAsEsm": [],
      "fakeTimers": {
        "enableGlobally": false
      },
      "forceCoverageMatch": [],
      "globalSetup": "OBFUSCATED_PROJECT_PATH/.jest/global-setup-with-puppeteer.js",
      "globalTeardown": "OBFUSCATED_PROJECT_PATH/.yarn/cache/jest-environment-puppeteer-npm-6.1.1-258bdd4b0d-bb7da88011.zip/node_modules/jest-environment-puppeteer/teardown.js",
      "globals": {},
      "haste": {
        "computeSha1": false,
        "enableSymlinks": false,
        "forceNodeFilesystemAPI": true,
        "throwOnModuleCollision": false
      },
      "id": "77babba468a260f3136820e8ff37be8b",
      "injectGlobals": true,
      "moduleDirectories": [
        "node_modules"
      ],
      "moduleFileExtensions": [
        "js",
        "mjs",
        "cjs",
        "jsx",
        "ts",
        "tsx",
        "json",
        "node"
      ],
      "moduleNameMapper": [],
      "modulePathIgnorePatterns": [],
      "prettierPath": "prettier",
      "resetMocks": false,
      "resetModules": false,
      "restoreMocks": false,
      "rootDir": "OBFUSCATED_PROJECT_PATH/test/mockGmail",
      "roots": [
        "OBFUSCATED_PROJECT_PATH/test/mockGmail"
      ],
      "runner": "OBFUSCATED_PROJECT_PATH/.yarn/cache/jest-runner-npm-28.1.3-b6c86f7ed5-32405cd970.zip/node_modules/jest-runner/build/index.js",
      "sandboxInjectedGlobals": [],
      "setupFiles": [],
      "setupFilesAfterEnv": [
        "OBFUSCATED_PROJECT_PATH/.yarn/cache/expect-puppeteer-npm-6.1.1-fdfbeee2e9-c2e3064941.zip/node_modules/expect-puppeteer/lib/index.js",
        "OBFUSCATED_PROJECT_PATH/test/mockGmail/jest.setupFilesAfterEnv.ts"
      ],
      "skipFilter": false,
      "slowTestThreshold": 5,
      "snapshotSerializers": [],
      "testEnvironment": "OBFUSCATED_PROJECT_PATH/.yarn/cache/jest-environment-puppeteer-npm-6.1.1-258bdd4b0d-bb7da88011.zip/node_modules/jest-environment-puppeteer/index.js",
      "testEnvironmentOptions": {},
      "testLocationInResults": false,
      "testMatch": [
        "**/__tests__/**/*.[jt]s?(x)",
        "**/?(*.)+(spec|test).[tj]s?(x)"
      ],
      "testPathIgnorePatterns": [
        "/node_modules/"
      ],
      "testRegex": [],
      "testRunner": "OBFUSCATED_PROJECT_PATH/.yarn/cache/jest-circus-npm-28.1.3-cd59c17100-b635e60a9c.zip/node_modules/jest-circus/runner.js",
      "transform": [
        [
          "\\.[jt]sx?$",
          "OBFUSCATED_PROJECT_PATH/.yarn/__virtual__/babel-jest-virtual-7923f84df4/0/cache/babel-jest-npm-28.1.3-3bb56d0efd-57ccd2296e.zip/node_modules/babel-jest/build/index.js",
          {}
        ]
      ],
      "transformIgnorePatterns": [
        "/node_modules/",
        "\\.pnp\\.[^\\/]+$"
      ],
      "watchPathIgnorePatterns": []
    }
  ],
  "globalConfig": {
    "bail": 0,
    "changedFilesWithAncestor": false,
    "ci": false,
    "collectCoverage": false,
    "collectCoverageFrom": [],
    "coverageDirectory": "OBFUSCATED_PROJECT_PATH/test/mockGmail/coverage",
    "coverageProvider": "babel",
    "coverageReporters": [
      "json",
      "text",
      "lcov",
      "clover"
    ],
    "detectLeaks": false,
    "detectOpenHandles": false,
    "errorOnDeprecated": false,
    "expand": false,
    "findRelatedTests": false,
    "forceExit": false,
    "globalSetup": "OBFUSCATED_PROJECT_PATH/.jest/global-setup-with-puppeteer.js",
    "globalTeardown": "OBFUSCATED_PROJECT_PATH/.yarn/cache/jest-environment-puppeteer-npm-6.1.1-258bdd4b0d-bb7da88011.zip/node_modules/jest-environment-puppeteer/teardown.js",
    "json": false,
    "lastCommit": false,
    "listTests": false,
    "logHeapUsage": false,
    "maxConcurrency": 5,
    "maxWorkers": 1,
    "noStackTrace": false,
    "nonFlagArgs": [],
    "notify": false,
    "notifyMode": "failure-change",
    "onlyChanged": false,
    "onlyFailures": false,
    "passWithNoTests": false,
    "projects": [],
    "rootDir": "OBFUSCATED_PROJECT_PATH/test/mockGmail",
    "runTestsByPath": false,
    "skipFilter": false,
    "testFailureExitCode": 1,
    "testPathPattern": "",
    "testSequencer": "OBFUSCATED_PROJECT_PATH/.yarn/cache/@jest-test-sequencer-npm-28.1.3-456bc6e2ff-13f8905e6d.zip/node_modules/@jest/test-sequencer/build/index.js",
    "updateSnapshot": "new",
    "useStderr": false,
    "verbose": true,
    "watch": false,
    "watchAll": false,
    "watchman": true
  },
  "version": "28.1.3"
}

Expected behavior

Version 6 of jest-environment-puppeteer should handle transpiling TS setup files like version 5.

Link to repl or repo (highly encouraged)

Please provide a minimal repository on GitHub.

Will add if I get a chance later.

Issues without a reproduction link are likely to stall.

Run npx envinfo --system --binaries --npmPackages expect-puppeteer,jest-dev-server,jest-environment-puppeteer,jest-puppeteer,spawnd --markdown --clipboard

Paste the results here:

## System:
 - OS: macOS 12.4
 - CPU: (8) arm64 Apple M1 Pro
 - Memory: 4.49 GB / 32.00 GB
 - Shell: 5.8.1 - /bin/zsh
## Binaries:
 - Node: 16.15.1 - ~/.nvm/versions/node/v16.15.1/bin/node
 - Yarn: 3.2.2 - /opt/homebrew/bin/yarn
 - npm: 8.11.0 - ~/.nvm/versions/node/v16.15.1/bin/npm

[UziTech]

There were a lot of breaking changes in jest v28 that affected environments. I have not been able to fix some of those issues yet but I'm guessing this is part of that.

If you would like to create a PR that tests against jest v28 and gets all the tests passing this could go a lot faster. I don't have a lot of time to work on it these days.

[gregberge]

Tests are now running on Jest 29. I close it.

[wegry]

@gregberge with jest@29 [email protected] and [email protected] I'm still seeing this same syntax error reported.

[gregberge]

@wegry I think the syntax error is not related to Jest Puppeteer but I can be wrong. Anyway I am rewriting the entire library in TypeScript.

[wegry]

For posterity's sake, the issue here bumping from Jest 27 -> 29 was that our jest-puppeteer tests weren't at the project root. Because they were in a nested folder, it seems like the top level babel.config.json wasn't respected by babel-jest. Adding .babelrc files at the same folder depth we run the tests from appears to patch up this particular issue.