Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Cannot convert undefined or null to object #853

Closed
caugner opened this issue Jul 25, 2018 · 4 comments
Closed

Cannot convert undefined or null to object #853

caugner opened this issue Jul 25, 2018 · 4 comments
Labels

Comments

@caugner
Copy link

caugner commented Jul 25, 2018

Version

1.0.0-beta.21

Reproduction link

https://gitlab/mygroup/myproject

Steps to reproduce

import { shallowMount } from "@vue/test-utils";
import { expect } from "chai";
import App from "@/App";
import router from "@/router";
import i18n from "@/i18n";

describe("App.vue", function() {
  let wrapper;

  beforeEach(() => {
    wrapper = shallowMount(App, {
      router,
      i18n
    });
  });

  //...

});

What is expected?

The tests should pass (like they did in 1.0.0-beta.20).

What is actually happening?

     TypeError: Cannot convert undefined or null to object
      at /builds/mygroup/myproject/dist/webpack:/node_modules/@vue/test-utils/dist/vue-test-utils.js:2447:1
      at Array.forEach (<anonymous>)
      at stubComponents (dist/webpack:/node_modules/@vue/test-utils/dist/vue-test-utils.js:2441:1)
      at createComponentStubsForAll (dist/webpack:/node_modules/@vue/test-utils/dist/vue-test-utils.js:2459:1)
      at shallowMount (dist/webpack:/node_modules/@vue/test-utils/dist/vue-test-utils.js:5522:1)
      at Context.<anonymous> (dist/webpack:/tests/unit/specs/App.spec.js:11:1)
@caugner
Copy link
Author

caugner commented Jul 25, 2018

Happens at this line.

@caugner
Copy link
Author

caugner commented Jul 25, 2018

I suppose my usage of closures to lazy-load components in my App.vue is the culprit:

<script>
export default {
  components: {
    bContainer: () => import("bootstrap-vue/es/components/layout/container"),
    bCollapse: () => import("bootstrap-vue/es/components/collapse/collapse"),
    bNavItem: () => import("bootstrap-vue/es/components/nav/nav-item"),
    bNavbar: () => import("bootstrap-vue/es/components/navbar/navbar"),
    bNavbarBrand: () =>
      import("bootstrap-vue/es/components/navbar/navbar-brand"),
    bNavbarNav: () => import("bootstrap-vue/es/components/navbar/navbar-nav"),
    bNavbarToggle: () =>
      import("bootstrap-vue/es/components/navbar/navbar-toggle"),
    bButtonGroup: () =>
      import("bootstrap-vue/es/components/button-group/button-group"),
    bButton: () => import("bootstrap-vue/es/components/button/button")
  }
  // ...
}

In this snippet from vue-test-utils.js (lines 2441 ff.), the cmp of type function does not have a property extendOptions and therefore the property _Ctor cannot be deleted:

  Object.keys(components).forEach(function (component) {
    var cmp = components[component];
    var componentOptions = typeof cmp === 'function'
      ? cmp.extendOptions
      : cmp;
    // Remove cached constructor
    delete componentOptions._Ctor;
    if (!componentOptions.name) {
      componentOptions.name = component;
    }
    stubbedComponents[component] = createBlankStub(componentOptions, component);
});

@eddyerburgh
Copy link
Member

Thanks for the detailed bug report. I've added support for dynamic components which will be released in beta.22 this evening.

@caugner
Copy link
Author

caugner commented Jul 30, 2018

Thanks a lot, @eddyerburgh!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

2 participants