Jest failing after v5 update

[andreadisaro]

Hi,
I've just tried updating from 4.6.3 to 5.0.2 and while the project runs fine, jest doesn't.
I've implemented the method using the real router, and as soon it hits the imports from vue-router:

import { createRouter, createWebHistory } from 'vue-router'

I get this error:

\node_modules\vue-router\node_modules\perfect-debounce\dist\index.mjs:89 export { debounce };

`SyntaxError: Unexpected token 'export'`

this is my setup.js for jest:

import { createApp, markRaw } from 'vue'
import { createPinia } from 'pinia'
import piniaPluginPersistedstate from 'pinia-plugin-persistedstate'
import { createTestingPinia } from '@pinia/testing'
import initialState from './mocks/initialState'

import i18n from '../src/i18n/i18n'

import App from '../src/App.vue'
import router from '../src/router'

import { config } from '@vue/test-utils'

import CoreuiVue from '@coreui/vue'
import CIcon from '@coreui/icons-vue'
import { iconsSet as icons } from '@/assets/icons'
import {
CButton,// plus others
} from '@coreui/vue'

config.global.stubs['CButton'] = CButton
//others like this...

config.global.mocks = {
$t: (tKey) => tKey, // just return translation key
}
config.global.plugins = [
i18n,
createTestingPinia({
initialState,
}),
]

const app = createApp(App)
const pinia = createPinia()
pinia.use(piniaPluginPersistedstate).use(({ store }) => {
store.router = markRaw(router)
})
app.use(pinia)
app.use(router)
app.use(CoreuiVue)
app.use(i18n)
app.provide('icons', icons)

app.component('CIcon', CIcon)

//app.component('DocsExample', DocsExample)

global.Vue = app

const originalWarn = window.console.warn
window.console.warn = (e) => {
if (
e.includes('If this is a native custom element') ||
(e.includes('Not found') && e.includes('locale messages'))
) {
return ''
}
return originalWarn(e)
}

window.scrollTo = () => {}

window.location = {
assign: jest.fn(),
replace: jest.fn(),
reload: jest.fn(),
href: 'http://localhost/',
toString: jest.fn(),
origin: jest.fn(),
protocol: jest.fn(),
host: jest.fn(),
hostname: jest.fn(),
port: jest.fn(),
pathname: jest.fn(),
search: jest.fn(),
hash: jest.fn(),
}

const mockPathname = jest.fn()
Object.defineProperty(window, 'location', {
value: {
get pathname() {
return mockPathname()
},
},
})

mockPathname.mockReturnValue('some')

Object.defineProperty(window, 'location', {
value: {
pathname: '/some-path-name',
},
})

[andreadisaro]

Claude resolved the issue for me, had to add:

transformIgnorePatterns: [ 'node_modules/(?!(vue-router|@vue/devtools-api|@vue/devtools-kit|perfect-debounce)/)', ],

transform: { '^.+\\.vue$': '@vue/vue3-jest', '^.+\\.(js|jsx|mjs)?$': 'babel-jest', },
(just mjs for babel-jest, the rest was already there)

to jest.config.js