fix(component): prioritize registered component over implicit self-reference via filename

ref: #2827

packages/compiler-core/__tests__/__snapshots__/codegen.spec.ts.snap

@@ -66,6 +66,7 @@ return function render(_ctx, _cache) {
     const _component_Foo = _resolveComponent(\\"Foo\\")
     const _component_bar_baz = _resolveComponent(\\"bar-baz\\")
     const _component_barbaz = _resolveComponent(\\"barbaz\\")
+    const _component_Qux = _resolveComponent(\\"Qux\\", true)
     const _directive_my_dir_0 = _resolveDirective(\\"my_dir_0\\")
     const _directive_my_dir_1 = _resolveDirective(\\"my_dir_1\\")
     let _temp0, _temp1, _temp2

packages/compiler-core/__tests__/codegen.spec.ts

@@ -126,7 +126,7 @@ describe('compiler: codegen', () => {
 
   test('assets + temps', () => {
     const root = createRoot({
-      components: [`Foo`, `bar-baz`, `barbaz`],
+      components: [`Foo`, `bar-baz`, `barbaz`, `Qux__self`],
       directives: [`my_dir_0`, `my_dir_1`],
       temps: 3
     })
@@ -144,6 +144,12 @@ describe('compiler: codegen', () => {
         helperNameMap[RESOLVE_COMPONENT]
       }("barbaz")\n`
     )
+    // implicit self reference from SFC filename
+    expect(code).toMatch(
+      `const _component_Qux = _${
+        helperNameMap[RESOLVE_COMPONENT]
+      }("Qux", true)\n`
+    )
     expect(code).toMatch(
       `const _directive_my_dir_0 = _${
         helperNameMap[RESOLVE_DIRECTIVE]

packages/compiler-core/__tests__/transforms/transformElement.spec.ts

@@ -75,7 +75,7 @@ describe('compiler: element transform', () => {
       filename: `/foo/bar/Example.vue?vue&type=template`
     })
     expect(root.helpers).toContain(RESOLVE_COMPONENT)
-    expect(root.components).toContain(`_self`)
+    expect(root.components).toContain(`Example__self`)
   })
 
   test('static props', () => {

packages/compiler-core/src/codegen.ts

@@ -434,9 +434,16 @@ function genAssets(
     type === 'component' ? RESOLVE_COMPONENT : RESOLVE_DIRECTIVE
   )
   for (let i = 0; i < assets.length; i++) {
-    const id = assets[i]
+    let id = assets[i]
+    // potential component implicit self-reference inferred from SFC filename
+    const maybeSelfReference = id.endsWith('__self')
+    if (maybeSelfReference) {
+      id = id.slice(0, -6)
+    }
     push(
-      `const ${toValidAssetId(id, type)} = ${resolver}(${JSON.stringify(id)})`
+      `const ${toValidAssetId(id, type)} = ${resolver}(${JSON.stringify(id)}${
+        maybeSelfReference ? `, true` : ``
+      })`
     )
     if (i < assets.length - 1) {
       newline()

packages/compiler-core/src/transforms/transformElement.ts

@@ -264,12 +264,17 @@ export function resolveComponentType(
   }
 
   // 4. Self referencing component (inferred from filename)
-  if (!__BROWSER__ && context.selfName) {
-    if (capitalize(camelize(tag)) === context.selfName) {
-      context.helper(RESOLVE_COMPONENT)
-      context.components.add(`_self`)
-      return toValidAssetId(`_self`, `component`)
-    }
+  if (
+    !__BROWSER__ &&
+    context.selfName &&
+    capitalize(camelize(tag)) === context.selfName
+  ) {
+    context.helper(RESOLVE_COMPONENT)
+    // codegen.ts has special check for __self postfix when generating
+    // component imports, which will pass additional `maybeSelfReference` flag
+    // to `resolveComponent`.
+    context.components.add(tag + `__self`)
+    return toValidAssetId(tag, `component`)
   }
 
   // 5. user component (resolve)