Vue-apollo: TypeError: Cannot read property '$apolloProvider' of undefined

Created on 27 Feb 2019  路  4Comments  路  Source: vuejs/vue-apollo

I'm getting a TypeError when running my mocha test suite. It looks like a simple fix in vue-apollo.esm.js:

TypeError: Cannot read property '$apolloProvider' of undefined
      at VueComponent.initProvider (dist/webpack:/node_modules/vue-apollo/dist/vue-apollo.esm.js:1789:1)
      at VueComponent.beforeCreate (dist/webpack:/node_modules/vue-apollo/dist/vue-apollo.esm.js:1919:1)
      at invokeWithErrorHandling (dist/webpack:/node_modules/vue/dist/vue.runtime.esm.js:1854:1)
      at callHook (dist/webpack:/node_modules/vue/dist/vue.runtime.esm.js:4190:1)
      at VueComponent.Vue._init (dist/webpack:/node_modules/vue/dist/vue.runtime.esm.js:4965:1)
      at new VueComponent (dist/webpack:/node_modules/vue/dist/vue.runtime.esm.js:5115:1)
      at createInstance (dist/webpack:/node_modules/@vue/test-utils/dist/vue-test-utils.js:4475:1)
      at mount (dist/webpack:/node_modules/@vue/test-utils/dist/vue-test-utils.js:8646:1)
      at shallowMount (dist/webpack:/node_modules/@vue/test-utils/dist/vue-test-utils.js:8677:1)
      at Context.it (dist/webpack:/tests/unit/components/PreviewPlayerStepper.spec.ts:48:1)

The relevant function that is causing the issue...

function initProvider() {
  var options = this.$options; // ApolloProvider injection

  var optionValue = options.apolloProvider;

  if (optionValue) {
    this.$apolloProvider = typeof optionValue === 'function' ? optionValue() : optionValue;
  } else if (options.parent && options.parent.$apolloProvider) {
    this.$apolloProvider = options.parent.$apolloProvider;
  } else if (options.provide) {
    // TODO remove
    // Temporary retro-compatibility
    var provided = typeof options.provide === 'function' ? options.provide.call(this) : options.provide;

    if (provided.$apolloProvider) { // <=== Error occurs here
      this.$apolloProvider = provided.$apolloProvider;
    }
  }
}

For whatever reason, provided can be undefined in some cases. Probably need test to ensure provided is actually set to something before asking if provided.$apolloProvider is truthy.

Most helpful comment

@Akryum when do you think you will be releasing a version that has this fix?

All 4 comments

Made a PR to fix this issue: https://github.com/Akryum/vue-apollo/pull/533

@agosto-chrisbartling thanks for fixing this!

I am actually running into the problem here on GitLab in our test suite. If I modify the node_module to check if provided exists, the error doesn't happen. We are newly using vue-apollo, but this isn't the first commit to use it and it wasn't happening before and its not causing any problems before. Is there something we could mock out while we wait for this to be published?

@Akryum when do you think you will be releasing a version that has this fix?

I ran into a similar problem but it was in vue-apollo.umd.js. I'll also submit a PR.

Was this page helpful?
0 / 5 - 0 ratings