cargdev/angular
1
0
Fork 0
Code Issues 13 Pull Requests Actions Packages Projects Releases Wiki Activity

test(ivy): Have more descriptive names for LView (#33449)

Browse Source 
When debugging `LView`s it is easy to get lost since all of them have
the same name. This change does three things:

1. It makes `TView` have an explicit type:
  - `Host`: for the top level `TView` for bootstrap
  - `Component`: for the `TView` which represents components template
  - `Embedded`: for the `TView` which represents an embedded template
2. It changes the name of `LView` to `LHostView`, `LComponentView`, and
  `LEmbeddedView` depending on the `TView` type.
3. For `LComponentView` and `LEmbeddedView` we also append the name of
  of the `context` constructor. The result is that we have `LView`s which
  are name as: `LComponentView_MyComponent` and `LEmbeddedView_NgIfContext`.

The above changes will make it easier to understand the structure of the
application when debugging.

NOTE: All of these are behind `ngDevMode` and will get removed in
production application.

PR Close #33449
This commit is contained in:
Miško Hevery
2019-10-28 12:08:17 -07:00
committed by Andrew Scott
parent 10583f951d
commit c25503b142
22 changed files with 227 additions and 62 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
packages/core/src/render3/interfaces/view.ts
View File

@ -310,6 +310,35 @@ export const enum PreOrderHookFlags {
*/
export interface ExpandoInstructions extends Array<number|HostBindingsFunction<any>|null> {}
/**
* Explicitly marks `TView` as a specific type in `ngDevMode`
*
* It is useful to know conceptually what time of `TView` we are dealing with when
* debugging an application (even if the runtime does not need it.) For this reason
* we store this information in the `ngDevMode` `TView` and than use it for
* better debugging experience.
*/
export const enum TViewType {
/**
* Root `TView` is the used to bootstrap components into. It is used in conjunction with
* `LView` which takes an existing DOM node not owned by Angular and wraps it in `TView`/`LView`
* so that other components can be loaded into it.
*/
Root = 0,
/**
* `TView` associated with a Component. This would be the `TView` directly associated with the
* component view (as opposed an `Embedded` `TView` which would be a child of `Component` `TView`)
*/
Component = 1,
/**
* `TView` associated with a template. Such as `*ngIf`, `<ng-template>` etc... A `Component`
* can have zero or more `Embedede` `TView`s.
*/
Embedded = 2,
}
/**
* The static data for an LView (shared between all templates of a
* given type).