From a8455a90ffef54c4a6f9f981106380df13796e18 Mon Sep 17 00:00:00 2001 From: Adam Bradley Date: Tue, 23 Jul 2019 14:11:09 -0500 Subject: [PATCH] chore(ssr): fix document.body reference (#18863) --- angular/src/app-initialize.ts | 2 +- .../control-value-accessors/value-accessor.ts | 8 ++--- .../directives/navigation/stack-controller.ts | 21 ++++++----- .../src/directives/navigation/stack-utils.ts | 36 +++++++++---------- angular/src/util/util.ts | 8 ++--- 5 files changed, 39 insertions(+), 36 deletions(-) diff --git a/angular/src/app-initialize.ts b/angular/src/app-initialize.ts index 8df7b9ddf9..6a34ae7cd8 100644 --- a/angular/src/app-initialize.ts +++ b/angular/src/app-initialize.ts @@ -16,7 +16,7 @@ export function appInitialize(config: Config, doc: Document, zone: NgZone) { _zoneGate: (h: any) => zone.run(h) }; - const aelFn = '__zone_symbol__addEventListener' in (document.body as any) + const aelFn = '__zone_symbol__addEventListener' in (doc.body as any) ? '__zone_symbol__addEventListener' : 'addEventListener'; diff --git a/angular/src/directives/control-value-accessors/value-accessor.ts b/angular/src/directives/control-value-accessors/value-accessor.ts index 4bb10db791..acad8a790e 100644 --- a/angular/src/directives/control-value-accessors/value-accessor.ts +++ b/angular/src/directives/control-value-accessors/value-accessor.ts @@ -43,7 +43,7 @@ export class ValueAccessor implements ControlValueAccessor { } } -export function setIonicClasses(element: ElementRef) { +export const setIonicClasses = (element: ElementRef) => { raf(() => { const input = element.nativeElement as HTMLElement; const classes = getClasses(input); @@ -54,9 +54,9 @@ export function setIonicClasses(element: ElementRef) { setClasses(item, classes); } }); -} +}; -function getClasses(element: HTMLElement) { +const getClasses = (element: HTMLElement) => { const classList = element.classList; const classes = []; for (let i = 0; i < classList.length; i++) { @@ -66,7 +66,7 @@ function getClasses(element: HTMLElement) { } } return classes; -} +}; function setClasses(element: HTMLElement, classes: string[]) { const classList = element.classList; diff --git a/angular/src/directives/navigation/stack-controller.ts b/angular/src/directives/navigation/stack-controller.ts index e4b04436ac..4a277eae99 100644 --- a/angular/src/directives/navigation/stack-controller.ts +++ b/angular/src/directives/navigation/stack-controller.ts @@ -246,16 +246,19 @@ export class StackController { } } -function cleanupAsync(activeRoute: RouteView, views: RouteView[], viewsSnapshot: RouteView[], location: Location) { - return new Promise(resolve => { - requestAnimationFrame(() => { - cleanup(activeRoute, views, viewsSnapshot, location); - resolve(); +const cleanupAsync = (activeRoute: RouteView, views: RouteView[], viewsSnapshot: RouteView[], location: Location) => { + if (typeof (requestAnimationFrame as any) === 'function') { + return new Promise(resolve => { + requestAnimationFrame(() => { + cleanup(activeRoute, views, viewsSnapshot, location); + resolve(); + }); }); - }); -} + } + return Promise.resolve(); +}; -function cleanup(activeRoute: RouteView, views: RouteView[], viewsSnapshot: RouteView[], location: Location) { +const cleanup = (activeRoute: RouteView, views: RouteView[], viewsSnapshot: RouteView[], location: Location) => { viewsSnapshot .filter(view => !views.includes(view)) .forEach(destroyView); @@ -280,4 +283,4 @@ function cleanup(activeRoute: RouteView, views: RouteView[], viewsSnapshot: Rout view.ref.changeDetectorRef.detach(); } }); -} +}; diff --git a/angular/src/directives/navigation/stack-utils.ts b/angular/src/directives/navigation/stack-utils.ts index f52c5b36bb..b6ab21c24a 100644 --- a/angular/src/directives/navigation/stack-utils.ts +++ b/angular/src/directives/navigation/stack-utils.ts @@ -2,7 +2,7 @@ import { ComponentRef } from '@angular/core'; import { ActivatedRoute, NavigationExtras, Router } from '@angular/router'; import { NavDirection, RouterDirection } from '@ionic/core'; -export function insertView(views: RouteView[], view: RouteView, direction: RouterDirection) { +export const insertView = (views: RouteView[], view: RouteView, direction: RouterDirection) => { if (direction === 'root') { return setRoot(views, view); } else if (direction === 'forward') { @@ -10,15 +10,15 @@ export function insertView(views: RouteView[], view: RouteView, direction: Route } else { return setBack(views, view); } -} +}; -function setRoot(views: RouteView[], view: RouteView) { +const setRoot = (views: RouteView[], view: RouteView) => { views = views.filter(v => v.stackId !== view.stackId); views.push(view); return views; -} +}; -function setForward(views: RouteView[], view: RouteView) { +const setForward = (views: RouteView[], view: RouteView) => { const index = views.indexOf(view); if (index >= 0) { views = views.filter(v => v.stackId !== view.stackId || v.id <= view.id); @@ -26,30 +26,30 @@ function setForward(views: RouteView[], view: RouteView) { views.push(view); } return views; -} +}; -function setBack(views: RouteView[], view: RouteView) { +const setBack = (views: RouteView[], view: RouteView) => { const index = views.indexOf(view); if (index >= 0) { return views.filter(v => v.stackId !== view.stackId || v.id <= view.id); } else { return setRoot(views, view); } -} +}; -export function getUrl(router: Router, activatedRoute: ActivatedRoute) { +export const getUrl = (router: Router, activatedRoute: ActivatedRoute) => { const urlTree = router.createUrlTree(['.'], { relativeTo: activatedRoute }); return router.serializeUrl(urlTree); -} +}; -export function isTabSwitch(enteringView: RouteView, leavingView: RouteView | undefined) { +export const isTabSwitch = (enteringView: RouteView, leavingView: RouteView | undefined) => { if (!leavingView) { return true; } return enteringView.stackId !== leavingView.stackId; -} +}; -export function computeStackId(prefixUrl: string[] | undefined, url: string) { +export const computeStackId = (prefixUrl: string[] | undefined, url: string) => { if (!prefixUrl) { return undefined; } @@ -63,22 +63,22 @@ export function computeStackId(prefixUrl: string[] | undefined, url: string) { } } return undefined; -} +}; -export function toSegments(path: string): string[] { +export const toSegments = (path: string) => { return path .split('/') .map(s => s.trim()) .filter(s => s !== ''); -} +}; -export function destroyView(view: RouteView | undefined) { +export const destroyView = (view: RouteView | undefined) => { if (view) { // TODO lifecycle event view.ref.destroy(); view.unlistenEvents(); } -} +}; export interface StackEvent { enteringView: RouteView; diff --git a/angular/src/util/util.ts b/angular/src/util/util.ts index 3c6329fb24..9141983edb 100644 --- a/angular/src/util/util.ts +++ b/angular/src/util/util.ts @@ -5,17 +5,17 @@ export const raf = (h: any) => { return (win.__zone_symbol__requestAnimationFrame) ? win.__zone_symbol__requestAnimationFrame(h) : requestAnimationFrame(h); }; -export function proxyMethod(ctrlName: string, doc: Document, methodName: string, ...args: any[]) { +export const proxyMethod = (ctrlName: string, doc: Document, methodName: string, ...args: any[]) => { const controller = ensureElementInBody(ctrlName, doc); return controller.componentOnReady() .then(() => (controller as any)[methodName].apply(controller, args)); -} +}; -export function ensureElementInBody(elementName: string, doc: Document) { +export const ensureElementInBody = (elementName: string, doc: Document) => { let element = doc.querySelector(elementName); if (!element) { element = doc.createElement(elementName); doc.body.appendChild(element); } return element as HTMLStencilElement; -} +};