Routify hangs with vitest

[yairkukielka]

Describe the bug

When running the tests it looks like the process hangs at the end, just after passing the tests.

Reproduction

When running tests with vitest. The issue gets resolved if I remove the routify plugin from the vite config file, so it looks like routify is the culprit. After the Vitest default 10 seconds timout, the process is killed by Vitest

See reproduction example here https://github.com/yairkukielka/routify-vitest-example

Logs

npm run test

> vitest-routify@0.0.0 test
> vitest run

[Routify 3] build completed (31 ms)

 RUN  v1.6.0 /Users/myuser/p/exp/routify-vitest-example

 ✓ src/components/component1/Component1.spec.js (1)
   ✓ my description (1)
     ✓ simple test

 Test Files  1 passed (1)
      Tests  1 passed (1)
   Start at  13:30:16
   Duration  454ms (transform 27ms, setup 0ms, collect 14ms, tests 3ms, environment 0ms, prepare 122ms)

close timed out after 10000ms
Tests closed successfully but something prevents Vite server from exiting
You can try to identify the cause by enabling "hanging-process" reporter. See https://vitest.dev/config/#reporters

If I add this

  test: {
    reporters: ["default", "hanging-process"],
  },

to the vite config as the error suggests, I get

There are 8 handle(s) keeping the process running

# Tinypool
node:internal/async_hooks:200                                                                                   
node:internal/async_hooks:503                                                                                   
file:///Users/myuser/p/exp/routify-vitest-example/node_modules/tinypool/dist/esm/index.js:37              
file:///Users/myuser/p/exp/routify-vitest-example/node_modules/tinypool/dist/esm/index.js:58              
file:///Users/myuser/p/exp/routify-vitest-example/node_modules/tinypool/dist/esm/index.js:952             
file:///Users/myuser/p/exp/routify-vitest-example/node_modules/vitest/dist/vendor/cli-api.E07AF1Yq.js:8192
file:///Users/myuser/p/exp/routify-vitest-example/node_modules/vitest/dist/vendor/cli-api.E07AF1Yq.js:8845
file:///Users/myuser/p/exp/routify-vitest-example/node_modules/vitest/dist/vendor/cli-api.E07AF1Yq.js:8870

# FILEHANDLE
node:internal/async_hooks:200

# FILEHANDLE
node:internal/async_hooks:200

# FILEHANDLE
node:internal/async_hooks:200

# FILEHANDLE
node:internal/async_hooks:200

# FILEHANDLE
node:internal/async_hooks:200

# FILEHANDLE
node:internal/async_hooks:200

# FILEHANDLE
node:internal/async_hooks:200
close timed out after 10000ms
Tests closed successfully but something prevents Vite server from exiting
You can try to identify the cause by enabling "hanging-process" reporter. See https://vitest.dev/config/#reporters

### System Info

```shell
System:
    OS: macOS 13.6.6
    CPU: (12) x64 Intel(R) Core(TM) i7-8750H CPU @ 2.20GHz
    Memory: 163.13 MB / 16.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 18.19.1 - ~/.nvm/versions/node/v18.19.1/bin/node
    npm: 10.2.4 - ~/.nvm/versions/node/v18.19.1/bin/npm
  npmPackages:
    @roxi/routify: ^3.0.0-next.223 => 3.0.0-next.225 
    svelte: ^4.2.12 => 4.2.17 
    vite: ^5.2.0 => 5.2.11

[jakobrosenberg]

Thanks for the report @yairkukielka

I am not able to reproduce it on my end.

What happens if you run npm init routify@latest and select starter-basic with all components included. Then run npm run test. Make sure the ssr is enabled:

routify({ render: { ssr: { enable: true } } }),

[yairkukielka]

Ok, I tried but the test failed :)

 FAIL  tests/test.spec.js > can see /
AssertionError: expected '' to contain 'Welcome to Your New Routify 3 Project!'

- Expected
+ Received

- Welcome to Your New Routify 3 Project!

 ❯ tests/test.spec.js:15:37
     13|     await router.url.push('/')
     14| 
     15|     expect(document.body.innerHTML).toContain('Welcome to Your New Routify 3 Project!')
       |                                     ^
     16| })
     17| 

⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯[1/1]⎯

 Test Files  1 failed (1)
      Tests  1 failed (1)
   Start at  18:38:17

I couldn't make it pass. In any case, what you suggested is a different project. Mine doesn't use ssr, it's an SPA. Could you try my example?

[jakobrosenberg]

The ssr wasn't needed. Blunder on my part.

Tried your code. Seems you're missing

<script context="module">

in your App.svelte.

Without context="module" the export below doesn't work.

  export const router = createRouter({ routes });

Let me know if this works for you. 😊

[yairkukielka]

Hello, thanks for taking a look. Unfortunately that didn't fix it. I replaced <script> with <script context="module"> but I'm still getting the same problem when I run tests:

close timed out after 10000ms
Tests closed successfully but something prevents Vite server from exiting
You can try to identify the cause by enabling "hanging-process" reporter. See https://vitest.dev/config/#reporters

[jakobrosenberg]

I fixed some timing issues related to testing, could you try the following

mkdir mytest
cd mytest
npm init routify@latest . -- -t starter-basic -i -p npm -v 3 --features test -r
npm run test

[yairkukielka]

Hello, this isn't using my reproduction example, is it? I think it would be useful to fix it there

[jakobrosenberg]

I can't tell if it fixes your example as I couldn't reproduce the error when I ran it.

If the commands above work for you, we'll have something to go on in terms of fixing the issue.