import() fails when you have a variable string importing a Vue component

[pikax]

Describe the bug

When you use import() if the string is a variable it doesn't work, if is a variable it must have an absolute path.

// tests/test.spec.ts
import { test, expect } from "vitest";

test("test import", async () => {
  const Hello = import("./../src/components/HelloWorld.vue");

  const HelloPath = "./../src/components/HelloWorld.vue";
  const HelloOther = import(HelloPath); // fails here

  expect(Hello).toBe(HelloOther);
});

From my findings the request fails here directRequest, the id seems to still be the string provided on the import, when you pass a static string it will convert the relative path into the absolute.

Reproduction

StackBlitz

// basic.test.ts
import { test, expect } from 'vitest';

test('test import', async () => {
  const Hello = await import('./../src/components/HelloWorld.vue');

  const HelloPath = './../src/components/HelloWorld.vue';
  const HelloOther = await import(HelloPath); // fails here

  expect(Hello).toBe(HelloOther);
});

System Info

System:
    OS: Windows 10 10.0.22000
    CPU: (24) x64 AMD Ryzen 9 3900X 12-Core Processor
    Memory: 23.50 GB / 63.94 GB
  Binaries:
    Node: 16.10.0 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.22.13 - C:\Program Files\nodejs\yarn.CMD
    npm: 7.24.0 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Edge: Spartan (44.22000.120.0), Chromium (98.0.1108.56)
    Internet Explorer: 11.0.22000.120
  npmPackages:
    @vitejs/plugin-vue: ^2.2.2 => 2.2.2
    vite: ^2.8.4 => 2.8.4
    vitest: ^0.4.1 => 0.4.

Used Package Manager

npm

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• The provided reproduction is a minimal reproducible example of the bug.

[pikax]

@antfu is this released? Still having the issue on 0.5.0 StackBlitz still failing 🤔

[sheremet-va]

@antfu is this released? Still having the issue on 0.5.0 StackBlitz still failing 🤔

It failes because they are not equal objects. That is another issue. Importing works fine

[pikax]

It failes because they are not equal objects. That is another issue. Importing works fine

🤦

Sorry, still having the issue on my project, will need to investigate further, apologies for this

[pikax]

@sheremet-va Dig a bit further and I can confirm the error is still there, should I create another issue or we can reuse this one?

https://stackblitz.com/edit/vitest-dev-vitest-pnp26x?file=src%2Fcomponents%2FHelloWorld.vue

<script>
import { ref, defineComponent, watch } from 'vue';

export default {
  props: {
    type: String,
  },
  setup(props) {
    console.log('some', ref);
    const Comp = ref('div');

    watch(
      () => props.type,
      async (type) => {
        import('./editors/Text.vue')
          .then((e) => {
            console.log('[String] resolved as expected');
            return e;
          })
          .catch((e) => {
            console.error('[String] Failed', e);
          });

        import(`./editors/Text.vue`)
          .then((e) => {
            console.log('[String-2] resolved as expected');
            return e;
          })
          .catch((e) => {
            console.error('[String-2] Failed', e);
          });

        Comp.value = await import(`./editors/${type}.vue`)
          .then((e) => {
            console.log('[Dynamic] resolved');
            return e;
          })
          .catch((e) => {
            console.error('[Dynamic] Failed', e);
          });
      },
      {
        immediate: true,
      }
    );
    return {
      Comp,
    };
  },
};
</script>

<template>
  <div>
    <!-- <span>Hello There</span> -->
    <component :is="Comp" />
  </div>
</template>

//output
stdout | unknown test
[String] resolved as expected

stderr | unknown test
[String-2] Failed Error: [vite-node] Failed to load ./editors/Text.vue
    at VitestRunner.directRequest (file:///home/projects/vitest-dev-vitest-pnp26x/node_modules/vitest/dist/client-4904f549.js:9370:13)

stderr | unknown test
[Dynamic] Failed Error: [vite-node] Failed to load ./editors/Text.vue
    at VitestRunner.directRequest (file:///home/projects/vitest-dev-vitest-pnp26x/node_modules/vitest/dist/client-4904f549.js:9370:13)

Expected output

[String] resolved as expected
[String-2] resolved as expected
[Dynamic] resolved

Hopefully I'm not making a silly mistake :D I had a couple coffee today, but you never know :D