"Cannot convert undefined or null to object" at installQuasar

[rimijn]

Application uses vue3 + ts + quasar v2 and jest for testing. Unit test are failing with error "Cannot convert undefined or null to object" at installQuasar when doing localVue.use(Quasar) or plugins: [Quasar] in test file. The config files are as mentioned below

package.json -

"dependencies": {
    "@quasar/extras": "^1.11.4",
    "@types/vue-i18n": "^7.0.0",
    "axios": "^0.20.0",
    "core-js": "^3.6.5",
    "d3": "^6.2.0",
    "echarts": "^5.1.2",
    "lodash": "~4.17.20",
    "qs": "^6.9.6",
    "quasar": "^2.2.1",
    "rison": "^0.1.1",
    "vue": "3.0.6",
    "vue-i18n": "^9.1.5",
    "vue-router": "^4.0.12"
  },
  "devDependencies": {
    "@types/d3": "^5.16.3",
    "@types/echarts": "^4.9.8",
    "@types/lodash": "^4.14.160",
    "@types/node": "^14.17.32",
    "@types/rison": "0.0.6",
    "@types/webpack-env": "^1.16.3",
    "@typescript-eslint/eslint-plugin": "^5.3.1",
    "@typescript-eslint/parser": "^5.3.1",
    "@vue/cli-plugin-babel": "^4.5.14",
    "@vue/cli-plugin-eslint": "^4.5.14",
    "@vue/cli-plugin-router": "^4.5.14",
    "@vue/cli-plugin-typescript": "^4.5.14",
    "@vue/cli-plugin-unit-jest": "^4.5.15",
    "@vue/cli-service": "~4.5.0",
    "@vue/compiler-sfc": "3.0.0",
    "@vue/eslint-config-prettier": "^6.0.0",
    "@vue/eslint-config-typescript": "^9.0.1",
    "@vue/test-utils": "^2.0.0-0",
    "babel-core": "^7.0.0-bridge.0",
    "babel-plugin-transform-imports": "2.0.0",
    "eslint": "^7.0.0",
    "eslint-plugin-prettier": "^3.1.3",
    "eslint-plugin-vue": "^7.0.0",
    "node-sass": "4.13.0",
    "prettier": "^1.19.1",
    "sass-loader": "^8.0.2",
    "typescript": "~3.9.3",
    "vue-cli-plugin-quasar": "~4.0.4",
    "vue-jest": "^5.0.0-0"
  }

jest.config.js -

module.exports = {
  preset: "@vue/cli-plugin-unit-jest/presets/typescript-and-babel",
  transformIgnorePatterns: ["node_modules/(?!(quasar|echarts|zrender)/)"],
  transform: {
    // process *.vue files with vue-jest
    '^.+\\.vue$': require.resolve('vue-jest'),
  }
};

babel.config.js -

module.exports = {
  presets: ["@vue/cli-plugin-babel/preset"]
};

test file assets.spec.ts-

import { Quasar } from "quasar";
import { createApp } from "vue";

const localVue = createApp({});
localVue.use(Quasar);

Error

 Test suite failed to run

    TypeError: Cannot convert undefined or null to object
        at Function.assign (<anonymous>)

      4 |
      5 | const localVue = createApp({});
    > 6 | localVue.use(Quasar);
        |          ^
      7 |

      at installQuasar (node_modules/quasar/dist/quasar.cjs.prod.js:6:13539)
      at Object.install (node_modules/quasar/dist/quasar.cjs.prod.js:6:468377)
      at Object.use (node_modules/@vue/runtime-core/dist/runtime-core.cjs.js:2962:28)
      at Object.<anonymous> (tests/unit/assets.spec.ts:6:10)

[IlCallo]

You're definitely doing something pretty messy in your project. @quasar/app and vue-cli-plugin-quasar should never be used together: either you're using a Quasar CLI project (and have the former) or use Vue CLI (and have the latter)

That said, you're using the wrong @vue/cli-plugin-unit-jest version. Vue3 and Qv2 need v5 (published on next tag) localVue doesn't exist anymore, check out new VTU and Vue Jest docs

[rimijn]

@IlCallo @quasar/app is not being used. We are using createApp and localVue is just the variable name. Also, when we create a fresh vue 3 project using vue cli and use vue add unit-jest, it installs this particular version(4.5.15) of vue-cli-plugin-unit-jest

[IlCallo]

Sorry, must have misread @quasar/extras for @quasar/app I'd say the problem is still the wrong Jest plugin, ask Vue CLI or the plugin maintainers about it, this doesn't seem to be related to Quasar in any way

Just out of curiosity, try adding an empty object as .use(Quasar, {}) and check out what happens