angular/packages/angular/src/lib/platform-nativescript.ts at 440cce933298eed05bca9664f65dd4a5831c095b · NativeScript/angular · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
import {
  Type,
  Injector,
  CompilerOptions,
  PlatformRef,
  NgModuleFactory,
  NgModuleRef,
  EventEmitter,
  Sanitizer,
  InjectionToken,
  StaticProvider,
  createPlatformFactory,
  platformCore,
  PLATFORM_ID,
  ɵinternalCreateApplication,
  ApplicationConfig,
} from '@angular/core';
import { DOCUMENT, LocationChangeListener, LocationStrategy, PlatformLocation } from '@angular/common';
import { NativeScriptPlatformRefProxy } from './platform-ref';
import { AppHostView } from './app-host-view';
import { Color, GridLayout } from '@nativescript/core';
import { defaultPageFactory, ENABLE_REUSABE_VIEWS, PAGE_FACTORY, WRAP_CD_IN_TRANSACTION } from './tokens';
import { AppLaunchView } from './application';
import { NATIVESCRIPT_MODULE_PROVIDERS, NATIVESCRIPT_MODULE_STATIC_PROVIDERS } from './nativescript';

export const defaultPageFactoryProvider = { provide: PAGE_FACTORY, useValue: defaultPageFactory };
export class NativeScriptSanitizer extends Sanitizer {
  sanitize(_context: any, value: string): string {
    return value;
  }
}
// TODO: when angular finally exports their scheduler token for ivy CD, provide our own with queueMacroTask
// export function schedulerFactory() {
//   return (fn: any) => {
//     console.log('SCHEDULER');
//     setTimeout(fn, 0);
//   };
// }

/**
 * Angular probes the DOM to discover optional configuration it may have been handed
 * out of band - a `ngCspNonce` attribute on `<body>`, a transfer state `<script>` in
 * the document. None of that can exist here, so the lookups answer "nothing found".
 * Leaving the methods undefined instead surfaces as a `TypeError` thrown from deep
 * inside framework code, since `document.body` is present and merely hollow.
 */
const NO_DOM_QUERIES = {
  querySelector: () => null,
  querySelectorAll: () => [],
  getElementById: () => null,
  getElementsByTagName: () => [],
  getElementsByClassName: () => [],
  getAttribute: () => null,
  hasAttribute: () => false,
};

export class NativeScriptDocument {
  // Required by the AnimationDriver
  public body: any = {
    isOverride: true,
    ...NO_DOM_QUERIES,
  };

  public head: any = {
    ...NO_DOM_QUERIES,
  };

  public querySelector = NO_DOM_QUERIES.querySelector;
  public querySelectorAll = NO_DOM_QUERIES.querySelectorAll;
  public getElementById = NO_DOM_QUERIES.getElementById;
  public getElementsByTagName = NO_DOM_QUERIES.getElementsByTagName;
  public getElementsByClassName = NO_DOM_QUERIES.getElementsByClassName;

  // Deliberately still throws: constructing real nodes is a caller bug, not a probe.
  createElement(tag: string) {
    throw new Error('NativeScriptDocument is not DOM Document. There is no createElement() method.');
  }
}

export class DummyLocationStrategy extends LocationStrategy {
  path(includeHash?: boolean): string {
    throw new Error('Method not implemented.');
  }
  prepareExternalUrl(internal: string): string {
    throw new Error('Method not implemented.');
  }
  getState(): unknown {
    throw new Error('Method not implemented.');
  }
  pushState(state: any, title: string, url: string, queryParams: string): void {
    throw new Error('Method not implemented.');
  }
  replaceState(state: any, title: string, url: string, queryParams: string): void {
    throw new Error('Method not implemented.');
  }
  forward(): void {
    throw new Error('Method not implemented.');
  }
  back(): void {
    throw new Error('Method not implemented.');
  }
  onPopState(fn: LocationChangeListener): void {
    throw new Error('Method not implemented.');
  }
  getBaseHref(): string {
    throw new Error('Method not implemented.');
  }
}
export class DummyPlatformLocation extends PlatformLocation {
  getBaseHrefFromDOM(): string {
    throw new Error('Method not implemented.');
  }
  getState(): unknown {
    throw new Error('Method not implemented.');
  }
  onPopState(fn: LocationChangeListener): VoidFunction {
    throw new Error('Method not implemented.');
  }
  onHashChange(fn: LocationChangeListener): VoidFunction {
    throw new Error('Method not implemented.');
  }
  get href(): string {
    throw new Error('Method not implemented.');
  }
  get protocol(): string {
    throw new Error('Method not implemented.');
  }
  get hostname(): string {
    throw new Error('Method not implemented.');
  }
  get port(): string {
    throw new Error('Method not implemented.');
  }
  get pathname(): string {
    throw new Error('Method not implemented.');
  }
  get search(): string {
    throw new Error('Method not implemented.');
  }
  get hash(): string {
    throw new Error('Method not implemented.');
  }
  replaceState(state: any, title: string, url: string): void {
    throw new Error('Method not implemented.');
  }
  pushState(state: any, title: string, url: string): void {
    throw new Error('Method not implemented.');
  }
  forward(): void {
    throw new Error('Method not implemented.');
  }
  back(): void {
    throw new Error('Method not implemented.');
  }
}

