title: Vue 3.0.11 error "Failed to resolve component" occurs randomly on recursive components
body: <p>First of all, I've checked all the similar questions on this site and found nothing relevant. In most of the cases, this error happens when you use</p>
  <pre><code>components:[comp1,comp2]
  </code></pre>
  <p>which is incorrect, as the components property should be an object. That's not my case. What's more intriging is that this issue occurs randomly. Sometimes reloading the page makes the error go away. I've seen it working multiple times and then the error starts showing up again without me changing the code.</p>
  <p>I'm building a tree/hierarchy structure, where each node can have multiple children. Each node needs to have its own state, because I want to be able to open one node and keeping the other ones closed, while at the same time having the ability to close all nodes from the grandparent component. The structure is as follows</p>
  <p><strong>MetadataTree - hierarchy container</strong></p>
  <pre><code>&lt;template&gt;
      &lt;ul&gt;
          &lt;li v-for=&quot;(value,key) in metadata&quot;&gt;
              &lt;TreeItem :type=&quot;key&quot; :members=&quot;value&quot; :parent-open=&quot;parentOpen&quot; :key=&quot;key&quot;/&gt;
          &lt;/li&gt;
      &lt;/ul&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
  
  import TreeItem from '@/components/TreeItem.vue'
  import TheButton from '@/components/TheButton.vue'
  
  export default {
  
      components:{TreeItem,TheButton},
  
      props:['metadata','parentOpen'],
  
  }
  &lt;/script&gt;
  </code></pre>
  <p>For each item, I use a TreeItem component</p>
  <p><strong>TreeItem - each node</strong></p>
  <pre><code>&lt;template&gt;
    &lt;div&gt;
      &lt;span class=&quot;icon-text&quot;&gt;
          &lt;span v-if=&quot;isOpen&quot; class=&quot;icon&quot;&gt;
              &lt;i class=&quot;fas fa-folder-open&quot;&gt;&lt;/i&gt;
          &lt;/span&gt;
          &lt;span v-if=&quot;!isOpen&quot; class=&quot;icon&quot;&gt;
              &lt;i class=&quot;fas fa-folder&quot;&gt;&lt;/i&gt;
          &lt;/span&gt;
          &lt;span class=&quot;type&quot; @click=&quot;toggle&quot;&gt;{{type}}&lt;/span&gt;
      &lt;/span&gt;
    &lt;/div&gt;
    &lt;li v-if=&quot;isOpen&quot; v-for=&quot;member in members&quot; :key=&quot;member.id&quot;&gt;
          &lt;span class=&quot;icon-text&quot;&gt;
              &lt;span class=&quot;icon&quot;&gt;
                  &lt;i class=&quot;fas fa-code&quot;&gt;&lt;/i&gt;
              &lt;/span&gt;
              &lt;span&gt;&lt;a :href=&quot;member.url&quot; target=&quot;_blank&quot;&gt;{{member.name}}&lt;/a&gt;&lt;/span&gt;
              &lt;Pill v-for=&quot;pill in member.pills&quot; :pill=&quot;pill&quot;/&gt;
          &lt;/span&gt;
          &lt;p v-if=&quot;member.references&quot;&gt;There are children 
              &lt;MetadataTree :key=&quot;member.name&quot; :metadata=&quot;member.references&quot;/&gt;
          &lt;/p&gt;
          
    &lt;/li&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
  
  import MetadataTree from './MetadataTree.vue';
  import Pill from '@/components/Pill.vue'
  
  export default {
  
      components:{Pill,MetadataTree},
  
      props:['type','members','parentOpen'],
  
      data(){
          return{
              isOpen:false
          }
      }
  </code></pre>
  <p>So what you'll see is the the TreeItem component, also references its parent component, MetadataTree, as long as the member variable has a references variable.</p>
  <p>So when I load the page, only the first 2 levels are displayed, and for any other levels, the error is thrown in the console</p>
  <pre><code>[Vue warn]: Failed to resolve component: MetadataTree 
    at &lt;TreeItem type=&quot;CustomObject&quot; members= (3) [{…}, {…}, {…}] parent-open=false  ... &gt; 
  </code></pre>
  <p>This makes me think there's something preventing the parent component being loaded inside the child component. Note that there is a base case where member.references returns false and the tree stops right there.</p>
  <p>Is it supported to have the child component reference its parent as long as there's a base case that prevents infinite recursion? What else can I do to troubleshoot this issue?</p>