Revert "fix(custom-elements): hydrate on client side (#5317)" (#6111)

* Revert "fix(custom-elements): hydrate on client side (#5317)"

This reverts commit d809658.

* remove import

Author: christian-bromann

src/compiler/output-targets/dist-custom-elements/custom-elements-build-conditionals.ts

@@ -1,7 +1,6 @@
-import { isOutputTargetHydrate } from '@utils';
-
 import type * as d from '../../../declarations';
 import { getBuildFeatures, updateBuildConditionals } from '../../app-core/app-data';
+
 /**
  * Get build conditions appropriate for the `dist-custom-elements` Output
  * Target, including disabling lazy loading and hydration.
@@ -18,10 +17,9 @@ export const getCustomElementsBuildConditionals = (
   // then the default in "import { BUILD, NAMESPACE } from '@stencil/core/internal/app-data'"
   // needs to have the static build conditionals set for the custom elements build
   const build = getBuildFeatures(cmps) as d.BuildConditionals;
-  const hasHydrateOutputTargets = config.outputTargets.some(isOutputTargetHydrate);
 
   build.lazyLoad = false;
-  build.hydrateClientSide = hasHydrateOutputTargets;
+  build.hydrateClientSide = false;
   build.hydrateServerSide = false;
   build.asyncQueue = config.taskQueue === 'congestionAsync';
   build.taskQueue = config.taskQueue !== 'immediate';

src/compiler/output-targets/test/build-conditionals.spec.ts

@@ -3,7 +3,6 @@ import { mockConfig, mockLoadConfigInit } from '@stencil/core/testing';
 import type * as d from '../../../declarations';
 import { validateConfig } from '../../config/validate-config';
 import { getCustomElementsBuildConditionals } from '../dist-custom-elements/custom-elements-build-conditionals';
-import { getHydrateBuildConditionals } from '../dist-hydrate-script/hydrate-build-conditionals';
 import { getLazyBuildConditionals } from '../dist-lazy/lazy-build-conditionals';
 
 describe('build-conditionals', () => {
@@ -16,16 +15,6 @@ describe('build-conditionals', () => {
   });
 
   describe('getCustomElementsBuildConditionals', () => {
-    it('default', () => {
-      const { config } = validateConfig(userConfig, mockLoadConfigInit());
-      const bc = getCustomElementsBuildConditionals(config, cmps);
-      expect(bc).toMatchObject({
-        lazyLoad: false,
-        hydrateClientSide: false,
-        hydrateServerSide: false,
-      });
-    });
-
     it('taskQueue async', () => {
       userConfig.taskQueue = 'async';
       const { config } = validateConfig(userConfig, mockLoadConfigInit());
@@ -60,37 +49,9 @@ describe('build-conditionals', () => {
       expect(bc.taskQueue).toBe(true);
       expect(config.taskQueue).toBe('async');
     });
-
-    it('hydrateClientSide true', () => {
-      const hydrateOutputTarget: d.OutputTargetHydrate = {
-        type: 'dist-hydrate-script',
-      };
-      userConfig.outputTargets = [hydrateOutputTarget];
-      const { config } = validateConfig(userConfig, mockLoadConfigInit());
-      const bc = getCustomElementsBuildConditionals(config, cmps);
-      expect(bc.hydrateClientSide).toBe(true);
-    });
-
-    it('hydratedSelectorName', () => {
-      userConfig.hydratedFlag = {
-        name: 'boooop',
-      };
-      const { config } = validateConfig(userConfig, mockLoadConfigInit());
-      const bc = getCustomElementsBuildConditionals(config, cmps);
-      expect(bc.hydratedSelectorName).toBe('boooop');
-    });
   });
 
   describe('getLazyBuildConditionals', () => {
-    it('default', () => {
-      const { config } = validateConfig(userConfig, mockLoadConfigInit());
-      const bc = getLazyBuildConditionals(config, cmps);
-      expect(bc).toMatchObject({
-        lazyLoad: true,
-        hydrateServerSide: false,
-      });
-    });
-
     it('taskQueue async', () => {
       userConfig.taskQueue = 'async';
       const { config } = validateConfig(userConfig, mockLoadConfigInit());
@@ -138,61 +99,5 @@ describe('build-conditionals', () => {
       const bc = getLazyBuildConditionals(config, cmps);
       expect(bc.transformTagName).toBe(true);
     });
-
-    it('hydrateClientSide default', () => {
-      const { config } = validateConfig(userConfig, mockLoadConfigInit());
-      const bc = getLazyBuildConditionals(config, cmps);
-      expect(bc.hydrateClientSide).toBe(false);
-    });
-
-    it('hydrateClientSide true', () => {
-      const hydrateOutputTarget: d.OutputTargetHydrate = {
-        type: 'dist-hydrate-script',
-      };
-      userConfig.outputTargets = [hydrateOutputTarget];
-      const { config } = validateConfig(userConfig, mockLoadConfigInit());
-      const bc = getLazyBuildConditionals(config, cmps);
-      expect(bc.hydrateClientSide).toBe(true);
-    });
-
-    it('hydratedSelectorName', () => {
-      userConfig.hydratedFlag = {
-        name: 'boooop',
-      };
-      const { config } = validateConfig(userConfig, mockLoadConfigInit());
-      const bc = getLazyBuildConditionals(config, cmps);
-      expect(bc.hydratedSelectorName).toBe('boooop');
-    });
-  });
-
-  describe('getHydrateBuildConditionals', () => {
-    it('hydratedSelectorName', () => {
-      userConfig.hydratedFlag = {
-        name: 'boooop',
-      };
-      const { config } = validateConfig(userConfig, mockLoadConfigInit());
-      const bc = getHydrateBuildConditionals(config, cmps);
-      expect(bc.hydratedSelectorName).toBe('boooop');
-    });
-
-    it('should allow setting to use a class for hydration', () => {
-      userConfig.hydratedFlag = {
-        selector: 'class',
-      };
-      const { config } = validateConfig(userConfig, mockLoadConfigInit());
-      const bc = getHydrateBuildConditionals(config, cmps);
-      expect(bc.hydratedClass).toBe(true);
-      expect(bc.hydratedAttribute).toBe(false);
-    });
-
-    it('should allow setting to use an attr for hydration', () => {
-      userConfig.hydratedFlag = {
-        selector: 'attribute',
-      };
-      const { config } = validateConfig(userConfig, mockLoadConfigInit());
-      const bc = getHydrateBuildConditionals(config, cmps);
-      expect(bc.hydratedClass).toBe(false);
-      expect(bc.hydratedAttribute).toBe(true);
-    });
   });
 });

src/runtime/initialize-component.ts

@@ -32,8 +32,7 @@ export const initializeComponent = async (
     // Let the runtime know that the component has been initialized
     hostRef.$flags$ |= HOST_FLAGS.hasInitializedComponent;
 
-    const bundleId = cmpMeta.$lazyBundleId$;
-    if ((BUILD.lazyLoad || BUILD.hydrateClientSide) && bundleId) {
+    if (BUILD.lazyLoad || BUILD.hydrateClientSide) {
       // lazy loaded components
       // request the component's implementation to be
       // wired up with the host element