mgr/dashboard: Fix for copy2Clipboard failing to copy on the first time.

Fixes: https://tracker.ceph.com/issues/48601
Signed-off-by: Avan Thakkar <athakkar@redhat.com>
Fix for the copy2Clipboard button to work on the first click itself.

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/logs/logs.component.html b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/logs/logs.component.html
index b255854619b6b63ec3ce876f7c9bec3ac65c8952..ec56d3f25dcaa90f458aaedbcc5b4bccec5aef56 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/logs/logs.component.html
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/logs/logs.component.html
@@ -13,14 +13,13 @@
              *ngIf="clog">
           <div class="btn-group"
                role="group"
-               (click)="logToText(clog)"
                *ngIf="clog.length">
             <cd-download-button [objectItem]="clog"
-                                [textItem]="logText"
+                                [textItem]="clogText"
                                 fileName="cluster_log">
             </cd-download-button>
             <cd-copy-2-clipboard-button
-                    [source]="logText"
+                    [source]="clogText"
                     [byId]="false">
             </cd-copy-2-clipboard-button>
           </div>
@@ -44,14 +43,13 @@
              *ngIf="audit_log">
           <div class="btn-group"
                role="group"
-               (click)="logToText(audit_log)"
                *ngIf="audit_log.length">
             <cd-download-button [objectItem]="audit_log"
-                                [textItem]="logText"
+                                [textItem]="auditLogText"
                                 fileName="audit_log">
             </cd-download-button>
             <cd-copy-2-clipboard-button
-                    [source]="logText"
+                    [source]="auditLogText"
                     [byId]="false">
             </cd-copy-2-clipboard-button>
           </div>

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/logs/logs.component.spec.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/logs/logs.component.spec.ts
index 46ae4e90060d18833172f3dd04d94cc20a3db8a2..69c6051d2d3d77d4adf88296ebf7662d970c2788 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/logs/logs.component.spec.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/logs/logs.component.spec.ts
@@ -3,7 +3,10 @@ import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { FormsModule } from '@angular/forms';
 
 import { NgbDatepickerModule, NgbNavModule, NgbTimepickerModule } from '@ng-bootstrap/ng-bootstrap';
+import { ToastrModule } from 'ngx-toastr';
+import { of } from 'rxjs';
 
+import { LogsService } from '~/app/shared/api/logs.service';
 import { SharedModule } from '~/app/shared/shared.module';
 import { configureTestBed } from '~/testing/unit-test-helper';
 import { LogsComponent } from './logs.component';
@@ -11,6 +14,8 @@ import { LogsComponent } from './logs.component';
 describe('LogsComponent', () => {
   let component: LogsComponent;
   let fixture: ComponentFixture<LogsComponent>;
+  let logsService: LogsService;
+  let logsServiceSpy: jasmine.Spy;
 
   configureTestBed({
     imports: [
@@ -19,15 +24,18 @@ describe('LogsComponent', () => {
       SharedModule,
       FormsModule,
       NgbDatepickerModule,
-      NgbTimepickerModule
+      NgbTimepickerModule,
+      ToastrModule.forRoot()
     ],
     declarations: [LogsComponent]
   });
 
   beforeEach(() => {
+    logsService = TestBed.inject(LogsService);
+    logsServiceSpy = spyOn(logsService, 'getLogs');
+    logsServiceSpy.and.returnValue(of(null));
     fixture = TestBed.createComponent(LogsComponent);
     component = fixture.componentInstance;
-    fixture.detectChanges();
   });
 
   it('should create', () => {
@@ -133,4 +141,29 @@ describe('LogsComponent', () => {
       expect(component.clog[0].name).toBe('time');
     });
   });
+
+  describe('convert logs to text', () => {
+    it('convert cluster & audit logs to text', () => {
+      const logsPayload = {
+        clog: [
+          {
+            name: 'priority',
+            stamp: '2019-02-21 09:39:49.572801',
+            message: 'Manager daemon localhost is now available',
+            priority: '[ERR]'
+          }
+        ],
+        audit_log: [
+          {
+            stamp: '2020-12-22T11:18:13.896920+0000',
+            priority: '[INF]'
+          }
+        ]
+      };
+      logsServiceSpy.and.returnValue(of(logsPayload));
+      fixture.detectChanges();
+      expect(component.clogText).toContain(logsPayload.clog[0].message);
+      expect(component.auditLogText).toContain(logsPayload.audit_log[0].priority);
+    });
+  });
 });

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/logs/logs.component.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/logs/logs.component.ts
index 4b10ffad920e3330143a530b75b02444875f28d8..04375b1ef7c9606141f7b7fc966549ead13c9c28 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/logs/logs.component.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/logs/logs.component.ts
@@ -16,7 +16,8 @@ export class LogsComponent implements OnInit, OnDestroy {
   clog: Array<any>;
   audit_log: Array<any>;
   icons = Icons;
-  logText: string;
+  clogText: string;
+  auditLogText: string;
 
   interval: number;
   priorities: Array<{ name: string; value: string }> = [
@@ -61,6 +62,8 @@ export class LogsComponent implements OnInit, OnDestroy {
   getInfo() {
     this.logsService.getLogs().subscribe((data: any) => {
       this.contentData = data;
+      this.clogText = this.logToText(this.contentData.clog);
+      this.auditLogText = this.logToText(this.contentData.audit_log);
       this.filterLogs();
     });
   }
@@ -139,10 +142,10 @@ export class LogsComponent implements OnInit, OnDestroy {
   }
 
   logToText(log: object) {
-    this.logText = '';
+    let logText = '';
     for (const line of Object.keys(log)) {
-      this.logText =
-        this.logText +
+      logText =
+        logText +
         this.datePipe.transform(log[line].stamp, 'medium') +
         '\t' +
         log[line].priority +
@@ -150,5 +153,6 @@ export class LogsComponent implements OnInit, OnDestroy {
         log[line].message +
         '\n';
     }
+    return logText;
   }
 }