$attrs and inheritAttrs

[lancetharper]

With Vue 2.4 inheritAttrs has been added and I'm trying to figure out how to get tests to make sure that it works correctly. Here is a simple example of what I'm trying to do:

Component template:

<template>
  <div>
    <label :for="inputId" ref="label">{{label}}</label>
    <input type="text" 
        v-bind="$attrs"
        :id="inputId"
        :value="lazyValue"
        ref="input">
  </div>
</template>

Great, now attributes not listed as props go to the input as expected when I use it.

Is there any way to actually add other attributes in the mount function to test it? That way if v-bind="$attrs" somehow gets messed up the tests will fail so we know about it.

const wrapper = mount(inputComp, {
  propsData: {
    label: 'Label Test',
    id: 'input1',
    name: 'inputName', // doesn't work here
  },
  attrs{} // something like this?
});

// Can I set it like this somehow?
wrapper.vm.$attrs.name = 'inputName';

Any help would be appreciated

[eddyerburgh]

I've added this in 2.5.0

You can make attr available on the vm using the attrs option.

const wrapper = mount(inputComp, {
  attrs: {
    anAttribute: 'some value'
  }
})

Can you post a component and a test so I can see how you're using it?

[lancetharper]

Seems to be mostly working. It would be nice if it worked like the domProps and attrs in the render function data object. But I don't know how hard/possible that is for you.

Here is the component I'm working on:
https://github.com/rei/rei-cedar/blob/feature/vue-update/src/components/input/cdrInput.vue

Here are the tests for it so far: (some aren't working still)
https://github.com/rei/rei-cedar/blob/feature/vue-update/src/components/input/__tests__/cdrInput.spec.js

[eddyerburgh]

Ah, yes that's a good point. Right now I'm just adding it on to the vm directly before mounting.

I'll add it for you at some point over the next few days 😄