Commit graph

468 commits

Author SHA1 Message Date
mgechev
cd91b2cc27 release(devtools): v1.0.3 2021-11-09 10:08:07 -08:00
mgechev
ff78c66ae9 fix(devtools): handle ngFor and ngIf contexts in the profiler
Currently, we skip the time spent in evaluation of embedded view
templates because the passed context is either an NgIf or an NgForOf.

This change generalizes the implementation to work with views embedded
into a component.
2021-11-09 10:04:12 -08:00
Renovate Bot
87c660508c build(devtools): update angular-framework 2021-11-05 13:09:57 -07:00
kamikopi
0aa64aa490 fix(devtools): Support Electron (rangle/angular-devtools#849)
Following suggestion from the issue thread, created an empty polyfills
to the chrome.browserAction calls, which are not available in the electron.
2021-10-18 16:26:18 -07:00
mgechev
a5c26b6910 refactor(devtools): use local declaration of the change detection strategy enum 2021-10-18 16:24:42 -07:00
mgechev
b85d48c7d2 refactor(devtools): use safe operation to update the overlay 2021-10-18 16:24:42 -07:00
mgechev
a93cfdca81 feat(devtools): support trusted types for script injection 2021-10-18 16:24:42 -07:00
AleksanderBodurri
1b97432960 fix(devtools): update typing of differ objects to fit the new contract of TrackByFunction (rangle/angular-devtools#862)
Previously `DefaultIterableDiffer` was able to infer the type of it's generic by reading the type contract defined by the user defined trackBy function. This was because `TrackByFunction` can be specified with a generic that is used to type its second argument. If this generic is not provided, like in this case, typescript infers this type from the function contract directly. In this case this inferred type was `FlatNode`. This inference is then propagated to `DefaultIterableDiffer`, which is why we were not seeing this error previously.

A change in the framework made it so the second argument of `TrackByFunction` is typed as a generic that extends the generic passed into `TrackByFunction`. Since we had not previously passed in this generic to `TrackByFunction`, this type was inferred as an extension of `unknown`, causing a type error when passed as an argument to the `DefaultIterableDiffer` constructor.

Now the functions being used are typed directly as `TrackByFunction<FlatNode>`

For clarity, the `DefaultIterableDiffer` generic is now also typed as `FlatNode`.

See https://github.com/angular/angular/pull/41995 for the framework change.
2021-06-21 17:56:43 -07:00
AleksanderBodurri
c3e8311298 fix(devtools): use visible gutter size in calculation for split area flex basis' (rangle/angular-devtools#857)
After PR rangle/angular-devtools#618, an invisible gutter was introduced to increase the draggable area of the split pane gutter. The gutter size being used in the calculation for the split area flex-basis still referenced the size of the now invisible gutter, causing split areas to be smaller than they should be. This is most noticable in the the input/output/state expandable panels in the property explorer tab.

Now the visible gutter size is used in the flex-basis calculation instead of the invisible one.
2021-06-21 15:57:47 -07:00
AleksanderBodurri
42e0ba2a9b refactor(devtools): switch to sass use and new angular material theming API (rangle/angular-devtools#853)
Previously we were using sass import rules to bring in material and other styling.

Now we are using the use rule and have switched over to the new angular material theming API
2021-06-16 15:18:12 -07:00
AleksanderBodurri
509abcf39b fix(devtools): prevent mat button css from leaking out of property view header (rangle/angular-devtools#856)
Previously, the property view header component had mat button styling nested in an ng-deep selector. This broke some styling in the info popup whenever an item was selected in the component explorer (because the existence of a selected component causes the property view header tab to render and thus brings in the leaky component css).

Now the leaky styling has been removed, and the component css has been cleaned up.
2021-06-16 15:17:50 -07:00
Sumit Arora
fef9e11022 test(devtools): updating tests for input & output property names 2021-06-03 09:44:17 -04:00
Sumit Arora
0763305d0d fix(devtools): incorrect input names 2021-06-03 09:44:17 -04:00
mgechev
642da74a2e release(devtools): v1.0.2 2021-05-28 10:25:57 -07:00
Minko Gechev
dc345956ce fix(devtools): show properly dynamically inserted content with DOM APIs (rangle/angular-devtools#828)
Fix rangle/angular-devtools#791

Build the render tree starting from the root node of the application.
This fix is applicable only for v12+ apps that are using the latest
debugging APIs.
2021-05-27 22:54:52 -07:00
Minko Gechev
e19dc3efb4 fix(devtools): delayed angular detection with app_initializer (rangle/angular-devtools#827)
This PR sets a timeout for repetitive check if there's an Angular app
on the page. Fix rangle/angular-devtools#826.
2021-05-27 21:19:19 -07:00
Minko Gechev
dfc4437afd fix(devtools): make sure we update the property explorer on state change (rangle/angular-devtools#821)
Fix rangle/angular-devtools#786

With this PR now we consider not only the property name but also the
value of properties in the differ comparison.

The change also contains e2e and unit tests.
2021-05-27 14:40:56 -07:00
Mark Whitfeld
5bf180afb8 fix(devtools): skip node if there is no associated TViewData (rangle/angular-devtools#804)
* fix(backend): skip node if there is no associated TViewData

The code was assuming that the TViewData item at the same index as the node
in LView would contain a data entry. This value can be `null` (which is the
case in our app), which causes a catastrophic failure in the dev tool. By
checking for null, the node is skipped because it cannot determine the
associated component or directive and the dev tool does not die.

fixes issue rangle/angular-devtools#801

* chore: style tweak - add early return to avoid nesting
2021-05-26 11:17:48 -07:00
mgechev
d44e610c4f release(devtools): v1.0.1 2021-05-23 12:24:17 -07:00
mgechev
f8ea26cd92 style(devtools): add call signatures 2021-05-23 11:52:31 -07:00
Amir Rustamzadeh
5b0d3356a6 ci(devtools): fix flaky tests using cypress orb (rangle/angular-devtools#733)
* ci: refactor circle config to use cypress orb

* ci: skipping unit tests while validating e2e runs

* ci: fix karma chrome launches

* ci: investigating karma headless failure

* ci: iterating on failure

* ci: move environment to executor

* build: revert karma config changes

* ci: update karma config

Co-authored-by: mgechev <mgechev@gmail.com>
2021-05-23 11:39:48 -07:00
mgechev
5d1e60dc9d fix(devtools): improve dark mode styles when no ivy detected 2021-05-23 11:00:11 -07:00
mgechev
e6bec2430a fix(devtools): update the prod mode detection to also consider VE apps
Fix rangle/angular-devtools#798
2021-05-23 11:00:11 -07:00
markwhitfeld
d60bdfc207 fix(devtools): don't access service prop unnecessarily
The code was requesting index 0 of each item in the LView before checking
if it is an array. This causes issues with services that only allow calls to
properties that are defined on the service (backed by a strict ES6 proxy).
A check if the type is Array first corrects this issue.

fixes issue rangle/angular-devtools#802
2021-05-23 10:59:48 -07:00
AleksanderBodurri
ded6796efb fix(devtools): prevent directive forest hooks from being initiated in production applications 2021-05-20 21:18:45 -07:00
mgechev
85f2212796 fix(devtools): wrong label in the profiler 2021-05-19 05:22:49 -07:00
Renovate Bot
7ecc547fdb build(devtools): update angular-framework 2021-05-17 18:29:07 -07:00
mgechev
614919fd61 fix(devtools): use the aio docs link rather than github 2021-05-12 16:38:22 -07:00
mgechev
06efd995fb build(devtools): consistent branding 2021-05-11 15:35:04 -07:00
mgechev
de5c669ebe fix(devtools): breadcrumb algorithm when there is no parent available 2021-05-11 08:38:18 -07:00
mgechev
f8bd3fccd7 fix(devtools): preserve proper nesting in flattened node lists
Rather than naively filter the flattened list, preserve the nesting by
filtering the original tree.
2021-05-11 08:38:18 -07:00
mgechev
681feff8d0 fix(devtools): recognize app after reopening devtools
Previously, Angular DevTools did not recognize the Angular application the second time the user reopens the extension tab. Webpack was preventing us to invoke twice a module with the same name. This PR changes the `content-script` to a library, allowing us to invoke it multiple times.
2021-05-11 08:38:07 -07:00
mgechev
26d1d3df1c refactor(devtools): remove log statements and update styles when no ng app found 2021-05-11 08:38:07 -07:00
AleksanderBodurri
b411ec64ed feat(devtools): expand node ancestors on component inspection
Previously if a component was inspected with the component inspector and that component was collapsed in the component explorer, the component would be selected but would not be viewable until the explorer was manually expanded.
Now ancestors are expanded on component inspection.
2021-05-10 20:32:37 -07:00
AleksanderBodurri
9344cb7dfc feat(devtools): focus search input when icon is clicked
Previously, clicking the search icon on the component explorer did nothing. Now it focuses search input on click.
2021-05-10 17:02:44 -07:00
Minko Gechev
fab8d018b4 refactor(devtools): better naming and removal of log statement (rangle/angular-devtools#753) 2021-05-10 17:29:16 -04:00
Sumit Arora
ee7bc547d1 feat(devtools): adding tooltips for icons 2021-05-10 13:02:18 -07:00
mgechev
a7f6562158 fix(devtools): get all the property names including getters
This PR intentionally ignores `Symbol`s because their serialization and deserialization will include extra complexity.

The changes also improve the typings in the continuation function that's passed during serialization.
2021-05-04 17:29:59 -07:00
mgechev
df32c6e11e fix(devtools): improve the styles in the meta popup 2021-05-04 17:21:49 -07:00
mgechev
ee0c245b44 fix(devtools): proper dev mode detection when app compiled with closure 2021-05-04 17:21:49 -07:00
Emma Twersky
8728f6f578 fix(devtools): doc links icon (rangle/angular-devtools#742) 2021-05-04 16:55:26 -07:00
Sumit Arora
9872baa24f feat(devtools): adding info popup (rangle/angular-devtools#739)
* feat: adding info popup

* Update projects/ng-devtools/src/lib/devtools-tabs/devtools-tabs.component.html

Co-authored-by: Minko Gechev <mgechev@gmail.com>
2021-05-03 16:13:23 -07:00
mgechev
5af0aaddb0 refactor(devtools): use material icons in popups 2021-05-03 15:48:01 -07:00
mgechev
cf682b59b5 fix(devtools): set proper icon sizes 2021-05-03 15:48:01 -07:00
mgechev
89e495dfff build(devtools): update scripts and manifest 2021-05-03 15:48:01 -07:00
AleksanderBodurri
e85d65d26a fix(devtools): disable router tree tab
Previously the router parser uses private APIs to create the visualization for the router tree tab. Now the router parser always returns an empty router tree, effectively disabling the router tree tab until the necessary framework APIs are developed.
2021-05-03 15:47:47 -07:00
Sumit Arora
8c9645849a feat(devtools): updating to karma-coverage and setting clear context to true 2021-05-03 15:43:45 -07:00
AleksanderBodurri
6f338f7066 feat(devtools): implement drag to scroll functionality to improve frame navigation (rangle/angular-devtools#716) 2021-04-30 17:03:10 -07:00
mgechev
9d9518e67e feat(devtools): implement negation in the filtering query language 2021-04-29 10:25:35 -07:00
mgechev
ecfc03a2d2 feat(devtools): don't show comment nodes by default 2021-04-29 10:25:16 -07:00