Vue-test-utils: Using setProps and wrapper.props return error not a function.

Created on 14 Oct 2017 · 5Comments · Source: vuejs/vue-test-utils

I was following the example on: https://vue-test-utils.vuejs.org/en/api/wrapper/setProps.html

And my code returns: TypeError: wrapper.props is not a function;

import { mount } from 'vue-test-utils';
import { expect } from 'expect';
import Foo from './Foo.vue';

const wrapper = mount(Foo);
wrapper.setProps({ foo: 'bar' });
expect(wrapper.props().foo).toBe('bar');

For Debugging:

{
  "scripts": {
    "test": "mocha-webpack --webpack-config ./node_modules/laravel-mix/setup/webpack.config.js --require spec/setup.js spec/**/*.spec.js"
  },
  "devDependencies": {
    "babel-plugin-transform-object-rest-spread": "^6.26.0",
    "cross-env": "^5.0.1",
    "expect": "^21.2.1",
    "jsdom": "^11.3.0",
    "jsdom-global": "^3.0.2",
    "laravel-mix": "^1.0",
    "mocha": "^4.0.1",
    "mocha-webpack": "^0.7.0",
    "vue-test-utils": "^1.0.0-beta.2"
  },
  "dependencies": {
    "vue": "^2.5.2",
    "vue-router": "^3.0.1",
    "vuelidate": "^0.6.1",
    "vuex": "^3.0.0",
    "vuex-router-sync": "^5.0.0"
  }
}

Source

alexhernandez

All 5 comments

Just noticed if you change wrapper.props() to wrapper.vm._props it works.

const wrapper = mount(Foo);
wrapper.setProps({ foo: 'bar' });
expect(wrapper.vm._props.foo).toBe('bar');

alexhernandez on 14 Oct 2017

😕1

Is your prop is required, you may get an error, because the prop is not present on the initial mount.

You can also pass the props when you call mount like so:

// Your component
<script>
export default {
    props: {
      user: { 
        type: Object, 
        required: true
    }
}
</script>

// Test your component with required prop
const mockUser = {
  displayname: 'Test user'
}

const wrapper = mount(UserConversationDisplay, {   
  propsData: {
    user: mockUser
  }
})

Some of the documentation is ported from another similar lib called Avoriaz made by the same author, but a little different API. If you could make a PR with the corrected example that'd be great, I'm sure other people will encounter this problem.