refactor(engine): removing isHydrating global flag used across packages

Update packages/@lwc/engine-dom/src/renderer.ts
salesforce · May 12, 2022 · 6b0bdda · 6b0bdda
1 parent e2bc36f
commit 6b0bdda
Show file tree

Hide file tree

Showing 7 changed files with 2 additions and 47 deletions.
diff --git a/packages/@lwc/engine-core/src/framework/main.ts b/packages/@lwc/engine-core/src/framework/main.ts
@@ -81,7 +81,6 @@ export {
     setHTMLElement,
     setInsert,
     setIsConnected,
-    setIsHydrating,
     setIsNativeShadowDefined,
     setIsSyntheticShadowDefined,
     setNextSibling,

diff --git a/packages/@lwc/engine-core/src/renderer.ts b/packages/@lwc/engine-core/src/renderer.ts
@@ -40,12 +40,6 @@ export function setHTMLElement(HTMLElementImpl: HTMLElementType) {
 // Functions
 //
 
-type isHydratingFunc = () => boolean;
-export let isHydrating: isHydratingFunc;
-export function setIsHydrating(isHydratingImpl: isHydratingFunc) {
-    isHydrating = isHydratingImpl;
-}
-
 type insertFunc = (node: N, parent: E, anchor: N | null) => void;
 export let insert: insertFunc;
 export function setInsert(insertImpl: insertFunc) {

diff --git a/packages/@lwc/engine-dom/src/apis/hydrate-component.ts b/packages/@lwc/engine-dom/src/apis/hydrate-component.ts
@@ -13,7 +13,6 @@ import {
     getAssociatedVMIfPresent,
 } from '@lwc/engine-core';
 import { isFunction, isNull, isObject } from '@lwc/shared';
-import { setIsHydrating } from '../renderer';
 
 function resetShadowRootAndLightDom(element: Element, Ctor: typeof LightningElement) {
     if (element.shadowRoot) {
@@ -76,16 +75,9 @@ export function hydrateComponent(
     }
 
     try {
-        // Let the renderer know we are hydrating, so it does not replace the existing shadowRoot
-        // and uses the same algo to create the stylesheets as in SSR.
-        setIsHydrating(true);
-
         const vm = createVMWithProps(element, Ctor, props);
 
         hydrateRoot(vm);
-
-        // set it back since now we finished hydration.
-        setIsHydrating(false);
     } catch (e) {
         // Fallback: In case there's an error while hydrating, let's log the error, and replace the element content
         //           with the client generated DOM.
@@ -98,11 +90,7 @@ export function hydrateComponent(
 
         // we need to recreate the vm with the hydration flag on, so it re-uses the existing shadowRoot.
         createVMWithProps(element, Ctor, props);
-        setIsHydrating(false);
 
         connectRootElement(element);
-    } finally {
-        // in case there's an error during recovery
-        setIsHydrating(false);
     }
 }
diff --git a/packages/@lwc/engine-dom/src/initializeRenderer.ts b/packages/@lwc/engine-dom/src/initializeRenderer.ts
@@ -29,7 +29,6 @@ import {
     setHTMLElement,
     setInsert,
     setIsConnected,
-    setIsHydrating,
     setIsNativeShadowDefined,
     setIsSyntheticShadowDefined,
     setNextSibling,
@@ -71,7 +70,6 @@ import {
     HTMLElement,
     insert,
     isConnected,
-    isHydrating,
     isNativeShadowDefined,
     isSyntheticShadowDefined,
     nextSibling,
@@ -112,7 +110,6 @@ setGetProperty(getProperty);
 setHTMLElement(HTMLElement);
 setInsert(insert);
 setIsConnected(isConnected);
-setIsHydrating(isHydrating);
 setIsNativeShadowDefined(isNativeShadowDefined);
 setIsSyntheticShadowDefined(isSyntheticShadowDefined);
 setNextSibling(nextSibling);

diff --git a/packages/@lwc/engine-dom/src/renderer.ts b/packages/@lwc/engine-dom/src/renderer.ts
@@ -82,18 +82,8 @@ if (isCustomElementRegistryAvailable()) {
     HTMLElementConstructor.prototype = HTMLElement.prototype;
 }
 
-let hydrating = false;
-
-export function setIsHydrating(value: boolean) {
-    hydrating = value;
-}
-
 export const ssr: boolean = false;
 
-export function isHydrating(): boolean {
-    return hydrating;
-}
-
 export const isNativeShadowDefined: boolean = globalThis[KEY__IS_NATIVE_SHADOW_ROOT_DEFINED];
 export const isSyntheticShadowDefined: boolean = hasOwnProperty.call(
     Element.prototype,
@@ -127,10 +117,8 @@ export function nextSibling(node: Node): Node | null {
 }
 
 export function attachShadow(element: Element, options: ShadowRootInit): ShadowRoot {
-    if (hydrating) {
-        return element.shadowRoot!;
-    }
-    return element.attachShadow(options);
+    const internals = (element as any).attachInternals?.();
+    return internals?.shadowRoot || element.shadowRoot || element.attachShadow(options);
 }
 
 export function setText(node: Node, content: string): void {

diff --git a/packages/@lwc/engine-server/src/initializeRenderer.ts b/packages/@lwc/engine-server/src/initializeRenderer.ts
@@ -29,7 +29,6 @@ import {
     setHTMLElement,
     setInsert,
     setIsConnected,
-    setIsHydrating,
     setIsNativeShadowDefined,
     setIsSyntheticShadowDefined,
     setNextSibling,
@@ -71,7 +70,6 @@ import {
     HTMLElement,
     insert,
     isConnected,
-    isHydrating,
     isNativeShadowDefined,
     isSyntheticShadowDefined,
     nextSibling,
@@ -112,7 +110,6 @@ setGetProperty(getProperty);
 setHTMLElement(HTMLElement);
 setInsert(insert);
 setIsConnected(isConnected);
-setIsHydrating(isHydrating);
 setIsNativeShadowDefined(isNativeShadowDefined);
 setIsSyntheticShadowDefined(isSyntheticShadowDefined);
 setNextSibling(nextSibling);

diff --git a/packages/@lwc/engine-server/src/renderer.ts b/packages/@lwc/engine-server/src/renderer.ts
@@ -61,14 +61,6 @@ class HTMLElementImpl {
 
 export const ssr: boolean = true;
 
-export function setIsHydrating(_value: boolean) {
-    /* No-op in SSR */
-}
-
-export function isHydrating(): boolean {
-    return false;
-}
-
 export const isNativeShadowDefined: boolean = false;
 export const isSyntheticShadowDefined: boolean = false;