import/namespace: Parse errors in imported module '@testing-library/user-event': ',' expected using Vue 2.6.x and @testing-library/vue

[andresuchitra]

Reproduction example

https://codesandbox.io/s/loving-archimedes-vvcdt3

Prerequisites

1. Setup Vue 2.6.x
2. Setup @testing-library/vue@5 ->

Expected behavior

No VS code error or import/namespace error appeared

Actual behavior

Error in VSCODE:

Parse errors in imported module '@testing-library/user-event': ',' expected. (6:39)

eslint[import/namespace](https://github.com/import-js/eslint-plugin-import/blob/v2.26.0/docs/rules/namespace.md)

User-event version

14.5.1

Environment

Testing Library framework: 14.5.1

JS framework: [email protected], [email protected]

Test environment: "jest": "27.4.5"

JS DOM:

"@testing-library/dom": "^9.3.3",
"@testing-library/jest-dom": "5.16.2",

Additional context

I have vue, nuxt, and @testing-library/vue project, and after running: yarn add --dev @testing-library/user-event

the setup below works in my test running:

import { userEvent as userEventLib } from "@testing-library/user-event";
//....
//....
const userEvent = userEventLib.setup(); // works

However, I can't do build / run the dev due to error in the title above. I'm using VSCODE. But I can successfully run and simulate the userEvent.paste() call.

Please help how to fix the import error.

Thanks!

[hood]

There is something broken in your eslint-plugin-import setup.

[raplemie]

This seems to be the same root cause than #1161, see https://github.com/testing-library/user-event/issues/1161#issuecomment-1781575530, maybe it will help.