chore(compiler/runtime): remove shadow dom shim (#4440)

* chore(ci): enable ci for v4 dev (#4433) this commit enables browserstack for the v4 development branch * chore(compiler): remove dynamicImportShim (#4420) * remove dynamicImportShim * remove `dynamicImportShim` references from some tests * add field removal to breaking changes * chore(compiler): remove safari10 extras flag (#4421) * remove safari10 extras flag * remove `safari10` references in some tests * add field removal to breaking changes * chore(compiler/runtime): remove CSS var shim & patchEsm() (#4419) * remove CSS var shim & patchEsm * remove `cssVarShim` references from some tests * remove some errant code * add field removal to breaking changes * fix build error * 🎬 v4.0.0-beta.0 * remove public-facing shadowDomShim option * missed one * update todo comments --------- Co-authored-by: Ryan Waskiewicz <[email protected]>
ionic-team · Jun 1, 2023 · 8ecdec9 · 8ecdec9
1 parent ad67a2d
commit 8ecdec9
Show file tree

Hide file tree

Showing 22 changed files with 23 additions and 37 deletions.
diff --git a/BREAKING_CHANGES.md b/BREAKING_CHANGES.md
@@ -36,6 +36,14 @@ for use at runtime. For Stencil v4.0.0 this field and corresponding behavior has
 If `extras.__deprecated__safari10` is set to `true` the Stencil runtime will patch ES module
 support for Safari 10. In Stencil v4.0.0 this field and corresponding behavior has been removed.
 
+##### `__deprecated__shadowDomShim`
+
+If `extras.__deprecated__shadowDomShim` is set to `true` the Stencil runtime will check
+whether a shim for [shadow
+DOM](https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_shadow_DOM)
+is needed in the current browser, and include one if so. For Stencil v4.0.0
+this field and its corresponding behavior has been removed.
+
 ## Stencil v3.0.0
 
 * [General](#general)

diff --git a/src/app-data/index.ts b/src/app-data/index.ts
@@ -65,7 +65,7 @@ export const BUILD: BuildConditionals = {
   hydratedClass: true,
   scriptDataOpts: false,
   scopedSlotTextContentFix: false,
-  // TODO(STENCIL-662): Remove code related to deprecated shadowDomShim field
+  // TODO(STENCIL-854): Remove code related to legacy shadowDomShim field
   shadowDomShim: false,
   slotChildNodesFix: false,
   invisiblePrehydration: true,

diff --git a/src/client/client-window.ts b/src/client/client-window.ts
@@ -29,7 +29,7 @@ export const setPlatformHelpers = (helpers: {
 };
 
 export const supportsShadow =
-  // TODO(STENCIL-662): Remove code related to deprecated shadowDomShim field
+  // TODO(STENCIL-854): Remove code related to legacy shadowDomShim field
   BUILD.shadowDomShim && BUILD.shadowDom
     ? /*@__PURE__*/ (() => (doc.head.attachShadow + '').indexOf('[native') > -1)()
     : true;

diff --git a/src/compiler/app-core/app-data.ts b/src/compiler/app-core/app-data.ts
@@ -152,11 +152,9 @@ export const updateBuildConditionals = (config: Config, b: BuildConditionals) =>
   b.lifecycleDOMEvents = !!(b.isDebug || config._isTesting || config.extras.lifecycleDOMEvents);
   b.scopedSlotTextContentFix = !!config.extras.scopedSlotTextContentFix;
   b.scriptDataOpts = config.extras.scriptDataOpts;
-  // TODO(STENCIL-662): Remove code related to deprecated shadowDomShim field
-  b.shadowDomShim = config.extras.__deprecated__shadowDomShim;
   b.attachStyles = true;
   b.invisiblePrehydration = typeof config.invisiblePrehydration === 'undefined' ? true : config.invisiblePrehydration;
-  // TODO(STENCIL-662): Remove code related to deprecated shadowDomShim field
+  // TODO(STENCIL-854): Remove code related to legacy shadowDomShim field
   if (b.shadowDomShim) {
     b.slotRelocation = b.slot;
   }

diff --git a/src/compiler/config/test/validate-config.spec.ts b/src/compiler/config/test/validate-config.spec.ts
@@ -389,8 +389,6 @@ describe('validation', () => {
     expect(config.extras.cloneNodeFix).toBe(false);
     expect(config.extras.lifecycleDOMEvents).toBe(false);
     expect(config.extras.scriptDataOpts).toBe(false);
-    // TODO(STENCIL-662): Remove code related to deprecated shadowDomShim field
-    expect(config.extras.__deprecated__shadowDomShim).toBe(false);
     expect(config.extras.slotChildNodesFix).toBe(false);
     expect(config.extras.initializeNextTick).toBe(false);
     expect(config.extras.tagNameTransform).toBe(false);

diff --git a/src/compiler/config/validate-config.ts b/src/compiler/config/validate-config.ts
@@ -106,8 +106,6 @@ export const validateConfig = (
   validatedConfig.extras.cloneNodeFix = !!validatedConfig.extras.cloneNodeFix;
   validatedConfig.extras.lifecycleDOMEvents = !!validatedConfig.extras.lifecycleDOMEvents;
   validatedConfig.extras.scriptDataOpts = !!validatedConfig.extras.scriptDataOpts;
-  // TODO(STENCIL-662): Remove code related to deprecated shadowDomShim field
-  validatedConfig.extras.__deprecated__shadowDomShim = !!validatedConfig.extras.__deprecated__shadowDomShim;
   validatedConfig.extras.slotChildNodesFix = !!validatedConfig.extras.slotChildNodesFix;
   validatedConfig.extras.initializeNextTick = !!validatedConfig.extras.initializeNextTick;
   validatedConfig.extras.tagNameTransform = !!validatedConfig.extras.tagNameTransform;

diff --git a/src/compiler/output-targets/dist-hydrate-script/generate-hydrate-app.ts b/src/compiler/output-targets/dist-hydrate-script/generate-hydrate-app.ts
@@ -137,7 +137,7 @@ const getHydrateBuildConditionals = (config: d.ValidatedConfig, cmps: d.Componen
   build.cloneNodeFix = false;
   build.appendChildSlotFix = false;
   build.slotChildNodesFix = false;
-  // TODO(STENCIL-662): Remove code related to deprecated shadowDomShim field
+  // TODO(STENCIL-854): Remove code related to legacy shadowDomShim field
   build.shadowDomShim = false;
 
   return build;

diff --git a/src/compiler/output-targets/dist-hydrate-script/hydrate-build-conditionals.ts b/src/compiler/output-targets/dist-hydrate-script/hydrate-build-conditionals.ts
@@ -23,7 +23,7 @@ export const getHydrateBuildConditionals = (cmps: d.ComponentCompilerMeta[]) =>
   build.slotChildNodesFix = false;
   build.cloneNodeFix = false;
   build.cssAnnotations = true;
-  // TODO(STENCIL-662): Remove code related to deprecated shadowDomShim field
+  // TODO(STENCIL-854): Remove code related to legacy shadowDomShim field
   build.shadowDomShim = true;
   build.hydratedAttribute = false;
   build.hydratedClass = true;

diff --git a/src/compiler/transformers/component-hydrate/hydrate-runtime-cmp-meta.ts b/src/compiler/transformers/component-hydrate/hydrate-runtime-cmp-meta.ts
@@ -17,7 +17,7 @@ export const addHydrateRuntimeCmpMeta = (classMembers: ts.ClassElement[], cmp: d
   };
   // We always need shadow-dom shim in hydrate runtime
   if (cmpMeta.$flags$ & CMP_FLAGS.shadowDomEncapsulation) {
-    // TODO(STENCIL-662): Remove code related to deprecated shadowDomShim field
+    // TODO(STENCIL-854): Remove code related to legacy shadowDomShim field
     cmpMeta.$flags$ |= CMP_FLAGS.needsShadowDomShim;
   }
   const staticMember = createStaticGetter('cmpMeta', convertValueToLiteral(cmpMeta));

diff --git a/src/declarations/stencil-private.ts b/src/declarations/stencil-private.ts
@@ -179,7 +179,7 @@ export interface BuildConditionals extends Partial<BuildFeatures> {
   hydratedClass?: boolean;
   initializeNextTick?: boolean;
   scriptDataOpts?: boolean;
-  // TODO(STENCIL-662): Remove code related to deprecated shadowDomShim field
+  // TODO(STENCIL-854): Remove code related to legacy shadowDomShim field
   shadowDomShim?: boolean;
   asyncQueue?: boolean;
   transformTagName?: boolean;

diff --git a/src/declarations/stencil-public-compiler.ts b/src/declarations/stencil-public-compiler.ts
@@ -314,18 +314,6 @@ export interface ConfigExtras {
    */
   scopedSlotTextContentFix?: boolean;
 
-  // TODO(STENCIL-662): Remove code related to deprecated shadowDomShim field
-  /**
-   * If enabled `true`, the runtime will check if the shadow dom shim is required. However,
-   * if it's determined that shadow dom is already natively supported by the browser then
-   * it does not request the shim. When set to `false` it will avoid all shadow dom tests.
-   * Defaults to `false`.
-   *
-   * @deprecated Since Stencil v3.0.0. IE 11, Edge <= 18, and old Safari versions
-   * are no longer supported.
-   */
-  __deprecated__shadowDomShim?: boolean;
-
   /**
    * When a component is first attached to the DOM, this setting will wait a single tick before
    * rendering. This works around an Angular issue, where Angular attaches the elements before

diff --git a/src/runtime/bootstrap-custom-element.ts b/src/runtime/bootstrap-custom-element.ts
@@ -32,7 +32,7 @@ export const proxyCustomElement = (Cstr: any, compactMeta: d.ComponentRuntimeMet
     cmpMeta.$attrsToReflect$ = [];
   }
   if (BUILD.shadowDom && !supportsShadow && cmpMeta.$flags$ & CMP_FLAGS.shadowDomEncapsulation) {
-    // TODO(STENCIL-662): Remove code related to deprecated shadowDomShim field
+    // TODO(STENCIL-854): Remove code related to legacy shadowDomShim field
     cmpMeta.$flags$ |= CMP_FLAGS.needsShadowDomShim;
   }
 

diff --git a/src/runtime/bootstrap-lazy.ts b/src/runtime/bootstrap-lazy.ts
@@ -72,7 +72,7 @@ export const bootstrapLazy = (lazyBundles: d.LazyBundlesRuntimeData, options: d.
         cmpMeta.$watchers$ = {};
       }
       if (BUILD.shadowDom && !supportsShadow && cmpMeta.$flags$ & CMP_FLAGS.shadowDomEncapsulation) {
-        // TODO(STENCIL-662): Remove code related to deprecated shadowDomShim field
+        // TODO(STENCIL-854): Remove code related to legacy shadowDomShim field
         cmpMeta.$flags$ |= CMP_FLAGS.needsShadowDomShim;
       }
       const tagName =

diff --git a/src/runtime/connected-callback.ts b/src/runtime/connected-callback.ts
@@ -47,7 +47,7 @@ export const connectedCallback = (elm: d.HostElement) => {
         if (
           BUILD.hydrateServerSide ||
           ((BUILD.slot || BUILD.shadowDom) &&
-            // TODO(STENCIL-662): Remove code related to deprecated shadowDomShim field
+            // TODO(STENCIL-854): Remove code related to legacy shadowDomShim field
             cmpMeta.$flags$ & (CMP_FLAGS.hasSlotRelocation | CMP_FLAGS.needsShadowDomShim))
         ) {
           setContentReference(elm);

diff --git a/src/runtime/dom-extras.ts b/src/runtime/dom-extras.ts
@@ -125,7 +125,7 @@ export const patchChildSlotNodes = (elm: any, cmpMeta: d.ComponentRuntimeMeta) =
       return this[n];
     }
   }
-  // TODO(STENCIL-662): Remove code related to deprecated shadowDomShim field
+  // TODO(STENCIL-854): Remove code related to legacy shadowDomShim field
   if (cmpMeta.$flags$ & CMP_FLAGS.needsShadowDomShim) {
     const childNodesFn = elm.__lookupGetter__('childNodes');
 

diff --git a/src/runtime/initialize-component.ts b/src/runtime/initialize-component.ts
@@ -102,7 +102,7 @@ export const initializeComponent = async (
         if (
           !BUILD.hydrateServerSide &&
           BUILD.shadowDom &&
-          // TODO(STENCIL-662): Remove code related to deprecated shadowDomShim field
+          // TODO(STENCIL-854): Remove code related to legacy shadowDomShim field
           BUILD.shadowDomShim &&
           cmpMeta.$flags$ & CMP_FLAGS.needsShadowDomShim
         ) {

diff --git a/src/runtime/styles.ts b/src/runtime/styles.ts
@@ -89,7 +89,6 @@ export const attachStyles = (hostRef: d.HostRef) => {
     hostRef.$modeName$
   );
 
-  // TODO(STENCIL-662): Remove code related to deprecated shadowDomShim field
   if ((BUILD.shadowDom || BUILD.scoped) && BUILD.cssAnnotations && flags & CMP_FLAGS.needsScopedEncapsulation) {
     // only required when we're NOT using native shadow dom (slot)
     // or this browser doesn't support native shadow dom

diff --git a/src/testing/spec-page.ts b/src/testing/spec-page.ts
@@ -133,7 +133,7 @@ export async function newSpecPage(opts: NewSpecPageOptions): Promise<SpecPage> {
     BUILD.hydrateClientSide = false;
   }
   BUILD.cloneNodeFix = false;
-  // TODO(STENCIL-662): Remove code related to deprecated shadowDomShim field
+  // TODO(STENCIL-854): Remove code related to legacy shadowDomShim field
   BUILD.shadowDomShim = false;
   BUILD.attachStyles = !!opts.attachStyles;
 

diff --git a/src/utils/constants.ts b/src/utils/constants.ts
@@ -59,15 +59,15 @@ export const enum CMP_FLAGS {
   shadowDomEncapsulation = 1 << 0,
   scopedCssEncapsulation = 1 << 1,
   hasSlotRelocation = 1 << 2,
-  // TODO(STENCIL-662): Remove code related to deprecated shadowDomShim field
+  // TODO(STENCIL-854): Remove code related to legacy shadowDomShim field
   // Note that when we remove this field we should consider whether we need to
   // retain a placeholder here, since if we want to have compatability between
   // different versions of the runtime then we'll need to not shift the values
   // of the other higher flags down
   needsShadowDomShim = 1 << 3,
   shadowDelegatesFocus = 1 << 4,
   hasMode = 1 << 5,
-  // TODO(STENCIL-662): Remove code related to deprecated shadowDomShim field
+  // TODO(STENCIL-854): Remove code related to legacy shadowDomShim field
   needsScopedEncapsulation = scopedCssEncapsulation | needsShadowDomShim,
 }
 

diff --git a/test/jest-spec-runner/stencil.config.ts b/test/jest-spec-runner/stencil.config.ts
@@ -10,6 +10,5 @@ export const config: Config = {
   hydratedFlag: null,
   extras: {
     scriptDataOpts: false,
-    shadowDomShim: false,
   },
 };
diff --git a/test/karma/stencil.config.ts b/test/karma/stencil.config.ts
@@ -34,7 +34,6 @@ export const config: Config = {
     lifecycleDOMEvents: true,
     scopedSlotTextContentFix: true,
     scriptDataOpts: true,
-    shadowDomShim: true,
     slotChildNodesFix: true,
   },
   devServer: {

diff --git a/test/todo-app/stencil.config.ts b/test/todo-app/stencil.config.ts
@@ -12,6 +12,5 @@ export const config: Config = {
   hydratedFlag: null,
   extras: {
     scriptDataOpts: false,
-    shadowDomShim: false,
   },
 };