vue spinner causing jest tests to fail

[Mary Musimire]

What's the right way to configure jest when using vue-spinner package. After adding the package, tests fail with this:
` Jest encountered an unexpected token

This usually means that you are trying to import a file which Jest cannot parse, e.g. it's not plain JavaScript.

By default, if Jest sees a Babel config, it will use that to transform your files, ignoring "node_modules".

Here's what you can do:
 • To have some of your "node_modules" files transformed, you can specify a custom "transformIgnorePatterns" in your config.
 • If you need a custom transformation specify a "transform" option in your config.
 • If you simply want to mock your non-JS modules (e.g. binary assets) you can stub them out with the "moduleNameMapper" config option.

You'll find more details and examples of these config options in the docs:
https://jestjs.io/docs/en/configuration.html`

Tried the suggestions there but no success. My current jest config file:
{ "preset": "jest-puppeteer", "testRegex": "./new-e2e/.*.js$" }

[Pablo Molina]

I have the same issue running Vue 2.7 with Jest 27

console.error
[Vue warn]: Failed to resolve async component: function PulseLoader() {
      return Promise.resolve().then(function () {
        return (0, _interopRequireWildcard2.default)(require('vue-spinner/src/PulseLoader.vue'));
      });
    }
Reason: SyntaxError: Unexpected token '<'

[Pablo Molina]

I have the same issue running Vue 2.7 with Jest 27

console.error

[Vue warn]: Failed to resolve async component: function PulseLoader() {

      return Promise.resolve().then(function () {

        return (0, _interopRequireWildcard2.default)(require('vue-spinner/src/PulseLoader.vue'));

      });

    }

Reason: SyntaxError: Unexpected token '<'

I ended up mocking the component for the time being since it's not really useful for the test case I needed. At least this won't be a blocker if you want to test your component.

jest.mock('vue-spinner/src/PulseLoader.vue', () => ({
  render: (h) => h('div', 'PulseLoader'),
}))