Prop name is an array, throw an error "TypeError: str.replace is not a function"

[blusoul]

Version

6.0.0-beta.12

Browser and OS info

windows 10 21H1 Chrome 90 / mac Chrome 90.0.4430.212

Steps to reproduce

1. I create a component "App", it's prop name is an array
2. I use vue-devtools find components "App",
3. throw an error "TypeError: str.replace is not a function", and components tree not work

<template>
  <div id="app">
    <p>when name is an array {{JSON.stringify(name)}}</p>
    <p>I find Commponents 'App'</P>
    <p>throw an error <span class="warn">"TypeError: str.replace is not a function"</span></P>
  </div>
</template>

<script>
export default {
  name: 'App',
  props: {
    // when name is an array, throw an error "TypeError: str.replace is not a function"
    name: {
      type: Array,
      default: () => ['start', 'end']
    }
  },
}
</script>

1. Demo

What is expected?

no error

What is actually happening?

throw an error "TypeError: str.replace is not a function", and components tree not work

// packages\app-backend-vue2\src\components\tree.ts
// packages\app-backend-vue3\src\components\filter.ts
function isQualified (instance): boolean {
 // instance.name is prop name
 const name = classify(instance.name || getInstanceName(instance)).toLowerCase()
 return name.indexOf(filter) > -1
}

[Akryum]

I don't reproduce with latest next branch and your demo link.

[blusoul]

I upgrade to 6.00 beta 14 the error is existed.

mac / chrome 91.0.4472.77 / Vue.js devtools 6.0.0 beta 14 | Vue.js devtools 5.3.4
step 1: link to codesandbox
step 2: keypress F12 vue devtools
step 3: findComponent App