fix(runtime): stop applying patches to non-shadow / non-render() components (#6349)

* fix(runtime): do not apply other patches to non-slot components

* chore: use hasRenderFn

* chore: revert test revert :D

* chore: tidy

---------

Co-authored-by: John Jenkins <[email protected]>
Co-authored-by: Christian Bromann <[email protected]>

Author: 3 people

src/runtime/bootstrap-custom-element.ts

@@ -43,9 +43,8 @@ export const proxyCustomElement = (Cstr: any, compactMeta: d.ComponentRuntimeMet
     cmpMeta.$flags$ |= CMP_FLAGS.needsShadowDomShim;
   }
 
-  // TODO(STENCIL-914): this check and `else` block can go away and be replaced by just the `scoped` check
-  if (!(cmpMeta.$flags$ & CMP_FLAGS.shadowDomEncapsulation)) {
-    if (BUILD.experimentalSlotFixes && cmpMeta.$flags$ & CMP_FLAGS.hasSlotRelocation) {
+  if (!(cmpMeta.$flags$ & CMP_FLAGS.shadowDomEncapsulation) && cmpMeta.$flags$ & CMP_FLAGS.hasRenderFn) {
+    if (BUILD.experimentalSlotFixes) {
       patchPseudoShadowDom(Cstr.prototype);
     } else {
       if (BUILD.slotChildNodesFix) {

src/runtime/bootstrap-lazy.ts

@@ -195,9 +195,8 @@ export const bootstrapLazy = (lazyBundles: d.LazyBundlesRuntimeData, options: d.
         }
       };
 
-      if (!(cmpMeta.$flags$ & CMP_FLAGS.shadowDomEncapsulation)) {
-        // TODO(STENCIL-914): this check and `else` block can go away and be replaced by just the `scoped` check
-        if (BUILD.experimentalSlotFixes && cmpMeta.$flags$ & CMP_FLAGS.hasSlotRelocation) {
+      if (!(cmpMeta.$flags$ & CMP_FLAGS.shadowDomEncapsulation) && cmpMeta.$flags$ & CMP_FLAGS.hasRenderFn) {
+        if (BUILD.experimentalSlotFixes) {
           patchPseudoShadowDom(HostElement.prototype);
         } else {
           if (BUILD.slotChildNodesFix) {

src/utils/constants.ts

@@ -119,6 +119,11 @@ export const enum CMP_FLAGS {
    * to have its styles scoped during SSR as opposed to using DSD.
    */
   shadowNeedsScopedCss = 1 << 7,
+
+  /**
+   * Determines if a component has a render function.
+   */
+  hasRenderFn = 1 << 8,
 }
 
 /**

src/utils/format-component-runtime-meta.ts

@@ -35,6 +35,9 @@ export const formatComponentRuntimeMeta = (
   if (compilerMeta.encapsulation !== 'shadow' && compilerMeta.htmlTagNames.includes('slot')) {
     flags |= CMP_FLAGS.hasSlotRelocation;
   }
+  if (compilerMeta.hasRenderFn) {
+    flags |= CMP_FLAGS.hasRenderFn;
+  }
   if (compilerMeta.hasMode) {
     flags |= CMP_FLAGS.hasMode;
   }

test/end-to-end/src/dom-api/dom-api.e2e.ts

@@ -240,10 +240,15 @@ describe('dom api e2e tests', () => {
 
     await page.waitForChanges();
 
-    expect(elm).toEqualText(`updated text content`);
+    expect(elm).toEqualText(`
+      dom apiupdated text content
+    `);
 
     expect(elm).toEqualHtml(`
       <dom-api custom-hydrate-flag="">
+        <span class="blue green red" data-a="a" data-z="z">
+          dom api
+        </span>
         updated text content
       </dom-api>
     `);