13

I am trying to suppress my warnings in my tests following the config listed here: https://vue-test-utils.vuejs.org/api/config.html#silent, which is as follows:

import { config } from '@vue/test-utils';

// this should actually be the default but the default is not working
config.silent = true;

However, I am still seeing the warning in the test results:

  TheQueue
✓ should show the queue bar if there are items queued
✓ should show the correct count of queued items in queued bar
[Vue warn]: Avoid mutating a prop directly since the value will be 
overwritten whenever the parent component re-renders. Instead, use a 
data or computed property based on the prop's value. Prop being 
mutated: "mdTemplateData"

found in

---> <MdTab>
       <MdContent>
         <MdTabs>
           <MdDrawer>
             <TheQueue> at src/components/the-queue/TheQueue.vue
               <Root>

It's worth noting that I do not see this error in normal usage of the app. This only pops up in tests (otherwise I would attempt to fix the actual suggested issue).

What am I doing wrong here and why can I not suppress these warning? Or am I misunderstanding what silent is supposed to do?

boardlemur
  • 2,861
  • 1
  • 18
  • 24
  • I am trying to silent Vue warnings in unit tests too, but as far as I understood by reading [`vue-test-utils` source code](https://github.com/vuejs/vue-test-utils/blob/4c65dbd9a3e0496e92f01bc053bdb95a82546eac/packages/test-utils/src/wrapper.js#L456), this `silent` configuration attribute triggers only when you're using [`setProps`](https://vue-test-utils.vuejs.org/api/wrapper/#setprops-props])method in your tests. – P3trur0 Feb 04 '19 at 14:16
  • 1
    Any progress in this? I'm having the same issue – Lioo Mar 25 '19 at 14:58
  • I know you asked it 6 months ago but I just see your question now, Hope it helps you – Ali Bahrami Jun 08 '19 at 09:17

1 Answers1

9

According to the VueJS docs - https://vue-test-utils.vuejs.org/api/config.html#silent

silent

type: Boolean

default: true

It suppresses warnings triggered by Vue while mutating component's observables (e.g. props). When set to false, all warnings are visible in the console. This is a configurable way which relies on Vue.config.silent.

which relies on Vue.config.silent, so all you need is to import vue package and set it's config.silent to false

import Vue from `vue`
Vue.config.silent = true;

I put a working example here in my Github, it's just a fork of official example but it doesn't show warnings during the tests.

https://github.com/al1b/vue-test-utils-getting-started

For more information:

If you check the source code:

  warn = (msg, vm) => {
    const trace = vm ? generateComponentTrace(vm) : ''

    if (config.warnHandler) {
      config.warnHandler.call(null, msg, vm, trace)
    } else if (hasConsole && (!config.silent)) {
      console.error(`[Vue warn]: ${msg}${trace}`)
    }
  }
Ali Bahrami
  • 5,935
  • 3
  • 34
  • 53