Add support to material design icons in offline mode for Angular Devtools. Self hosting the web font so icons are loaded regardless of network connection.
Bring the font file as well as its corresponding css file from third_party repo through bazel into shell-browser directory while building.
PR Close#45743
Uses `createEsbuildAngularOptimizePlugin` from dev-infra-private and passes in `GLOBAL_DEFS_FOR_TERSER_WITH_AOT` into a new esbuild prod configuration. Notably, this removes references to `ngDevMode` from the final build and enables minification.
PR Close#45886
In Angular v12 we introduced debugging APIs sufficient for DevTools.
Prior to that Angular DevTools accesses the logical data structures of
Ivy directly, which sometimes produces suboptimal results and skips
dynamically inserted content.
With the end of v11's LTS, we'll support only Angular v12 and up.
PR Close#45883
Adds support for TypeScript 4.7. Changes include:
* Bumping the TS version as well as some Bazel dependencies to include https://github.com/bazelbuild/rules_nodejs/pull/3420.
* Adding a backwards-compatibility layer for calls to `updateTypeParameterDeclaration`.
* Making `LView` generic in order to make it easier to type the context based on the usage. Currently the context can be 4 different types which coupled with stricter type checking would required a lot of extra casting all over `core`.
* Fixing a bunch of miscellaneous type errors.
* Removing assertions of `ReferenceEntry.isDefinition` in a few of the language service tests. The field isn't returned by TS anymore and we weren't using it for anything.
* Resolving in error in the language service that was caused by TS attempting to parse HTML files when we try to open them. Previous TS was silently setting them as `ScriptKind.Unknown` and ignoring the errors, but now it throws. I've worked around it by setting them as `ScriptKind.JSX`.
PR Close#45749
The menus weren't using the `mat-menu` component correctly which had led to some inconsistent spacing and the need for style overrides. These changes correctly wrap the menu content in `mat-menu-item` which has the added benefit of having keyboard support. I had to keep some of the overrides in order to preserve the dense layout of the menus.
I've also cleaned up the component by:
* Removing some unnecessary styles.
* Switching single-class usages of `ngClass` to `class.` bindings.
* Not using `br` tags for spacing.
PR Close#45665
* Added `flag_browser` to toggle between different browser builds chrome and firefox
* Updated build command to support new flag configuration
PR Close#44952
* Updating build to support both browsers firefox & chrome.
* Added new `config_setting` to support build.
* Added new genrule `copy_manifest` to `prodapp` pkg_web.
PR Close#44952
As part of the devtools migration, we copied the custom http server/
dev-server from the `angular/components` repo. This server implementation
has now moved to the shared dev-infra code, and we can clean up the
copy in this repository now.
PR Close#45452
.substr() is deprecated so we replace it with functions which work similarily but aren't deprecated
Signed-off-by: Tobias Speicher <rootcommander@gmail.com>
PR Close#45397
The used children property on a HTMLCollection does not contain text elements. Because of this, the highlighter overlay text never got fully cleared.
PR Close#44863
Values of Date properties were not shown in the preview. It was formatted to a simple string thus not giving valuable info to the developer.
PR Close#44864
Fixes an error in the satte-serializer spec:
```
devtools/projects/ng-devtools-backend/src/lib/state-serializer/state-serializer.spec.ts:103:60 - error TS2345: Argument of type '{ name: string; children: { name: string; children: { name: number; children: { name: number; children: { name: string; }[]; }[]; }[]; }[]; }[]' is not assignable to parameter of type 'NestedProp[]'.
Type '{ name: string; children: { name: string; children: { name: number; children: { name: number; children: { name: string; }[]; }[]; }[]; }[]; }' is not assignable to type 'NestedProp'.
Types of property 'children' are incompatible.
Type '{ name: string; children: { name: number; children: { name: number; children: { name: string; }[]; }[]; }[]; }[]' is not assignable to type 'NestedProp[]'.
Type '{ name: string; children: { name: number; children: { name: number; children: { name: string; }[]; }[]; }[]; }' is not assignable to type 'NestedProp'.
Types of property 'children' are incompatible.
Type '{ name: number; children: { name: number; children: { name: string; }[]; }[]; }[]' is not assignable to type 'NestedProp[]'.
Type '{ name: number; children: { name: number; children: { name: string; }[]; }[]; }' is not assignable to type 'NestedProp'.
Types of property 'children' are incompatible.
Type '{ name: number; children: { name: string; }[]; }[]' is not assignable to type 'NestedProp[]'.
Type '{ name: number; children: { name: string; }[]; }' is not assignable to type 'NestedProp'.
Types of property 'children' are incompatible.
Type '{ name: string; }[]' is not assignable to type 'NestedProp[]'.
Property 'children' is missing in type '{ name: string; }' but required in type 'NestedProp'.
103 const result = deeplySerializeSelectedProperties(dir1, QUERY_1_2);
```
PR Close#44735
Previously devtools used a nested workspace for its bazel configurations. This meant framework dependencies were consumed via npm.
Now devtools is part of the root bazel directory that all other files in this codebase fall under. This allows us to build devtools using local angular packages, removing the need to consume these dependencies with npn. This is useful because we no longer have to update these dependencies with an automated tool like renovate, and our CI tests will always run against the most up to date framework packages.
Previously the typescript override keyword was not on these methods. Now that devtools uses the tslint config in angular/angular (because of the no-implicit-override-abstract rule) we need to add these key words explicitly to method overrides. That is what this commit does.
This commit runs tslint --fix with the angular/angular tslint configuration on the files inside the devtools codebase.
Notably, the file-header rule in `tslint.json` was missing a default attribute. This commit adds that default attribute and sets it to the
license header that is present in all files in this repo. After running tslint --fix with this default added, this commit added the license header to all files in the devtools directory. Note for the reviewer: the automatically added license headers were added as comments with the "/*!" prefix. Since we want these comments removed in builds, and the rest of the codebase uses "/**", a simple find and replace was performed on the devtools directory to change these prefixes to "/**".
Previously, camel case was used for bazel labels in the devtools directory. This commit changes these labels to snake case except in the case where the label is identical to the directory name that the BUILD file is in.
Formats the entire devtools directory with the ng-dev formatting tool. Previously we relied on prettier, so this commit also remove prettier from devtools' dependencies.
Uses `cy.contains` as one command to optimize cypress' retry-ability mechanism
Affected tests are in:
`property-update.e2e.js` and `view-component-metadata.e2e.js`
Previously, we were using ngx-build-plus with a custom webpack config to determine the git SHA at runtime.
Now, after migrating to bazel and transfering to angular/angular, this commit uses ng-dev to stamp the latest git SHA directly in angular devtools' application environment.
This commit also removes the old webpack configs.
Previously we were running Cypress with bazel in an effort to save on CI time when devtools dependencies did not change. This commit reverts to running Cypress manually, until we can revisit building devtools with local Angular packages to save CI time.