Quasar 2 / Vue 3: Cannot use keyword 'await' outside an async function - top level await

I have a new Quasar 2 / Vue 3 app open in VSCode, created using the Quasar CLI and accepting all the defaults including using eslint.

I have NOT started the app (quasar dev).

Vitest is installed via the quasar ext add @quasar/testing-unit-vitest. The example tests work.

ie npm run test:unit - all tests pass.

Now, in my Vitest script I wanted to load a custom class that does some setup and am encountering the eslint error: Parsing error: Cannot use keyword 'await' outside an async function which is strange because I am using node 18.18.0 and "top level awaits" are valid. More to the point, the test runs correctly after the "top level" async method runs. See code below using a bare-bones method to test the linting error.

However: I cannot launch my Quasar app because it chokes on the eslint error. I have tried all sorts of ways to disable the linting. One thing that does suppress this error is in .eslintrc.cjs to comment out the entry 'plugin:vue/vue3-essential',. As soon as I do that the error disappears (but others appear!) so it seems it is something in there?

Any suggestions on how I can suppress that error in order that I can start Quasar?

Thanks, Murray

import { installQuasarPlugin } from '@quasar/quasar-app-extension-testing-unit-vitest';
import { mount } from '@vue/test-utils';
import { describe, expect, it } from 'vitest';
import ExampleComponent from './demo/ExampleComponent.vue';

// === Added this custom section
import TestAwait from './testawait.js';
const testawait = new TestAwait();

// These don't suppress the error
/* eslint-disable */
// eslint-disable-next-line
await testawait.mytestAsync(); // <==== eslint error here
// === End custom section

installQuasarPlugin();

describe('example Component', () => {
  it('should mount component with todos', async () => {
    const wrapper = mount(ExampleComponent, {
      props: {
        title: 'Hello',
        totalCount: 4,
        todos: [
          { id: 1, content: 'Hallo' },
          { id: 2, content: 'Hoi' },
        ],
      },
    });
    expect(wrapper.vm.clickCount).toBe(0);
    await wrapper.find('.q-item').trigger('click');
    expect(wrapper.vm.clickCount).toBe(1);
  });
});

The class:

class TestClass {
  constructor() {
    console.log('TestClass class instantiated');
  }

  async mytestAsync () {
    await new Promise(resolve => setTimeout(resolve, 2000));
    console.log('mytestAsync() ran!');
  }
}

export default TestClass;

The result:

Ok, after getting some sleep the answer was obvious!

In .eslintrc.cjs file exclude the tests folder by using the ignorePatterns so the test files are not linted:

module.exports = {
  // ...
 
  ignorePatterns: [
    '**/__tests__/'
  ],

  // ...
}

Fixed! And Quasar now starts up. :-)