fix(overlays): move prepareOverlay to connectedCallback

For custom elements builds, overlays cannot use hasAttribute() in the constructor, so moving it to connectedCallback instead.
This commit is contained in:
Adam Bradley
2020-07-21 13:07:54 -05:00
committed by GitHub
parent f4a08b7ed4
commit 79518468dd
8 changed files with 25 additions and 20 deletions

View File

@ -31,8 +31,10 @@ export const popoverController = /*@__PURE__*/createController<PopoverOptions, H
export const toastController = /*@__PURE__*/createController<ToastOptions, HTMLIonToastElement>('ion-toast');
export const prepareOverlay = <T extends HTMLIonOverlayElement>(el: T) => {
const doc = document;
connectListeners(doc);
/* tslint:disable-next-line */
if (typeof document !== 'undefined') {
connectListeners(document);
}
const overlayIndex = lastId++;
el.overlayIndex = overlayIndex;
if (!el.hasAttribute('id')) {
@ -41,20 +43,23 @@ export const prepareOverlay = <T extends HTMLIonOverlayElement>(el: T) => {
};
export const createOverlay = <T extends HTMLIonOverlayElement>(tagName: string, opts: object | undefined): Promise<T> => {
return customElements.whenDefined(tagName).then(() => {
const doc = document;
const element = doc.createElement(tagName) as HTMLIonOverlayElement;
element.classList.add('overlay-hidden');
/* tslint:disable-next-line */
if (typeof customElements !== 'undefined') {
return customElements.whenDefined(tagName).then(() => {
const element = document.createElement(tagName) as HTMLIonOverlayElement;
element.classList.add('overlay-hidden');
// convert the passed in overlay options into props
// that get passed down into the new overlay
Object.assign(element, opts);
// convert the passed in overlay options into props
// that get passed down into the new overlay
Object.assign(element, opts);
// append the overlay element to the document body
getAppRoot(doc).appendChild(element);
// append the overlay element to the document body
getAppRoot(document).appendChild(element);
return element.componentOnReady() as any;
});
return element.componentOnReady() as any;
});
}
return Promise.resolve() as any;
};
export const connectListeners = (doc: Document) => {