使用Jest在Nx Workspace项目中对Svelte应用程序进行单元测试时出错

Question

我创建了一个空的NxWorkspace，然后按照步骤here添加了一个svelte项目。我使用命令nx g @nxext/svelte:c my-comp添加了元件及其等级库文件。在此之前，测试运行没有任何问题，但是在向MyComp.svelte文件添加一些TypeScript代码(如下所示)后，测试停止。

<script lang="ts">
  let temp: string;
</script>

<h1>Hello component!</h1>

<h1>
</h1>

测试文件my-comp.spec.ts

import MyComp from './MyComp.svelte';
import { render } from '@testing-library/svelte';

it('it works', async () => {
  const { getByText } = render(MyComp);

  expect(getByText('Hello component!'));
});

我收到的错误是：

 FAIL   my-app  apps/my-app/src/components/my-comp/my-comp.spec.ts
  ● Test suite failed to run

    ParseError: Unexpected token

      at error (../../node_modules/svelte/src/compiler/utils/error.ts:25:16)
      at Parser$1.error (../../node_modules/svelte/src/compiler/parse/index.ts:100:3)
      at Parser$1.acorn_error (../../node_modules/svelte/src/compiler/parse/index.ts:93:8)
      at Object.read_script [as read] (../../node_modules/svelte/src/compiler/parse/read/script.ts:51:10)
      at tag (../../node_modules/svelte/src/compiler/parse/state/tag.ts:205:27)
      at new Parser$1 (../../node_modules/svelte/src/compiler/parse/index.ts:52:12)
      at parse (../../node_modules/svelte/src/compiler/parse/index.ts:216:17)
      at Object.compile (../../node_modules/svelte/src/compiler/compile/index.ts:91:14)
      at Object.process (../../node_modules/svelte-jester/src/transformer.js:21:25)
      at ScriptTransformer.transformSource (../../node_modules/@jest/transform/build/ScriptTransformer.js:464:35)

生成的jest.config.js

module.exports = {
  displayName: 'my-app',
  preset: '../../jest.preset.js',
  globals: {
    'ts-jest': {
      tsconfig: '<rootDir>/tsconfig.spec.json',
    },
  },
  transform: {
    '^.+\\.svelte$': 'svelte-jester',
    '^.+\\.[tj]s$': 'ts-jest',
  },
  moduleFileExtensions: ['ts', 'js', 'html', 'svelte'],
  coverageDirectory: '../../coverage/apps/my-app',
};

tsconfig.json文件：

{
  "extends": "../../tsconfig.base.json",

  "compilerOptions": {
    "moduleResolution": "node",
    "target": "es2017",
    /**
      Svelte Preprocess cannot figure out whether you have a value or a type, so tell TypeScript
      to enforce using `import type` instead of `import` for Types.
     */
    "importsNotUsedAsValues": "error",
    "isolatedModules": true,
    /**
      To have warnings/errors of the Svelte compiler at the correct position,
      enable source maps by default.
     */
    "sourceMap": true,
    /** Requests the runtime types from the svelte modules by default. Needed for TS files or else you get errors. */
    "types": ["svelte"],

    "strict": false,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "forceConsistentCasingInFileNames": true
  },
  "files": [],
  "include": [],
  "references": [
    {
      "path": "./tsconfig.app.json"
    },
    {
      "path": "./tsconfig.spec.json"
    }
  ]
}

the tsconfig.spec.json

{
  "extends": "./tsconfig.json",
  "compilerOptions": {
    "outDir": "../../dist/out-tsc",
    "module": "commonjs",
    "types": ["jest", "node", "@types/jest"]
  },
  "include": [
    "**/*.spec.ts",
    "**/*.spec.tsx",
    "**/*.spec.js",
    "**/*.spec.jsx",
    "**/*.d.ts"
  ]
}

NX工作区根目录下的tsconfig.base.json

{
  "compileOnSave": false,
  "compilerOptions": {
    "rootDir": ".",
    "sourceMap": true,
    "declaration": false,
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "importHelpers": true,
    "target": "es2015",
    "module": "esnext",
    "lib": ["es2017", "dom"],
    "skipLibCheck": true,
    "skipDefaultLibCheck": true,
    "baseUrl": ".",
    "paths": {}
  },
  "exclude": ["node_modules", "tmp"]
}

我在跳，有一些简单的修复在这些文件中，我没有看到。

提前谢谢。

Answer 1

对于那些发现相同问题的人，可以在GitHub存储库中的以下issue中找到此问题的答案。