export const COMMON_PROVIDERS: StaticProvider[] = [
  defaultPageFactoryProvider,
  { provide: Sanitizer, useClass: NativeScriptSanitizer, deps: [] },
  { provide: DOCUMENT, useClass: NativeScriptDocument, deps: [] },
  { provide: PLATFORM_ID, useValue: 'browser' },
  {
    provide: LocationStrategy,
    useClass: DummyLocationStrategy,
    deps: [],
  },
  { provide: PlatformLocation, useClass: DummyPlatformLocation, deps: [] },
];

export const platformNativeScript = createPlatformFactory(platformCore, 'nativescriptDynamic', COMMON_PROVIDERS);
export interface BootstrapContext {
  platformRef?: PlatformRef;
}

export interface NativeScriptApplicationConfig extends ApplicationConfig {
  reusableViews?: boolean;
  ios?: {
    wrapChangeDetectionInTransaction?: boolean;
  };
}

function createProvidersConfig(options?: NativeScriptApplicationConfig, context?: BootstrapContext) {
  const nsProviders: StaticProvider[] = [];
  if (options?.reusableViews) {
    nsProviders.push({ provide: ENABLE_REUSABE_VIEWS, useValue: true });
  }
  if (options?.ios?.wrapChangeDetectionInTransaction) {
    nsProviders.push({ provide: WRAP_CD_IN_TRANSACTION, useValue: true });
  }
  return {
    platformRef: context?.platformRef,
    appProviders: [
      ...NATIVESCRIPT_MODULE_STATIC_PROVIDERS,
      ...NATIVESCRIPT_MODULE_PROVIDERS,
      ...nsProviders,
      ...(options?.providers ?? []),
    ],
    platformProviders: context?.platformRef ? [] : COMMON_PROVIDERS,
  };
}

export function bootstrapApplication(
  rootComponent: Type<any>,
  options?: NativeScriptApplicationConfig,
  context?: BootstrapContext,
) {
  return ɵinternalCreateApplication({
    rootComponent: rootComponent,
    ...createProvidersConfig(options, context),
  });
}

export function createApplication(options?: NativeScriptApplicationConfig, context?: BootstrapContext) {
  return ɵinternalCreateApplication(createProvidersConfig(options, context));
}

export interface HmrOptions {
  /**
   * A factory function that returns either Module type or NgModuleFactory type.
   * This needs to be a factory function as the types will change when modules are replaced.
   */
  moduleTypeFactory?: () => Type<any> | NgModuleFactory<any>;

  /**
   * A livesync callback that will be called instead of the original livesync.
   * It gives the HMR a hook to apply the module replacement.
   * @param bootstrapPlatform - A bootstrap callback to be called after HMR is done. It will bootstrap a new angular app within the exisiting platform, using the moduleTypeFactory to get the Module or NgModuleFactory to be used.
   */
  livesyncCallback: (bootstrapPlatform: () => void) => void;
}

export interface AppOptions {
  cssFile?: string;
  startPageActionBarHidden?: boolean;
  hmrOptions?: HmrOptions;
  /**
   * Background color of the root view
   */
  backgroundColor?: string;
  /**
   * Use animated launch view (async by default)
   */
  launchView?: AppLaunchView;
  /**
   * When using Async APP_INITIALIZER, set this to `true`.
   * (Not needed when using launchView)
   */
  async?: boolean;
}

/**
 * @deprecated use runNativeScriptAngularApp instead
 */
export const platformNativeScriptDynamic = function (options?: AppOptions, extraProviders?: StaticProvider[]) {
  console.log('platformNativeScriptDynamic is deprecated, use runNativeScriptAngularApp instead');
  options = options || {};
  extraProviders = extraProviders || [];

  const ngRootView = new AppHostView(new Color(options.backgroundColor || 'white'));
  let launchView = options.launchView;
  if (!launchView && options.async) {
    launchView = new GridLayout();
    launchView.backgroundColor = options.backgroundColor || 'white';
  }
  return new NativeScriptPlatformRefProxy(platformNativeScript([...extraProviders]), launchView);
};