mgr/dashboard: New Landing Page: Milestone 2

Added tests for InfoCard & InfoGroup components.

Fixes: https://tracker.ceph.com/issues/27050
Signed-off-by: Alfonso Martínez <almartin@redhat.com>

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/dashboard/info-card/info-card.component.spec.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/dashboard/info-card/info-card.component.spec.ts
index 70a98416d0c2d4d566afa799db8aff5d394ebe85..f5492508d1d39f33cc19ac94757d9cc672ed9cf8 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/dashboard/info-card/info-card.component.spec.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/dashboard/info-card/info-card.component.spec.ts
@@ -17,10 +17,50 @@ describe('InfoCardComponent', () => {
   beforeEach(() => {
     fixture = TestBed.createComponent(InfoCardComponent);
     component = fixture.componentInstance;
-    fixture.detectChanges();
   });
 
   it('should create', () => {
     expect(component).toBeTruthy();
   });
+
+  it('Setting cardTitle makes title visible', () => {
+    const cardTitle = 'Card Title';
+    component.cardTitle = cardTitle;
+    fixture.detectChanges();
+    const titleDiv = fixture.debugElement.nativeElement.querySelector('.card-title');
+
+    expect(titleDiv.textContent).toContain(cardTitle);
+  });
+
+  it('Setting link makes anchor visible', () => {
+    const cardTitle = 'Card Title';
+    const link = '/dashboard';
+    component.cardTitle = cardTitle;
+    component.link = link;
+    fixture.detectChanges();
+    const anchor = fixture.debugElement.nativeElement
+      .querySelector('.card-title')
+      .querySelector('a');
+
+    expect(anchor.textContent).toContain(cardTitle);
+    expect(anchor.href).toBe(`http://localhost${link}`);
+  });
+
+  it('Setting cardClass makes class set', () => {
+    const cardClass = 'my-css-card-class';
+    component.cardClass = cardClass;
+    fixture.detectChanges();
+    const card = fixture.debugElement.nativeElement.querySelector(`.card.${cardClass}`);
+
+    expect(card).toBeTruthy();
+  });
+
+  it('Setting contentClass makes class set', () => {
+    const contentClass = 'my-css-content-class';
+    component.contentClass = contentClass;
+    fixture.detectChanges();
+    const card = fixture.debugElement.nativeElement.querySelector(`.card-body.${contentClass}`);
+
+    expect(card).toBeTruthy();
+  });
 });

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/dashboard/info-card/info-card.component.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/dashboard/info-card/info-card.component.ts
index 8bb7f8ed2e232c45d1ffb0cdc5779ccbed66b047..fdcbe2ecea51d4046ebbd7a57108254e6a463cb0 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/dashboard/info-card/info-card.component.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/dashboard/info-card/info-card.component.ts
@@ -13,7 +13,5 @@ export class InfoCardComponent {
   @Input()
   cardClass = '';
   @Input()
-  imageClass: string;
-  @Input()
   contentClass: string;
 }

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/dashboard/info-group/info-group.component.spec.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/dashboard/info-group/info-group.component.spec.ts
index 22944038a6169de4a2c7d5c620b1cbbd0bfa0b0c..0bb0abb5c452afca7875e7cf9ff5028ea8a72727 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/dashboard/info-group/info-group.component.spec.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/dashboard/info-group/info-group.component.spec.ts
@@ -15,10 +15,18 @@ describe('InfoGroupComponent', () => {
   beforeEach(() => {
     fixture = TestBed.createComponent(InfoGroupComponent);
     component = fixture.componentInstance;
-    fixture.detectChanges();
   });
 
   it('should create', () => {
     expect(component).toBeTruthy();
   });
+
+  it('Setting groupTitle makes title visible', () => {
+    const groupTitle = 'Group Title';
+    component.groupTitle = groupTitle;
+    fixture.detectChanges();
+    const titleDiv = fixture.debugElement.nativeElement.querySelector('.info-group-title');
+
+    expect(titleDiv.textContent).toContain(groupTitle);
+  });
 });