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.
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.
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
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.
Fixrangle/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.
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.
