From 83b8cebe4cbb0993acc3b4b59d2effa3fffdd0ec Mon Sep 17 00:00:00 2001 From: alfonsomthd Date: Wed, 10 Oct 2018 10:02:18 +0200 Subject: [PATCH] mgr/dashboard: Landing Page: info group visibility Do not display info groups not containing any card. Fixes: https://tracker.ceph.com/issues/27047 MIME-Version: 1.0 Content-Type: text/plain; charset=utf8 Content-Transfer-Encoding: 8bit Signed-off-by: Alfonso Martínez --- .../dashboard/health/health.component.html | 36 ++++++--- .../dashboard/health/health.component.spec.ts | 73 ++++++++++++++++++- 2 files changed, 95 insertions(+), 14 deletions(-) diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/dashboard/health/health.component.html b/src/pybind/mgr/dashboard/frontend/src/app/ceph/dashboard/health/health.component.html index 54b5bbe3f79eb..75dcb37962f12 100644 --- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/dashboard/health/health.component.html +++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/dashboard/health/health.component.html @@ -2,14 +2,22 @@ class="container-fluid"> + class="row info-group" + *ngIf="contentData.health?.status + || contentData.mon_status + || contentData.osd_map + || contentData.mgr_map + || contentData.hosts != null + || contentData.rgw != null + || contentData.fs_map + || contentData.iscsi_daemons != null"> - + [contentClass]="contentData.health?.checks?.length > 0 ? 'content-highlight content-row-size-1-5' : 'content-highlight'" + *ngIf="contentData.health?.status"> +

@@ -33,7 +41,7 @@ {{ contentData.health.status }} - +

{{ contentData.health.status }}
@@ -73,7 +81,7 @@ link="/hosts" class="col-sm-6 col-md-4 col-lg-3" contentClass="content-medium content-highlight" - *ngIf="contentData.hosts !== undefined"> + *ngIf="contentData.hosts != null"> {{ contentData.hosts }} @@ -82,7 +90,7 @@ link="/rgw/daemon" class="col-sm-6 col-md-4 col-lg-3" contentClass="content-medium content-highlight" - *ngIf="contentData.rgw !== undefined"> + *ngIf="contentData.rgw != null"> {{ contentData.rgw }} + *ngIf="contentData.iscsi_daemons != null"> {{ contentData.iscsi_daemons }} + class="row info-group" + *ngIf="contentData.client_perf || contentData.scrub_status"> +
+ class="row info-group" + *ngIf="contentData.pools + || contentData.df + || contentData.df?.stats?.total_objects != null + || contentData.pg_info">
+ *ngIf="contentData.df?.stats?.total_objects != null"> {{ contentData.df?.stats?.total_objects }} diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/dashboard/health/health.component.spec.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/dashboard/health/health.component.spec.ts index 85e6c8eb7ac2b..29ee634c59ed4 100644 --- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/dashboard/health/health.component.spec.ts +++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/dashboard/health/health.component.spec.ts @@ -2,6 +2,7 @@ import { HttpClientTestingModule } from '@angular/common/http/testing'; import { NO_ERRORS_SCHEMA } from '@angular/core'; import { ComponentFixture, TestBed } from '@angular/core/testing'; +import * as _ from 'lodash'; import { PopoverModule } from 'ngx-bootstrap/popover'; import { of } from 'rxjs'; @@ -22,7 +23,7 @@ describe('HealthComponent', () => { let fixture: ComponentFixture; let getHealthSpy; const healthPayload = { - health: { status: 'HEALTH_OK', checks: [] }, + health: { status: 'HEALTH_OK' }, mon_status: { monmap: { mons: [] }, quorum: [] }, osd_map: { osds: [] }, mgr_map: { standbys: [] }, @@ -56,7 +57,7 @@ describe('HealthComponent', () => { beforeEach(() => { fixture = TestBed.createComponent(HealthComponent); component = fixture.componentInstance; - getHealthSpy = spyOn(fixture.debugElement.injector.get(DashboardService), 'getHealth'); + getHealthSpy = spyOn(TestBed.get(DashboardService), 'getHealth'); }); it('should create', () => { @@ -74,10 +75,76 @@ describe('HealthComponent', () => { expect(infoCards.length).toBe(18); }); + it('should render all except "Status" group and cards', () => { + const payload = _.cloneDeep(healthPayload); + payload.health.status = ''; + payload.mon_status = null; + payload.osd_map = null; + payload.mgr_map = null; + payload.hosts = null; + payload.rgw = null; + payload.fs_map = null; + payload.iscsi_daemons = null; + + getHealthSpy.and.returnValue(of(payload)); + fixture.detectChanges(); + + const infoGroups = fixture.debugElement.nativeElement.querySelectorAll('cd-info-group'); + expect(infoGroups.length).toBe(2); + + const infoCards = fixture.debugElement.nativeElement.querySelectorAll('cd-info-card'); + expect(infoCards.length).toBe(10); + }); + + it('should render all except "Performance" group and cards', () => { + const payload = _.cloneDeep(healthPayload); + payload.scrub_status = ''; + payload.client_perf = null; + + getHealthSpy.and.returnValue(of(payload)); + fixture.detectChanges(); + + const infoGroups = fixture.debugElement.nativeElement.querySelectorAll('cd-info-group'); + expect(infoGroups.length).toBe(2); + + const infoCards = fixture.debugElement.nativeElement.querySelectorAll('cd-info-card'); + expect(infoCards.length).toBe(13); + }); + + it('should render all except "Capacity" group and cards', () => { + const payload = _.cloneDeep(healthPayload); + payload.pools = null; + payload.df = null; + payload.pg_info = null; + + getHealthSpy.and.returnValue(of(payload)); + fixture.detectChanges(); + + const infoGroups = fixture.debugElement.nativeElement.querySelectorAll('cd-info-group'); + expect(infoGroups.length).toBe(2); + + const infoCards = fixture.debugElement.nativeElement.querySelectorAll('cd-info-card'); + expect(infoCards.length).toBe(13); + }); + + it('should render all groups and 1 card per group', () => { + const payload = { hosts: 0, scrub_status: 'Inactive', pools: [] }; + + getHealthSpy.and.returnValue(of(payload)); + fixture.detectChanges(); + + const infoGroups = fixture.debugElement.nativeElement.querySelectorAll('cd-info-group'); + expect(infoGroups.length).toBe(3); + + _.each(infoGroups, (infoGroup) => { + expect(infoGroup.querySelectorAll('cd-info-card').length).toBe(1); + }); + }); + // @TODO: remove this test when logs are no longer in landing page // See https://tracker.ceph.com/issues/24571 & https://github.com/ceph/ceph/pull/23834 it('should render Logs group & cards in addition to the other ones', () => { - const payload = healthPayload; + const payload = _.cloneDeep(healthPayload); payload['clog'] = []; payload['audit_log'] = []; -- 2.39.5