diff --git a/package-lock.json b/package-lock.json index 97ff810..c47edfe 100644 --- a/package-lock.json +++ b/package-lock.json @@ -16,9 +16,11 @@ "@angular/platform-browser": "^17.3.0", "@angular/platform-browser-dynamic": "^17.3.0", "@angular/router": "^17.3.0", + "@faker-js/faker": "^8.4.1", "@ng-bootstrap/ng-bootstrap": "^16.0.0-rc.2", "bootstrap": "^5.3.3", "bootstrap-icons": "^1.11.3", + "faker": "^6.6.6", "rxjs": "~7.8.0", "tslib": "^2.3.0", "zone.js": "~0.14.3" @@ -2674,6 +2676,21 @@ "node": ">=12" } }, + "node_modules/@faker-js/faker": { + "version": "8.4.1", + "resolved": "https://registry.npmjs.org/@faker-js/faker/-/faker-8.4.1.tgz", + "integrity": "sha512-XQ3cU+Q8Uqmrbf2e0cIC/QN43sTBSC8KF12u29Mb47tWrt2hAgBXSgpZMj4Ao8Uk0iJcU99QsOCaIL8934obCg==", + "funding": [ + { + "type": "opencollective", + "url": "https://opencollective.com/fakerjs" + } + ], + "engines": { + "node": "^14.17.0 || ^16.13.0 || >=18.0.0", + "npm": ">=6.14.13" + } + }, "node_modules/@isaacs/cliui": { "version": "8.0.2", "resolved": "https://registry.npmjs.org/@isaacs/cliui/-/cliui-8.0.2.tgz", @@ -6162,6 +6179,11 @@ "node": ">=4" } }, + "node_modules/faker": { + "version": "6.6.6", + "resolved": "https://registry.npmjs.org/faker/-/faker-6.6.6.tgz", + "integrity": "sha512-9tCqYEDHI5RYFQigXFwF1hnCwcWCOJl/hmll0lr5D2Ljjb0o4wphb69wikeJDz5qCEzXCoPvG6ss5SDP6IfOdg==" + }, "node_modules/fast-deep-equal": { "version": "3.1.3", "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz", diff --git a/package.json b/package.json index 85c28d8..0254117 100644 --- a/package.json +++ b/package.json @@ -18,9 +18,11 @@ "@angular/platform-browser": "^17.3.0", "@angular/platform-browser-dynamic": "^17.3.0", "@angular/router": "^17.3.0", + "@faker-js/faker": "^8.4.1", "@ng-bootstrap/ng-bootstrap": "^16.0.0-rc.2", "bootstrap": "^5.3.3", "bootstrap-icons": "^1.11.3", + "faker": "^6.6.6", "rxjs": "~7.8.0", "tslib": "^2.3.0", "zone.js": "~0.14.3" diff --git a/src/app/app.component.spec.ts b/src/app/app.component.spec.ts index 33e17dd..0dace90 100644 --- a/src/app/app.component.spec.ts +++ b/src/app/app.component.spec.ts @@ -1,15 +1,18 @@ import { TestBed } from '@angular/core/testing'; import { RouterTestingModule } from '@angular/router/testing'; import { AppComponent } from './app.component'; +import { CoffeeListComponent } from './coffee/coffee-list/coffee-list.component'; +import { HttpClientModule } from '@angular/common/http'; describe('AppComponent', () => { beforeEach(async () => { await TestBed.configureTestingModule({ imports: [ - RouterTestingModule + RouterTestingModule, HttpClientModule ], declarations: [ - AppComponent + AppComponent, + CoffeeListComponent ], }).compileComponents(); }); @@ -30,6 +33,6 @@ describe('AppComponent', () => { const fixture = TestBed.createComponent(AppComponent); fixture.detectChanges(); const compiled = fixture.nativeElement as HTMLElement; - expect(compiled.querySelector('h1')?.textContent).toContain('Hello, parcial-sem4'); + expect(compiled.querySelector('h1')?.textContent).toContain('El aroma mágico'); }); }); diff --git a/src/app/coffee/coffee-list/coffee-list.component.spec.ts b/src/app/coffee/coffee-list/coffee-list.component.spec.ts index 9b82413..2541c8b 100644 --- a/src/app/coffee/coffee-list/coffee-list.component.spec.ts +++ b/src/app/coffee/coffee-list/coffee-list.component.spec.ts @@ -2,27 +2,107 @@ import { async, ComponentFixture, TestBed } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { DebugElement } from '@angular/core'; - import { CoffeeListComponent } from './coffee-list.component'; +import { HttpClientModule } from '@angular/common/http'; +import { Coffee } from '../coffee'; +import { CoffeeService } from '../coffee.service'; +import { faker } from '@faker-js/faker'; describe('CoffeeListComponent', () => { let component: CoffeeListComponent; let fixture: ComponentFixture; + let debug: DebugElement; beforeEach(async(() => { TestBed.configureTestingModule({ - declarations: [ CoffeeListComponent ] + imports: [HttpClientModule], + declarations: [ CoffeeListComponent ], + providers: [ CoffeeService ] }) .compileComponents(); })); + // function generateCoffee(): any { + // return { + // id: faker.string.uuid(), // Genera un ID único + // title: faker.word.noun(), // Genera un título de película aleatorio + // poster: faker.image.url(), // Genera una URL de póster de película aleatoria + // duration: faker.random.numeric(), // Genera una duración aleatoria en minutos + // country: faker.location.country(), // Genera un país aleatorio + // releaseDate: faker.date.soon({ refDate: '2023-01-01T00:00:00.000Z' }), // Genera una fecha de lanzamiento aleatoria en formato ISO + // popularity: faker.random.numeric() // Genera un nivel de popularidad aleatorio + // }; + // } + beforeEach(() => { fixture = TestBed.createComponent(CoffeeListComponent); component = fixture.componentInstance; + const numberOfElements = 3; + + for(let i = 0; i < numberOfElements; i++) { + const coffee = new Coffee( + faker.number.int(), + faker.person.firstName(), + faker.location.country(), + faker.location.city(), + faker.string.uuid(), + faker.number.int(), + faker.image.url() + ); + component.coffees.push(coffee); + } + fixture.detectChanges(); + debug = fixture.debugElement; }); it('should create', () => { expect(component).toBeTruthy(); }); + + it('should have a table row with 4 th elements', () => { + // Obtener la tabla desde el componente + const table = fixture.debugElement.query(By.css('table')); + + // Obtener todas las filas de la tabla + const rows = table.queryAll(By.css('tr')); + + // Filtrar las filas que contienen exactamente 4 elementos th + const rowWith4Th = rows.find(row => { + const thElements = row.queryAll(By.css('th')); + return thElements.length === 4; + }); + + // Verificar que se encontró una fila con 4 th + expect(rowWith4Th).toBeTruthy(); + }); + + + it('should have 3 tr elements in tbody', () => { + // Obtener el tbody desde el componente + const tbody = fixture.debugElement.query(By.css('tbody')); + + // Obtener todos los tr dentro del tbody + const trElements = tbody.queryAll(By.css('tr')); + + // Verificar que haya exactamente 3 tr elements + expect(trElements.length).toBe(3); + }); + + + +it('should display Coffee names correctly', () => { + // Obtener todos los elementos td en la segunda columna de la tabla + const tdElements = fixture.debugElement.queryAll(By.css('td:nth-child(2)')); + + // Verificar que el número de elementos coincide con el número de coffees + expect(tdElements.length).toEqual(component.coffees.length); + + // Iterar sobre los elementos y verificar que el texto coincide con los nombres de los coffees + tdElements.forEach((td, index) => { + const CoffeeName = td.nativeElement.textContent.trim(); // Obtener el texto del td y eliminar los espacios en blanco alrededor + expect(CoffeeName).toEqual(component.coffees[index].nombre); // Verificar que el texto coincide con el nombre del coffee correspondiente + }); +}); + }); diff --git a/src/app/coffee/coffee.service.spec.ts b/src/app/coffee/coffee.service.spec.ts index d66593e..5e47daf 100644 --- a/src/app/coffee/coffee.service.spec.ts +++ b/src/app/coffee/coffee.service.spec.ts @@ -2,10 +2,12 @@ import { TestBed, async, inject } from '@angular/core/testing'; import { CoffeeService } from './coffee.service'; +import { HttpClientTestingModule } from '@angular/common/http/testing'; describe('Service: Coffee', () => { beforeEach(() => { TestBed.configureTestingModule({ + imports: [HttpClientTestingModule], providers: [CoffeeService] }); });