From d354037323dd72e8e7f8da74f53473e4cb7459db Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Thu, 23 Feb 2023 16:45:51 -0500 Subject: [PATCH 1/2] fix(menu, split-pane): add checks for ssr --- core/src/components/menu/menu.tsx | 5 +++-- core/src/components/split-pane/split-pane.tsx | 6 ++++-- 2 files changed, 7 insertions(+), 4 deletions(-) diff --git a/core/src/components/menu/menu.tsx b/core/src/components/menu/menu.tsx index 178491bef9b..aa163953562 100644 --- a/core/src/components/menu/menu.tsx +++ b/core/src/components/menu/menu.tsx @@ -10,6 +10,7 @@ import type { Attributes } from '../../utils/helpers'; import { inheritAriaAttributes, assert, clamp, isEndSide as isEnd } from '../../utils/helpers'; import { menuController } from '../../utils/menu-controller'; import { getOverlay } from '../../utils/overlays'; +import { win } from '../../utils/window'; const iosEasing = 'cubic-bezier(0.32,0.72,0,1)'; const mdEasing = 'cubic-bezier(0.0,0.0,0.2,1)'; @@ -173,8 +174,8 @@ export class Menu implements ComponentInterface, MenuI { async connectedCallback() { // TODO: connectedCallback is fired in CE build // before WC is defined. This needs to be fixed in Stencil. - if (typeof (customElements as any) !== 'undefined') { - await customElements.whenDefined('ion-menu'); + if (win !== undefined && typeof (win.customElements as any) !== 'undefined') { + await win.customElements.whenDefined('ion-menu'); } if (this.type === undefined) { diff --git a/core/src/components/split-pane/split-pane.tsx b/core/src/components/split-pane/split-pane.tsx index eebcfbfbba0..1c50e5881ec 100644 --- a/core/src/components/split-pane/split-pane.tsx +++ b/core/src/components/split-pane/split-pane.tsx @@ -2,6 +2,7 @@ import type { ComponentInterface, EventEmitter } from '@stencil/core'; import { Build, Component, Element, Event, Host, Prop, State, Watch, h } from '@stencil/core'; import { getIonMode } from '../../global/ionic-global'; +import { win } from '../../utils/window'; // TODO(FW-2832): types @@ -65,9 +66,10 @@ export class SplitPane implements ComponentInterface { async connectedCallback() { // TODO: connectedCallback is fired in CE build // before WC is defined. This needs to be fixed in Stencil. - if (typeof (customElements as any) !== 'undefined') { - await customElements.whenDefined('ion-split-pane'); + if (win !== undefined && typeof (win.customElements as any) !== 'undefined') { + await win.customElements.whenDefined('ion-split-pane'); } + this.styleChildren(); this.updateState(); } From 2905db004c93455277ea2db51ee55b1b3ebdf67b Mon Sep 17 00:00:00 2001 From: Liam DeBeasi Date: Thu, 23 Feb 2023 21:59:31 +0000 Subject: [PATCH 2/2] try a null check --- core/src/components/menu/menu.tsx | 5 ++--- core/src/components/split-pane/split-pane.tsx | 6 ++---- 2 files changed, 4 insertions(+), 7 deletions(-) diff --git a/core/src/components/menu/menu.tsx b/core/src/components/menu/menu.tsx index aa163953562..fdae1de8c99 100644 --- a/core/src/components/menu/menu.tsx +++ b/core/src/components/menu/menu.tsx @@ -10,7 +10,6 @@ import type { Attributes } from '../../utils/helpers'; import { inheritAriaAttributes, assert, clamp, isEndSide as isEnd } from '../../utils/helpers'; import { menuController } from '../../utils/menu-controller'; import { getOverlay } from '../../utils/overlays'; -import { win } from '../../utils/window'; const iosEasing = 'cubic-bezier(0.32,0.72,0,1)'; const mdEasing = 'cubic-bezier(0.0,0.0,0.2,1)'; @@ -174,8 +173,8 @@ export class Menu implements ComponentInterface, MenuI { async connectedCallback() { // TODO: connectedCallback is fired in CE build // before WC is defined. This needs to be fixed in Stencil. - if (win !== undefined && typeof (win.customElements as any) !== 'undefined') { - await win.customElements.whenDefined('ion-menu'); + if (typeof (customElements as any) !== 'undefined' && (customElements as any) != null) { + await customElements.whenDefined('ion-menu'); } if (this.type === undefined) { diff --git a/core/src/components/split-pane/split-pane.tsx b/core/src/components/split-pane/split-pane.tsx index 1c50e5881ec..decd5d7a595 100644 --- a/core/src/components/split-pane/split-pane.tsx +++ b/core/src/components/split-pane/split-pane.tsx @@ -2,7 +2,6 @@ import type { ComponentInterface, EventEmitter } from '@stencil/core'; import { Build, Component, Element, Event, Host, Prop, State, Watch, h } from '@stencil/core'; import { getIonMode } from '../../global/ionic-global'; -import { win } from '../../utils/window'; // TODO(FW-2832): types @@ -66,10 +65,9 @@ export class SplitPane implements ComponentInterface { async connectedCallback() { // TODO: connectedCallback is fired in CE build // before WC is defined. This needs to be fixed in Stencil. - if (win !== undefined && typeof (win.customElements as any) !== 'undefined') { - await win.customElements.whenDefined('ion-split-pane'); + if (typeof (customElements as any) !== 'undefined' && (customElements as any) != null) { + await customElements.whenDefined('ion-split-pane'); } - this.styleChildren(); this.updateState(); }