Commit graph

34 commits

Author SHA1 Message Date
Keith Li
5e404d3114 feat(devtools): support icons in offline mode (#45430) (#45743)
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
2022-05-12 09:17:05 -07:00
AleksanderBodurri
b7fca64828 build(devtools): Optimize prod build for Angular DevTools (#45886)
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
2022-05-05 15:33:14 -07:00
mgechev
a212fb4dde docs: update the Angular DevTools auto-generated READMEs (#45884)
Replace the auto-generated READMEs in the different Angular DevTools
submodules with brief descriptions.

PR Close #45884
2022-05-05 15:29:27 -07:00
mgechev
136839054c refactor(devtools): remove support for v11 and older versions of Angular (#45883)
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
2022-05-05 15:28:42 -07:00
Paul Gschwendtner
68a6a075f4 build: clean up references to old master branch (#45856)
Cleans up all references to the `master` branch we renamed to
`main` across Angular.

PR Close #45856
2022-05-04 16:23:33 -07:00
Kristiyan Kostadinov
29039fcdbc feat(core): support TypeScript 4.7 (#45749)
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
2022-04-29 12:19:45 -04:00
Sumit Arora
2eb39c0878 fix(devtools): inline loading svg (#45762)
* inlined loading animation svg instead of using absolute url
* removing unused assets folder from the build

PR Close #45762
2022-04-27 09:07:38 -07:00
Kristiyan Kostadinov
b29b95b0f8 fix(devtools): clean up menu layout (#45665)
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
2022-04-18 09:23:13 -07:00
Sumit Arora
b5f39c5da1 docs(devtools): updating firefox documentation (#44952)
updating typo

PR Close #44952
2022-04-12 18:41:37 +00:00
Sumit Arora
e589bc6227 feat(devtools): added string flag for browser support (#44952)
* Added `flag_browser` to toggle between different browser builds chrome and firefox
* Updated build command to support new flag configuration

PR Close #44952
2022-04-12 18:41:37 +00:00
Sumit Arora
bc0b6fe67d feat(devtools): adding firefox support (#44952)
* Updating manifest.json to new build structure
* Adding doctype to pages to remove warnings

PR Close #44952
2022-04-12 18:41:37 +00:00
Sumit Arora
ceb19c044a feat(devtools): renaming shell-chrome (#44952)
Renaming `shell-chrome` to `shell-browser` contains the build that supports both browsers.

PR Close #44952
2022-04-12 18:41:37 +00:00
Sumit Arora
d54d1fd68e feat(devtools): dynamic build support for devtools (#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
2022-04-12 18:41:37 +00:00
Sumit Arora
2b73d95b06 feat(devtools): updating firefox manifest json file (#44952)
Updating `manifest.json` file for firefox.

PR Close #44952
2022-04-12 18:41:37 +00:00
Sumit Arora
e231d3c878 feat(devtools): adding firefox support for devtools (#44952)
Adding Firefox support for Angular DevTools.

PR Close #44952
2022-04-12 18:41:37 +00:00
Paul Gschwendtner
c996b477a9 build: replace bazel devserver with shared dev-infra implementation (#45452)
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
2022-03-28 09:23:28 -07:00
Tobias Speicher
4ddcf81e61 refactor: replace deprecated String.prototype.substr() (#45397)
.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
2022-03-24 11:48:09 -07:00
Alan Agius
ba0efd1f80 refactor: replace deprecated HTMLDocument with Document (#45282)
`HTMLDocument` is deprecated in favor of `Document`. This change replaces the usages of `HTMLDocument`.

See: 20c93d3b1d/lib/lib.dom.d.ts (L6370-L6376)

PR Close #45282
2022-03-08 13:12:14 -08:00
mgechev
bf428775a4 fix(devtools): change links to the angular repo (#44885)
Use proper reporting and source code links in the DevTools UI.

PR Close #44885
2022-02-02 15:33:17 -08:00
JimMorrison723
d41dedb85b fix(devtools): highlighter should only show the hovered component's name (#44863)
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
2022-02-01 21:28:09 +00:00
JimMorrison723
3f0a2d3120 fix(devtools): show date type property value in preview (#44864)
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
2022-01-31 19:32:47 +00:00
Paul Gschwendtner
7b7d644286 refactor: fix type checking error with devtools state-serializer spec (#44735)
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
2022-01-27 21:51:28 +00:00
AleksanderBodurri
8fb3aed874 docs(devtools): update comment to better reflect what angular version is running in g3.
PR Close #43473
2022-01-26 14:18:32 -08:00
AleksanderBodurri
445fbf81fd refactor(devtools): bring the angular devtools directory into the root bazel workspace
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.
2022-01-26 16:35:31 -05:00
AleksanderBodurri
7ed57f29ea refactor(devtools): add override to classes that extend abstract classes in the devtools directory
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.
2022-01-26 16:35:31 -05:00
AleksanderBodurri
2a1ff17b42 refactor(devtools): run tslint --fix on devtools codebase
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 "/**".
2022-01-26 16:35:31 -05:00
AleksanderBodurri
6b06fa3f78 refactor(devtools): make bazel labels follow snake case convention
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.
2022-01-26 16:35:30 -05:00
AleksanderBodurri
8b84412d76 refactor(devtools): run ng-dev format on angular devtools files
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.
2022-01-26 16:35:30 -05:00
AleksanderBodurri
34385014b0 test(devtools): fix some flakey cypress tests
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`
2022-01-26 16:35:30 -05:00
AleksanderBodurri
c24924cbd7 build(devtools): use ng-dev stamp tooling to stamp the latest git SHA in devtools
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.
2022-01-26 16:35:30 -05:00
AleksanderBodurri
6a659a592e ci: remove bazel cypress tests
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.
2022-01-26 16:35:30 -05:00
AleksanderBodurri
0a948fb2ef build: configure circleci for angular devtools ci
Sets up commands in circleci config to test angular devtools.
2022-01-26 16:35:30 -05:00
AleksanderBodurri
82d46b20b1 refactor(devtools): run ng-dev format on bazel files in devtools directory 2022-01-26 16:35:30 -05:00
AleksanderBodurri
528f33d13d refactor(devtools): prepare codebase for migration to angular/angular repo 2021-11-21 20:23:18 -05:00