refs #798 Added some testing

ogWebconsole/src/app/components/calendar/calendar.component.spec.ts

@@ -1,5 +1,16 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
-
+import { HttpClientTestingModule } from '@angular/common/http/testing';
+import { ToastrModule } from 'ngx-toastr';
+import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
+import { MatDividerModule } from '@angular/material/divider';
+import { MatFormFieldModule } from '@angular/material/form-field';
+import { MatInputModule } from '@angular/material/input';
+import { MatIconModule } from '@angular/material/icon';
+import { MatButtonModule } from '@angular/material/button';
+import { MatTableModule } from '@angular/material/table';
+import { MatPaginatorModule } from '@angular/material/paginator';
+import { MatTooltipModule } from '@angular/material/tooltip';
+import { FormsModule } from '@angular/forms'; // Importa FormsModule para ngModel
 import { CalendarComponent } from './calendar.component';
 
 describe('CalendarComponent', () => {
@@ -8,7 +19,21 @@ describe('CalendarComponent', () => {
 
   beforeEach(async () => {
     await TestBed.configureTestingModule({
-      declarations: [CalendarComponent]
+      declarations: [CalendarComponent],
+      imports: [
+        HttpClientTestingModule,
+        ToastrModule.forRoot(),
+        BrowserAnimationsModule,
+        MatDividerModule,
+        MatFormFieldModule,
+        MatInputModule,
+        MatIconModule,
+        MatButtonModule,
+        MatTableModule,
+        MatPaginatorModule,
+        MatTooltipModule,
+        FormsModule // Añade FormsModule aquí para que ngModel funcione
+      ]
     })
     .compileComponents();
 

ogWebconsole/src/app/components/calendar/create-calendar/create-calendar.component.spec.ts

@@ -1,6 +1,31 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
-
+import { MatDialogModule, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
 import { CreateCalendarComponent } from './create-calendar.component';
+import { ToastrService } from 'ngx-toastr';
+import { HttpClientTestingModule } from '@angular/common/http/testing';
+import { MatFormFieldModule } from '@angular/material/form-field';
+import { MatInputModule } from '@angular/material/input';
+import { MatIconModule } from '@angular/material/icon';
+import { MatListModule } from '@angular/material/list';
+import { MatDividerModule } from '@angular/material/divider';
+
+// Mock para ToastrService
+class MockToastrService {
+  success(message: string) {}
+  error(message: string) {}
+}
+
+// Mock para MatDialogRef
+class MockMatDialogRef {
+  close() {}
+}
+
+// Mock para ToastConfig
+const mockToastConfig = {
+  timeOut: 5000,
+  positionClass: 'toast-top-right',
+  preventDuplicates: true,
+};
 
 describe('CreateCalendarComponent', () => {
   let component: CreateCalendarComponent;
@@ -8,16 +33,46 @@ describe('CreateCalendarComponent', () => {
 
   beforeEach(async () => {
     await TestBed.configureTestingModule({
-      declarations: [CreateCalendarComponent]
-    })
-    .compileComponents();
+      imports: [
+        HttpClientTestingModule, // Importar el módulo de prueba de HttpClient
+        MatDialogModule, // Importar MatDialogModule
+        MatFormFieldModule, // Importar MatFormFieldModule
+        MatInputModule, // Importar MatInputModule
+        MatIconModule, // Importar MatIconModule
+        MatListModule, // Importar MatListModule
+        MatDividerModule // Importar MatDividerModule
+      ],
+      declarations: [CreateCalendarComponent],
+      providers: [
+        { provide: MatDialogRef, useClass: MockMatDialogRef },
+        { provide: MAT_DIALOG_DATA, useValue: {} },
+        { provide: ToastrService, useClass: MockToastrService },
+        { provide: 'ToastConfig', useValue: mockToastConfig }, // Proveer el mock de ToastConfig
+      ],
+    }).compileComponents();
 
     fixture = TestBed.createComponent(CreateCalendarComponent);
     component = fixture.componentInstance;
-    fixture.detectChanges();
   });
 
-  it('should create', () => {
+  it('should create the component', () => {
     expect(component).toBeTruthy();
   });
+
+  it('should initialize with default values', () => {
+    component.ngOnInit();
+    expect(component.isEditMode).toBeFalse();
+    expect(component.name).toBe('');
+  });
+
+  it('should close the dialog on onNoClick', () => {
+    const dialogRef = TestBed.inject(MatDialogRef);
+    spyOn(dialogRef, 'close');
+    
+    component.onNoClick();
+    
+    expect(dialogRef.close).toHaveBeenCalled();
+  });
+
+  // Puedes agregar más pruebas según sea necesario
 });

ogWebconsole/src/app/components/groups/groups.component.ts

@@ -168,21 +168,24 @@ export class GroupsComponent implements OnInit {
     });
   }
 
-  addClient(event: MouseEvent, organizationalUnit:any = null): void {
+  addClient(event: MouseEvent, organizationalUnit: any = null): void {
     event.stopPropagation();
 
-    const dialogRef = this.dialog.open(CreateClientComponent, { data: { organizationalUnit }, width: '900px'});
+    const dialogRef = this.dialog.open(CreateClientComponent, { data: { organizationalUnit }, width: '900px' });
 
     dialogRef.afterClosed().subscribe(() => {
-      this.dataService.getOrganizationalUnits().subscribe(
-        data => {
-          this.organizationalUnits = data
-          this.loadChildrenAndClients(organizationalUnit.id);
-        },
-        error => console.error('Error fetching unidades organizativas', error)
-      );
+        this.dataService.getOrganizationalUnits().subscribe(
+            data => {
+                this.organizationalUnits = data;
+
+                if (organizationalUnit && organizationalUnit.id) {
+                    this.loadChildrenAndClients(organizationalUnit.id);
+                }
+            },
+            error => console.error('Error fetching unidades organizativas', error)
+        );
     });
-  }
+}
   onDeleteClick(event: MouseEvent, uuid: string, name: string, type: string): void {
     event.stopPropagation();
     if (type === 'client') {

ogWebconsole/src/app/components/groups/shared/clients/create-client/create-client.component.ts

@@ -104,7 +104,6 @@ export class CreateClientComponent implements OnInit {
       this.errorForm = false;
       const formData = this.clientForm.value;
       formData.ogLive = formData.ogLive; 
-      console.log('Form data:', formData  );
       this.http.post(`${this.baseUrl}/clients`, formData).subscribe(
         response => {
           this.dialogRef.close(response);

ogWebconsole/src/app/components/groups/shared/clients/edit-client/edit-client.component.ts

@@ -124,7 +124,6 @@ export class EditClientComponent {
   }
 
   onSubmit() {
-    console.log('Form data:', this.clientForm.value);
     if (this.clientForm.valid) {
       const formData = this.clientForm.value;
 

ogWebconsole/src/app/layout/header/header.component.spec.ts

@@ -1,6 +1,11 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
-
+import { MatToolbarModule } from '@angular/material/toolbar';
+import { MatButtonModule } from '@angular/material/button';
+import { MatMenuModule } from '@angular/material/menu';
+import { MatDialogModule } from '@angular/material/dialog';
+import { RouterTestingModule } from '@angular/router/testing';
 import { HeaderComponent } from './header.component';
+import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 
 describe('HeaderComponent', () => {
   let component: HeaderComponent;
@@ -8,10 +13,17 @@ describe('HeaderComponent', () => {
 
   beforeEach(async () => {
     await TestBed.configureTestingModule({
-      imports: [HeaderComponent]
-    })
-    .compileComponents();
-    
+      declarations: [HeaderComponent],
+      imports: [
+        MatToolbarModule,
+        MatButtonModule,
+        MatMenuModule,
+        MatDialogModule,
+        RouterTestingModule,
+        BrowserAnimationsModule
+      ]
+    }).compileComponents();
+
     fixture = TestBed.createComponent(HeaderComponent);
     component = fixture.componentInstance;
     fixture.detectChanges();

ogWebconsole/src/app/layout/main-layout/main-layout.component.spec.ts

@@ -1,6 +1,14 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
-
 import { MainLayoutComponent } from './main-layout.component';
+import { MatSidenavModule } from '@angular/material/sidenav';
+import { MatToolbarModule } from '@angular/material/toolbar';
+import { MatButtonModule } from '@angular/material/button';
+import { MatMenuModule } from '@angular/material/menu';  
+import { NoopAnimationsModule } from '@angular/platform-browser/animations';
+import { RouterTestingModule } from '@angular/router/testing';
+import { HeaderComponent } from '../header/header.component'; 
+import { SidebarComponent } from '../sidebar/sidebar.component'; 
+import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
 
 describe('MainLayoutComponent', () => {
   let component: MainLayoutComponent;
@@ -8,10 +16,18 @@ describe('MainLayoutComponent', () => {
 
   beforeEach(async () => {
     await TestBed.configureTestingModule({
-      declarations: [MainLayoutComponent]
-    })
-    .compileComponents();
-    
+      declarations: [MainLayoutComponent, HeaderComponent, SidebarComponent],
+      imports: [
+        MatSidenavModule,
+        MatToolbarModule,   
+        MatButtonModule,    
+        MatMenuModule,      
+        NoopAnimationsModule,
+        RouterTestingModule,
+      ],
+      schemas: [CUSTOM_ELEMENTS_SCHEMA],
+    }).compileComponents();
+
     fixture = TestBed.createComponent(MainLayoutComponent);
     component = fixture.componentInstance;
     fixture.detectChanges();
@@ -20,4 +36,12 @@ describe('MainLayoutComponent', () => {
   it('should create', () => {
     expect(component).toBeTruthy();
   });
+
+  it('should toggle sidebar visibility', () => {
+    expect(component.isSidebarVisible).toBeFalse();
+    component.toggleSidebar();
+    expect(component.isSidebarVisible).toBeTrue();
+    component.toggleSidebar();
+    expect(component.isSidebarVisible).toBeFalse(); 
+  });
 });

ogWebconsole/src/app/layout/sidebar/sidebar.component.spec.ts

@@ -1,6 +1,11 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
-
 import { SidebarComponent } from './sidebar.component';
+import { MatListModule } from '@angular/material/list';
+import { MatIconModule } from '@angular/material/icon';
+import { MatDialogModule } from '@angular/material/dialog';
+import { MatDividerModule } from '@angular/material/divider';
+import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
+import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
 
 describe('SidebarComponent', () => {
   let component: SidebarComponent;
@@ -8,16 +13,73 @@ describe('SidebarComponent', () => {
 
   beforeEach(async () => {
     await TestBed.configureTestingModule({
-      imports: [SidebarComponent]
-    })
-    .compileComponents();
+      declarations: [SidebarComponent],
+      imports: [
+        MatListModule,
+        MatIconModule,
+        MatDialogModule,
+        MatDividerModule,
+        BrowserAnimationsModule, // Necesario para que las animaciones de Angular Material funcionen bien en las pruebas.
+      ],
+      schemas: [CUSTOM_ELEMENTS_SCHEMA] // Para manejar cualquier elemento desconocido
+    }).compileComponents();
+  });
 
+  beforeEach(() => {
     fixture = TestBed.createComponent(SidebarComponent);
     component = fixture.componentInstance;
-    fixture.detectChanges();
+    fixture.detectChanges(); // Dibuja la vista inicial
   });
 
-  it('should create', () => {
-    expect(component).toBeTruthy();
+  it('should create the component', () => {
+    expect(component).toBeTruthy(); // Verifica que el componente se creó correctamente.
+  });
+
+  it('should display the username correctly', () => {
+    // Simula un token decodificado
+    component.username = 'testUser';
+    fixture.detectChanges();
+
+    const compiled = fixture.nativeElement;
+    expect(compiled.querySelector('.user-logged').textContent).toContain('testUser');
+  });
+
+  it('should toggle OgBoot submenu', () => {
+    // Inicialmente, el submenú debe estar oculto
+    expect(component.showOgBootSub).toBeFalse();
+
+    // Llamar a la función de toggle
+    component.toggleOgBootSub();
+    expect(component.showOgBootSub).toBeTrue();
+
+    // Llamar a la función de toggle otra vez
+    component.toggleOgBootSub();
+    expect(component.showOgBootSub).toBeFalse();
+  });
+
+  it('should toggle OgDhcp submenu', () => {
+    // Inicialmente, el submenú debe estar oculto
+    expect(component.showOgDhcpSub).toBeFalse();
+
+    // Llamar a la función de toggle
+    component.toggleOgDhcpSub();
+    expect(component.showOgDhcpSub).toBeTrue();
+
+    // Llamar a la función de toggle otra vez
+    component.toggleOgDhcpSub();
+    expect(component.showOgDhcpSub).toBeFalse();
+  });
+
+  it('should toggle Commands submenu', () => {
+    // Inicialmente, el submenú debe estar oculto
+    expect(component.showCommandSub).toBeFalse();
+
+    // Llamar a la función de toggle
+    component.toggleCommandSub();
+    expect(component.showCommandSub).toBeTrue();
+
+    // Llamar a la función de toggle otra vez
+    component.toggleCommandSub();
+    expect(component.showCommandSub).toBeFalse();
   });
 });

ogWebconsole/src/app/shared/page-not-found/page-not-found.component.spec.ts

@@ -1,23 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { PageNotFoundComponent } from './page-not-found.component';
-
-describe('PageNotFoundComponent', () => {
-  let component: PageNotFoundComponent;
-  let fixture: ComponentFixture<PageNotFoundComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      imports: [PageNotFoundComponent]
-    })
-    .compileComponents();
-    
-    fixture = TestBed.createComponent(PageNotFoundComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});