首页 > 解决方案 > Using Jest with Vue, Jest appears to choke on an HTML comment in a .vue file

问题描述

Below is the output I'm seeing when I run Jest:

  ● Test suite failed to run

    /home/ubuntu/chat-app/frontend/node_modules/@babel/runtime-corejs2/helpers/esm/asyncToGenerator.js:1
    ({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,global,jest){import _Promise from "../../core-js/promise";
                                                                                                    ^^^^^^^^

    SyntaxError: Unexpected identifier

      11 |                     {{ current_nickname }}
      12 |
    > 13 |                     <!-- https://linearicons.com/free#cdn -->
         |                                                 ^
      14 |                     <span class="lnr-button">
      15 |                         <svg class="lnr lnr-pencil" @click="prompt_nickname()"><use xlink:href="#lnr-pencil" /></svg>
      16 |                     </span>

      at ScriptTransformer._transformAndBuildScript (node_modules/@jest/transform/build/ScriptTransformer.js:471:17)
      at ScriptTransformer.transform (node_modules/@jest/transform/build/ScriptTransformer.js:513:25)
      at src/components/ChatApp.vue:13:49
      at Object.<anonymous> (src/components/ChatApp.vue:219:3)

It seems to be choking on HTML comments.

What might the issue be?

Here are the other relevant config files:

babel.config.js:

module.exports = {
  presets: [
    '@vue/app'
  ]
}

jest.config.js:

module.exports = {
        moduleFileExtensions: ['js', 'jsx', 'json', 'vue'],
        transform: {
                '^.+\\.vue$': '<rootDir>/node_modules/vue-jest',
                '.+\\.(css|styl|less|sass|scss|png|jpg|ttf|woff|woff2)$':
                'jest-transform-stub',
                '^.+\\.(js|jsx)?$': '<rootDir>/node_modules/babel-jest'
        },
        moduleNameMapper: {
                '^@/(.*)$': '<rootDir>/src/$1'
        },
        snapshotSerializers: ['jest-serializer-vue'],
        transformIgnorePatterns: ['<rootDir>/node_modules/']
};

Not sure what the issue is, help appreciated, thanks.

标签: vue.jsjestjs

解决方案


推荐阅读