Commit graph

174 commits

Author SHA1 Message Date
AleksanderBodurri
d260ca3091 feat(core): emit template function for template related profiler hooks (#60174)
Previously, the profiler would only emit the specific template event and context when a template is created/updated, but not the template function related to the event.

This commit emits this function by using the third argument of the profiler function, which previously was only used for lifecycle hooks and output listeners. This commit also renames this arg to eventFn to express that it varies depending on the event type emitting from the profiler.

Note: this change is fully backwards compatible, since previously these template events did not use the third arg of the profiler function.

PR Close #60174
2025-03-03 22:03:44 +00:00
Doug Parker
d9af1bbf52 release: bump Angular DevTools version to 1.0.24 (#60148)
PR Close #60148
2025-03-03 17:12:23 +00:00
hawkgs
c2a46d2217 refactor(devtools): use more appropriate cursor types while panning in the tree vis (#60141)
Use `grab` and `grabbing` cursors while panning. They are the de facto standard.

PR Close #60141
2025-02-27 18:31:02 +00:00
hawkgs
b07010087a fix(devtools): minor UI/UX improvements of the Injector Providers panel (#59531)
- The token rendered in the first col of the table is now being truncated in favor of the horizontal scroll of the panel which should make the log button accessible/visible all the time
- Introduced a "No such providers" label when a filter is applied
- The icon of the logProvider button has been substituted with `code` (as per the doc)
- The font size and width of the provider type filter have been slightly improved

PR Close #59531
2025-02-26 12:34:40 -05:00
hawkgs
911a210ff0 refactor(devtools): introduce tree-visualizer-host (#59916)
The purpose of this component is purely to encapsulate and offload the styles from `devtools.component.scss` since it wasn't very clear what their scope is.

PR Close #59916
2025-02-26 12:18:06 -05:00
lilbeqiri
9ed4b54166 feat(devtools): add the onpush label for marked onpush components in the components tree view (#60059)
For components that are marked as onpush, a label will be displayed in the components tree view.

PR Close #60059
2025-02-26 11:20:22 -05:00
hawkgs
a0f37224c3 refactor(devtools): use new theme mixins in the stylesheets (#59978)
Use the newly introduced theme mixins in the stylesheets.

PR Close #59978
2025-02-25 14:15:16 -05:00
hawkgs
e970ad0cdb refactor(devtools): redesign dependency resolution path visualization (#60011)
Use the new UI and drop the `InjectorTreeVisualizer` dependency. Additionally, use concrete values for `SerializedInjector.type` type instead of `string`.

PR Close #60011
2025-02-25 14:07:06 -05:00
hawkgs
1618595473 refactor(devtools): drop @ from inputs and outputs label (#60053)
Drop '@' from inputs and outputs label to fit in with the new signal-based API.

PR Close #60053
2025-02-24 10:49:12 -05:00
hawkgs
c513e5dc2b refactor(devtools): fix component inspector highlighting (#59995)
Use `position: absolute` instead of `position: fixed`. This fixes the odd behavior that can be reproduced when scrolling.

PR Close #59995
2025-02-20 11:56:08 -05:00
Doug Parker
dcb23ef706 release: bump Angular DevTools version to 1.0.23 (#59931)
PR Close #59931
2025-02-14 16:31:37 +00:00
Doug Parker
adf2a0a2d6 release: bump Angular DevTools version to 1.0.22 (#59791)
PR Close #59791
2025-02-13 14:50:39 +00:00
hawkgs
4f3ad98466 refactor(devtools): styles management (#59589)
- Move all styles to ng-devtools/src/styles.
- Create a BrowserService that detects the browsers and adds it as a class to the body. Move global browser styles.
- Create theme mixins that incorporate the browser type into them.
- Refactor some of the affected code along with the introduced changes.

PR Close #59589
2025-02-12 10:47:02 -08:00
AleksanderBodurri
28dd04a866 fix(devtools): regressions in component tree (#59873)
This commit solves two cases

Bug: When a directive of the same name is selected, the property view tab would not update properly. This was caused by a signals refactor that changed the behaviour of a string input property to not re-render because the underlying signal did not change (string equality). This is fixed by converting this input into an object.

Bug: When a selected element is removed from the component tree, DevTools would not rerender the component tree properly and deselect that component. Now if DevTools detects that a component is removed, it re-renders the tree and deselects the component.

PR Close #59873
2025-02-12 09:22:28 -08:00
hawkgs
6ce8ed7404 refactor(devtools): select the root element by default (#59626)
Select the application root element when you start Angular DevTools.

PR Close #59626
2025-01-22 13:34:40 -08:00
Pawel Kozlowski
db745cd75f test(devtools): disable flaky highlighter test (#59561)
The test in question was very flaky on CI, example run:
https://github.com/angular/angular/actions/runs/12805645683/job/35702462974?pr=59557

Disabling as it is causing productivity loose for the team.

PR Close #59561
2025-01-16 12:19:39 +01:00
Doug Parker
c9eaf53b4f release: bump Angular DevTools version to 1.0.21 (#59548)
PR Close #59548
2025-01-15 16:48:00 -08:00
Pawel Kozlowski
9c835e89fe refactor(core): profiler takes null as a default instance (#59233)
Several profiler calls don't have any meaningful instance when
producing a profiling event. This commit changes the default
instance value to null to sreamline profiler invocations.

PR Close #59233
2025-01-14 12:35:21 -05:00
Andrew Kushnir
412ac303bc Revert "refactor(core): profiler takes null as a default instance (#59233)" (#59506)
This reverts commit c4ad8fb2e7.

PR Close #59506
2025-01-13 17:03:36 -05:00
hawkgs
0bb81c5ab4 feat(devtools): tone down obtrusive elements in the Injector Tree tab (#59499)
Some of the elements are a bit too large so they have been shrunken to fit in with the rest of the UI.

PR Close #59499
2025-01-13 15:06:24 -05:00
AleksanderBodurri
065e1187fc fix(devtools): remove property tab css that is hiding directive metadata (#59493)
It looks like this height property was redundant prior to upgrading to angular/material 19.1.0-rc.0. An interaction between this property and that update caused elements inside of material expansion panels to be hidden.

This PR removes this unnecessary height assignment entirely.

PR Close #59493
2025-01-13 14:48:01 -05:00
Pawel Kozlowski
c4ad8fb2e7 refactor(core): profiler takes null as a default instance (#59233)
Several profiler calls don't have any meaningful instance when
producing a profiling event. This commit changes the default
instance value to null to sreamline profiler invocations.

PR Close #59233
2025-01-13 10:52:19 -05:00
Doug Parker
c1bc06c337 release: bump Angular DevTools version to 1.0.20 (#59454)
PR Close #59454
2025-01-09 15:41:54 -05:00
Sumit Arora
a55575d4d6 fix(devtools): fixing dark mode colors for devtools and router tree (#59329)
added dark mode colors for devtools and router tree  and fixed the router tree legend rerendering issue

PR Close #59329
2025-01-09 10:32:41 -05:00
RafaelJCamara
5c9e84acd6 docs: update license URL from angular.io to angular.dev and year of license to 2025 (#59407)
PR Close #59407
2025-01-09 10:27:54 -05:00
Johnson Chu
9b8f699032 refactor: remove unnecessary // tslint:disable rule flags in devtools (#59365)
Files in the vendor directory have been excluded in tslint.json.

PR Close #59365
2025-01-07 16:06:21 +00:00
Johnson Chu
a6cdbec09f refactor: remove unnecessary TSLint rule flags (#59365)
There are many TSLint rule flags in the source code that have no effect, and they can be safely removed to keep the code clean.

PR Close #59365
2025-01-07 16:06:21 +00:00
Sheik Althaf
d0cd74ace7 refactor(devtools): use signals for template properties in frame manager (#58818)
convert the frames and selectedFrame properties to signal so that it can react to changes on OnPush

PR Close #58818
2025-01-06 16:22:01 +00:00
Pawel Kozlowski
22f191f763 feat(core): extend the set of profiler events (#59183)
This commit extends the set of events understood by the
profiler integrated with the Angular time. The set got
extended to account for the recently added functionality
and mark entry point to the code execution points.

The new set of events can be visualised by the Angular
DevTools or other profiler integrations.

PR Close #59183
2024-12-18 09:34:06 -08:00
Doug Parker
9b0aab9b8c release: bump Angular DevTools version to 1.0.19 (#59225)
PR Close #59225
2024-12-17 12:46:39 -08:00
Sumit Arora
42b1662ae8 refactor(devtools): removing unused styles and addressing PR comments (#58213)
- removed unused styles
- refactored tests and adding types

PR Close #58213
2024-12-03 09:16:25 +01:00
Sumit Arora
ef10d528ed refactor(devtools): adds router graph implementation and demo (#58213)
Follow-up PR for https://github.com/angular/angular/pull/58086 & https://github.com/angular/angular/pull/58199.

Adds below features to Angular DevTools to display router graph:
- Add a new router example in the Angular DevTools demo application.
- Implement the router graph in the Angular DevTools to view the routes that are loaded in the application.

PR Close #58213
2024-12-03 09:16:25 +01:00
Sheik Althaf
96c90a5012 refactor(devtools): removed standalone: true (#58922)
Removed the default standalone true flag from all the component, directive and pipes

PR Close #58922
2024-11-27 18:09:00 +01:00
Sheik Althaf
f8e5119435 refactor(devtools): migrate devtools to prettier formatting (#58624)
Added html and scss to ng-dev formatter. This is reduce the formatting changes coming in PRs.

PR Close #58624
2024-11-19 16:31:24 -08:00
Sheik Althaf
ff734fd3ef refactor(devtools): use reactive APIs for queries and linkedSignal (#58464)
migrated the viewChild to signal api and used linkedSignal in place of effect and little code refactoring

PR Close #58464
2024-11-11 19:01:18 +00:00
Sheik Althaf
ca9998c6cf refactor(devtools): convert to bootstrap application for shell and demo apps (#58319)
Migrated the demo apps and shell-browser apps to use bootstrap application, simplifed routing and standalone components.

PR Close #58319
2024-11-05 07:35:43 +01:00
Sheik Althaf
d98d7dc1ec refactor(devtools): use signal apis in profiler and frame-selector (#57558)
Refactor the profiler and frame-selector components to use signal apis, in future we can make the components onPush and zoneless

PR Close #57558
2024-10-28 12:28:25 -07:00
Alan Agius
7de7c52769 build: remove usages of useDefineForClassFields: false (#58297)
When setting `"useDefineForClassFields": false`, static fields are compiled within a block that relies on the `this` context. This output makes it more difficult for bundlers to treeshake and eliminate unused code.

PR Close #58297
2024-10-28 12:26:05 -07:00
Matthieu Riegler
30766d6b77 refactor(devtools): Migrate with the schematic. (#58160)
All components, directives and pipes will now use standalone as default. Non-standalone decorators have now .

PR Close #58160
2024-10-14 14:58:57 +00:00
Sheik Althaf
1e50374d75 fix(devtools): avoid duplicate dependencies in injected services (#57564)
with latest signal apis there are duplicates dependencies are shown in injected services, this PR filters the depdencies by token and value

PR Close #57564
2024-10-08 09:29:18 -07:00
Matthieu Riegler
74a2a449bd refactor(devtools): remove unused imports. (#58057)
Thanks to the new extended diagnostic.

PR Close #58057
2024-10-04 13:27:34 +00:00
Andres Olivares
bb46b6b051 refactor(devtools): Use chrome.devtools.performance types (#58015)
The chrome.devtools.performance types were added to the DefinitelyTyped
module and as such we don't need to make use of any to circumvent
the missing types.

See: https://github.com/DefinitelyTyped/DefinitelyTyped/pull/70231

PR Close #58015
2024-10-01 07:04:54 +00:00
Joey Perrott
9dbe6fc18b refactor: update license text to point to angular.dev (#57901)
Update license text to point to angular.dev instead of angular.io

PR Close #57901
2024-09-24 15:33:00 +02:00
AleksanderBodurri
9f4063b143 refactor(devtools): provide user with suggestions on why their angular application is not being detected in dev mode (#57861)
We've been seeing some reports about Angular DevTools being unable to detect applications running in dev mode.

This commit adds more context to the error message displayed when development mode is not detected and offers some possible resolutions.

Displays 3 common reasons why DevTools fails to detect an application running in dev mode. Links directly to angular.dev for relevant configurations.

Links to the Angular DevTools issue template if none of the suggestions work.

PR Close #57861
2024-09-23 16:08:16 +02:00
Sheik Althaf
8602729801 fix(devtools): remove existing highlight before highlighting another element (#57746)
In this PR we will remove the exiting highlight before highlighting the another element so that the highlight always be one

PR Close #57746
2024-09-23 16:00:23 +02:00
Sheik Althaf
4fa25cf328 refactor(devtools): use signal apis in visualizer and devtools-tabs (#57192)
Refactor the visualizer and devtools-tabs components to use signal apis, in future we can make the components onPush and zoneless

PR Close #57192
2024-09-05 17:23:34 +00:00
Sheik Althaf
7a4199a29a refactor(devtools): use signal apis for directive forest (#56998)
Refactor the directive-forest components to use signal apis, in future we can make the components onPush and zoneless

PR Close #56998
2024-09-04 21:00:12 +00:00
Doug Parker
1f87cba204 release: bump Angular DevTools version to 1.0.18 (#57585)
PR Close #57585
2024-09-03 10:43:21 -07:00
AleksanderBodurri
774d9832ab fix(devtools): correctly set environment injector path in the case where there are no element injectors (#57442)
Previously, when "Hide injectors with no providers" was toggled, it is possible for the injector tree visualizer to have no Element injectors to visualize. This caused a bug in the slicing logic that splits apart the environment and element injectors from DI resolution paths within the injector tree component in Angular DevTools.

Now, this logic is correctly handled when there are no element injectors to visualize.

PR Close #57442
2024-08-28 08:49:34 -07:00
AleksanderBodurri
99e40574cb fix(devtools): ignore DOM Nodes from other frames when performing render tree detection (#57518)
Previously, if an application had DOM Nodes injected into it from other frames, DevTools would fail to parse component trees with the render tree strategy properly because of an instanceof Node check that the framework performs.

Now we check for instanceof Node before even calling framework debug APIs on DOM nodes so that we can skip nodes that come from other frames entirely.

PR Close #57518
2024-08-27 13:19:35 -07:00