skills/angular__angular
1
0
Fork 0
mirror of https://github.com/angular/angular.git synced 2026-09-14 13:54:52 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(devtools): fix edge case where only one item is profiled and where no items are profiled

Browse Source
This commit is contained in:
AleksanderBodurri
2020-03-11 14:08:25 -04:00
committed by Minko Gechev
parent 5233155bd0
commit 0649cc485d
1 changed files with 46 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files
projects/ng-devtools/src/lib/devtools-tabs/directive-explorer/profiler/recording/timeline/timeline.component.html
+46 -31
View File
@@ -1,34 +1,49 @@
<div class="controls">
<button mat-stroked-button (click)="exportProfile.emit()">Export to JSON</button>
<mat-slider
[max]="profileRecords.timeline.length - 1"
[min]="1"
[(ngModel)]="currentView"
(change)="updateView($event)"
></mat-slider>
&nbsp;
<button mat-stroked-button (click)="move(-1)"><</button><button mat-stroked-button (click)="move(1)">></button>
&nbsp;
<label
[class.warning-no]="recordsView.timeSpent < 16"
[class.warning-low]="recordsView.timeSpent >= 16"
[class.warning-mid]="recordsView.timeSpent >= 32"
[class.warning-high]="recordsView.timeSpent >= 64"
>
Time spent: {{ recordsView.timeSpent | number }} ms
</label>
<ng-container *ngIf="profileRecords.timeline.length > 1; else resultsWithoutControls">
<ng-container *ngTemplateOutlet="recordView; context: { record: recordsView, showControls: true }"></ng-container>
</ng-container>
<ng-template #resultsWithoutControls>
<ng-container *ngIf="profileRecords.timeline.length === 1; else noRecords">
<ng-container *ngTemplateOutlet="recordView; context: { record: profileRecords.timeline[0] }"></ng-container>
</ng-container>
<ng-template #noRecords>
Nothing was profiled
</ng-template>
</ng-template>
<label
[class.warning-no]="recordsView.timeSpent < 16"
[class.warning-low]="recordsView.timeSpent >= 16"
[class.warning-mid]="recordsView.timeSpent >= 32"
[class.warning-high]="recordsView.timeSpent >= 64"
*ngIf="frameRate(recordsView.timeSpent) < 64"
>
Frame rate: {{ frameRate(recordsView.timeSpent) }} fps
</label>
<ng-template let-record="record" let-showControls="showControls" #recordView>
<div class="controls">
<button mat-stroked-button (click)="exportProfile.emit()">Export to JSON</button>
<ng-container *ngIf="showControls">
<mat-slider
[max]="profileRecords.timeline.length - 1"
[min]="1"
[(ngModel)]="currentView"
(change)="updateView($event)"
></mat-slider>
&nbsp;
<button mat-stroked-button (click)="move(-1)"><</button>
<button mat-stroked-button (click)="move(1)">></button>
</ng-container>
<label *ngIf="recordsView.source">Source: {{ recordsView.source }}</label>
</div>
<label
[class.warning-no]="record.timeSpent < 16"
[class.warning-low]="record.timeSpent >= 16"
[class.warning-mid]="record.timeSpent >= 32"
[class.warning-high]="record.timeSpent >= 64"
>
Time spent: {{ record.timeSpent | number }} ms
</label>
<ng-recording-visualizer [bars]="recordsView.app"></ng-recording-visualizer>
<label
[class.warning-no]="record.timeSpent < 16"
[class.warning-low]="record.timeSpent >= 16"
[class.warning-mid]="record.timeSpent >= 32"
[class.warning-high]="record.timeSpent >= 64"
*ngIf="frameRate(record.timeSpent) < 64"
>
Frame rate: {{ frameRate(record.timeSpent) }} fps
</label>
<label *ngIf="record.source">Source: {{ record.source }}</label>
</div>
<ng-recording-visualizer [bars]="record.app"></ng-recording-visualizer>
</ng-template>