From 8357a1d237bf40b31358713eb1f782fb40383773 Mon Sep 17 00:00:00 2001 From: Aashish Sharma Date: Wed, 18 Oct 2023 13:53:51 +0530 Subject: [PATCH] mgr/dashboard: add frontend unit tests for rgw multisite sync status card Fixes: https://tracker.ceph.com/issues/64039 Signed-off-by: Aashish Sharma (cherry picked from commit d169a206d11283428f7eb74a928525bc93f58915) --- .../rgw-sync-data-info.component.spec.ts | 53 +++++++++++++++++- .../rgw-sync-metadata-info.component.spec.ts | 54 ++++++++++++++++++- .../rgw-sync-primary-zone.component.spec.ts | 17 ++++++ 3 files changed, 121 insertions(+), 3 deletions(-) diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-sync-data-info/rgw-sync-data-info.component.spec.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-sync-data-info/rgw-sync-data-info.component.spec.ts index 1c7ce8a78657b..944435cba16ac 100644 --- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-sync-data-info/rgw-sync-data-info.component.spec.ts +++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-sync-data-info/rgw-sync-data-info.component.spec.ts @@ -1,15 +1,17 @@ -import { ComponentFixture, TestBed } from '@angular/core/testing'; +import { ComponentFixture, TestBed, fakeAsync } from '@angular/core/testing'; import { RgwSyncDataInfoComponent } from './rgw-sync-data-info.component'; import { NgbPopoverModule } from '@ng-bootstrap/ng-bootstrap'; import { configureTestBed } from '~/testing/unit-test-helper'; +import { RelativeDatePipe } from '~/app/shared/pipes/relative-date.pipe'; +import { By } from '@angular/platform-browser'; describe('RgwSyncDataInfoComponent', () => { let component: RgwSyncDataInfoComponent; let fixture: ComponentFixture; configureTestBed({ - declarations: [RgwSyncDataInfoComponent], + declarations: [RgwSyncDataInfoComponent, RelativeDatePipe], imports: [NgbPopoverModule] }); @@ -22,4 +24,51 @@ describe('RgwSyncDataInfoComponent', () => { it('should create', () => { expect(component).toBeTruthy(); }); + + it('should display "Up to Date" badge when zone is up to date', () => { + component.zone = { + timestamp: null + }; + fixture.detectChanges(); + const upToDateBadge = fixture.debugElement.query(By.css('.badge-success')); + expect(upToDateBadge).toBeTruthy(); + expect(upToDateBadge.nativeElement.textContent).toEqual('Up to Date'); + }); + + it('should display correct sync status and last synced time', fakeAsync(() => { + component.zone = { syncstatus: 'Syncing', timestamp: new Date(Date.now() - 10 * 60 * 1000) }; + fixture.detectChanges(); + + const statusElement = fixture.debugElement.query(By.css('li b')); + expect(statusElement.nativeElement.textContent).toContain('Status:'); + + const lastSyncedElement = fixture.debugElement.query(By.css('li.mt-4.fw-bold')); + expect(lastSyncedElement.nativeElement.textContent).toContain('Last Synced:'); + const lastSyncedTimestamp = fixture.debugElement.query(By.css('.badge-info')); + expect(lastSyncedTimestamp.nativeElement.textContent).toEqual('10 minutes ago'); + })); + + it('should display sync status in the popover', () => { + component.zone = { + syncstatus: 'Syncing', + timestamp: new Date(Date.now() - 10 * 60 * 1000), + fullSyncStatus: [ + 'full sync: 0/128 shards', + 'incremental sync:128/128 shards', + 'Data is behind on 31 shards' + ] + }; + fixture.detectChanges(); + const syncStatus = fixture.debugElement.query(By.css('.text-primary')); + expect(syncStatus).toBeTruthy(); + expect(syncStatus.nativeElement.textContent).toEqual('Syncing'); + const syncPopover = fixture.debugElement.query(By.css('a')); + syncPopover.triggerEventHandler('click', null); + fixture.detectChanges(); + expect(syncPopover).toBeTruthy(); + const syncPopoverText = fixture.debugElement.query(By.css('.text-center')); + expect(syncPopoverText.nativeElement.textContent).toEqual( + 'Sync Status:Full Sync:0/128 Shards Incremental Sync:128/128 Shards: Data Is Behind On 31 Shards' + ); + }); }); diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-sync-metadata-info/rgw-sync-metadata-info.component.spec.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-sync-metadata-info/rgw-sync-metadata-info.component.spec.ts index df3748b175b35..0b7e4ede377dc 100644 --- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-sync-metadata-info/rgw-sync-metadata-info.component.spec.ts +++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-sync-metadata-info/rgw-sync-metadata-info.component.spec.ts @@ -3,13 +3,15 @@ import { ComponentFixture, TestBed } from '@angular/core/testing'; import { RgwSyncMetadataInfoComponent } from './rgw-sync-metadata-info.component'; import { NgbPopoverModule } from '@ng-bootstrap/ng-bootstrap'; import { configureTestBed } from '~/testing/unit-test-helper'; +import { By } from '@angular/platform-browser'; +import { RelativeDatePipe } from '~/app/shared/pipes/relative-date.pipe'; describe('RgwSyncMetadataInfoComponent', () => { let component: RgwSyncMetadataInfoComponent; let fixture: ComponentFixture; configureTestBed({ - declarations: [RgwSyncMetadataInfoComponent], + declarations: [RgwSyncMetadataInfoComponent, RelativeDatePipe], imports: [NgbPopoverModule] }); @@ -22,4 +24,54 @@ describe('RgwSyncMetadataInfoComponent', () => { it('should create', () => { expect(component).toBeTruthy(); }); + + it('should display "Up to Date" badge when zone is up to date', () => { + component.metadataSyncInfo = { + timestamp: null + }; + fixture.detectChanges(); + const upToDateBadge = fixture.debugElement.query(By.css('.badge-success')); + expect(upToDateBadge).toBeTruthy(); + expect(upToDateBadge.nativeElement.textContent).toEqual('Up to Date'); + }); + + it('should display correct sync status and last synced time', () => { + component.metadataSyncInfo = { + syncstatus: 'Syncing', + timestamp: new Date(Date.now() - 10 * 60 * 1000) + }; + fixture.detectChanges(); + + const statusElement = fixture.debugElement.query(By.css('li b')); + expect(statusElement.nativeElement.textContent).toContain('Status:'); + + const lastSyncedElement = fixture.debugElement.query(By.css('li.mt-4.fw-bold')); + expect(lastSyncedElement.nativeElement.textContent).toContain('Last Synced:'); + const lastSyncedTimestamp = fixture.debugElement.query(By.css('.badge-info')); + expect(lastSyncedTimestamp.nativeElement.textContent).toEqual('10 minutes ago'); + }); + + it('should display sync status in the popover', () => { + component.metadataSyncInfo = { + syncstatus: 'Syncing', + timestamp: new Date(Date.now() - 10 * 60 * 1000), + fullSyncStatus: [ + 'full sync:0/128 shards', + 'incremental sync:128/128 shards', + 'Data is behind on 31 shards' + ] + }; + fixture.detectChanges(); + const syncStatus = fixture.debugElement.query(By.css('.text-primary')); + expect(syncStatus).toBeTruthy(); + expect(syncStatus.nativeElement.textContent).toEqual('Syncing'); + const syncPopover = fixture.debugElement.query(By.css('a')); + syncPopover.triggerEventHandler('click', null); + fixture.detectChanges(); + expect(syncPopover).toBeTruthy(); + const syncPopoverText = fixture.debugElement.query(By.css('.text-center')); + expect(syncPopoverText.nativeElement.textContent).toEqual( + 'Metadata Sync Status:Full Sync:0/128 Shards Incremental Sync:128/128 Shards Data Is Behind On 31 Shards' + ); + }); }); diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-sync-primary-zone/rgw-sync-primary-zone.component.spec.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-sync-primary-zone/rgw-sync-primary-zone.component.spec.ts index aefb32794a71c..1bce83fcc5a6f 100644 --- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-sync-primary-zone/rgw-sync-primary-zone.component.spec.ts +++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-sync-primary-zone/rgw-sync-primary-zone.component.spec.ts @@ -2,6 +2,7 @@ import { ComponentFixture, TestBed } from '@angular/core/testing'; import { RgwSyncPrimaryZoneComponent } from './rgw-sync-primary-zone.component'; import { configureTestBed } from '~/testing/unit-test-helper'; +import { By } from '@angular/platform-browser'; describe('RgwSyncPrimaryZoneComponent', () => { let component: RgwSyncPrimaryZoneComponent; @@ -20,4 +21,20 @@ describe('RgwSyncPrimaryZoneComponent', () => { it('should create', () => { expect(component).toBeTruthy(); }); + + it('should display realm, zonegroup, and zone in badges', () => { + component.realm = 'Realm'; + component.zonegroup = 'Zonegroup'; + component.zone = 'Zone'; + fixture.detectChanges(); + + const realmBadge = fixture.debugElement.query(By.css('li:nth-child(2)')); + expect(realmBadge.nativeElement.textContent).toContain('Realm'); + + const zonegroupBadge = fixture.debugElement.query(By.css('p')); + expect(zonegroupBadge.nativeElement.textContent).toContain('Zonegroup'); + + const zoneBadge = fixture.debugElement.query(By.css('li:nth-child(8)')); + expect(zoneBadge.nativeElement.textContent).toContain('Zone'); + }); }); -- 2.39.5