nuxt-modules/color-mode

Throws Error about accessing `preference` of `undefined`

chrisspiegl opened this issue · 4 comments

chrisspiegl commented

Version

See Reproduction

Reproduction Link

https://codesandbox.io/p/sandbox/reproduction-color-mode-preference-of-undefined-mp9252?file=%2Fpackage.json%3A5%2C22

Steps to reproduce

Running Vitest in a Package that uses @nuxtjs/color-mode throws error upon initialization.

It is enough to have @nuxtjs/color-mode in the nuxt.config.js file without accessing the useColorMode() anywhere in code.

Running pnpm vitest in the reproduction throws:

[nuxt] error caught during app initialization TypeError: Cannot read properties of undefined (reading 'preference')

What is Expected?

Vitest should run without throwing any error.

What is actually happening?

Running Vitest throws an error as described above when @nuxtjs/color-mode is present as a module in nuxt.config.js.

Extarys commented

Came up with this error today, I disabled the module for now.

oluwakayode-a commented

Ran into this issue today with Nuxt 3.8; seems the last working version is Nuxt 3.6

EDIT:
Seems service workers are somehow interfering with this. I tried downgrading to v.3.2.0, and running in incognito, and it works fine there.
Disabled service workers on localhost:3000, and app runs fine.

Also, install in modules, rather than plugins.

export default defineNuxtConfig({
  devtools: { enabled: true },
  modules: [
    "@nuxtjs/color-mode"
  ]
})
  • 👀1
l4dybird commented

In my environment, v3.3.1 resolved the issue.

chrisspiegl commented

I now also ran my code with vitest and the latest versions of both @nuxt/test-utils, vitest, and @nuxtjs/color-mode at 3.3.2.