Merge pull request #298 from SharebookBR/ft-add-some-tests

Adding some tests

Dockerfile

@@ -1,5 +1,5 @@
 # base image
-FROM node:12.2.0
+FROM node:12
 
 # install chrome for protractor tests
 RUN wget -q -O - https://dl-ssl.google.com/linux/linux_signing_key.pub | apt-key add -
@@ -16,7 +16,7 @@ ENV PATH /app/node_modules/.bin:$PATH
 COPY package.json /app/package.json
 COPY package-lock.json /app/package-lock.json
 RUN npm install
-RUN npm install -g @angular/cli@7.3.7
+RUN npm install -g @angular/cli@9.1.15
 
 # add app
 COPY . /app

Dockerfile-local

@@ -1,5 +1,5 @@
 # base image
-FROM node:12.2.0
+FROM node:12
 
 # install chrome for protractor tests
 RUN wget -q -O - https://dl-ssl.google.com/linux/linux_signing_key.pub | apt-key add -
@@ -16,7 +16,7 @@ ENV PATH /app/node_modules/.bin:$PATH
 COPY package.json /app/package.json
 COPY package-lock.json /app/package-lock.json
 RUN npm install
-RUN npm install -g @angular/cli@7.3.7
+RUN npm install -g @angular/cli@9.1.15
 
 # add app
 COPY . /app

README.md

@@ -69,9 +69,15 @@ docker-compose up -d --build
 # Criando imagem e rodando o container com Backend LOCAL
 docker-compose -f docker-compose-local.yml up -d --build
 
-# Rodando os testes unitários
+# Rodando todos os testes unitários
 docker-compose run --rm sharebook npm run test
 
+# Para rodar o teste unitário dentro do container e verificar os possíveis erros
+docker exec -it sharebook-frontend-dev bash
+npm run test-debug
+acessar a URL que aparece no console: http://localhost:9876/
+clicar no botão DEBUG
+
 # Parando o container
 docker-compose stop
 

angular.json

@@ -119,9 +119,6 @@
             "polyfills": "src/polyfills.ts",
             "tsConfig": "tsconfig.spec.json",
             "karmaConfig": "karma.conf.js",
-            "styles": [
-              "src/style.scss"
-            ],
             "scripts": [],
             "assets": [
               "src/favicon.ico",

docker-compose-local.yml

@@ -11,3 +11,4 @@ services:
       - '/app/node_modules'
     ports:
       - '4200:4200'
+      - '9876:9876'

docker-compose.yml

@@ -11,3 +11,4 @@ services:
       - '/app/node_modules'
     ports:
       - '4200:4200'
+      - '9876:9876'

karma.conf.js

@@ -1,5 +1,6 @@
 // Karma configuration file, see link for more information
 // https://karma-runner.github.io/1.0/config/configuration-file.html
+/* global __dirname, require */
 
 module.exports = function (config) {
   config.set({
@@ -16,7 +17,7 @@ module.exports = function (config) {
       clearContext: false, // leave Jasmine Spec Runner output visible in browser
     },
     coverageIstanbulReporter: {
-      dir: require('path').join(__dirname, './coverage/teste'),
+      dir: require('path').join(__dirname, './coverage'),
       reports: ['html', 'lcovonly', 'text-summary'],
       fixWebpackSourcePaths: true,
     },

src/app/components/about/about.component.html

@@ -18,7 +18,7 @@ <h5 class="card-title">{{ contributor.name }}</h5>
         <p class="card-text">{{ contributor.position }}</p>
         <a *ngFor="let link of contributor.links" [href]="link.url" class="card-link" target="_blank">{{
           link.content
-        }}</a>
+          }}</a>
       </div>
     </div>
   </div>
@@ -54,7 +54,7 @@ <h1>3 princípios do projeto Sharebook</h1>
   <ol class="rounded-list">
     <li>
       <p>
-        <b>Código livre</b><br />
+        <strong>Código livre</strong><br />
         Não se confundir com um projeto comercial. A essência é ser um serviço grátis para ajudar quem precisa. Um
         projeto colaborativo de código aberto. Podemos e vamos ser bons e agressivos no marketing, mas sem jamais
         esquecer essa base.
@@ -63,7 +63,7 @@ <h1>3 princípios do projeto Sharebook</h1>
 
     <li>
       <p>
-        <b>Simples</b><br />
+        <strong>Simples</strong><br />
         Manter as coisas simples e incentivar o aprendizado. Nossa estrutura precisa ser simples ao ponto que mesmo um
         iniciante rapidamente entenda e se sinta confortável em colaborar no código fonte. Design simples e código
         limpo.
@@ -72,11 +72,11 @@ <h1>3 princípios do projeto Sharebook</h1>
 
     <li>
       <p>
-        <b>Divertido</b><br />
+        <strong>Divertido</strong><br />
         Tem que ser divertido como um game. Ganhando pontos. Subindo de nível. Ganhando selos de conquistas. E quem
         sabe, no futuro, algum parceiro possa patrocinar os prêmios? (prêmios pro time de desenvolvimento também,
         claro.)
       </p>
     </li>
   </ol>
-</div>
+</div>

src/app/components/book/details/details.component.html

@@ -2,11 +2,7 @@
   <h1 class="text-center display-4">{{ pageTitle }}</h1>
 
   <div *ngIf="state == 'not-found'" class="text-center">
-    <a
-      routerLink="/"
-      class="btn btn-outline-success"
-      style="margin: 0 3px 3px 0;"
-    >
+    <a routerLink="/" class="btn btn-outline-success" style="margin: 0 3px 3px 0;">
       Voltar para página inicial.
     </a>
   </div>
@@ -18,85 +14,56 @@ <h1 class="text-center display-4">{{ pageTitle }}</h1>
   <div class="container" *ngIf="state == 'ready'">
     <div class="form-row">
       <div class="form-group col-lg-4">
-        <img
-          [src]="
+        <img [src]="
             bookInfo.imageBytes?.length
               ? 'data:image/png;base64,' + bookInfo.imageBytes
               : bookInfo.imageUrl
               ? bookInfo.imageUrl
               : 'assets/img/img-placeholder.png'
-          "
-          class="img-thumbnail"
-        />
+          " class="img-thumbnail" alt="Book image" />
       </div>
       <div class="form-group col-lg-8">
-        <p><b>Título:</b><br />{{ bookInfo.title }}</p>
-        <p><b>Autor:</b><br />{{ bookInfo.author }}</p>
-        <p><b>Categoria:</b><br />{{ bookInfo.category }}</p>
+        <p><strong>Título:</strong><br />{{ bookInfo.title }}</p>
+        <p><strong>Autor:</strong><br />{{ bookInfo.author }}</p>
+        <p><strong>Categoria:</strong><br />{{ bookInfo.category }}</p>
         <p *ngIf="!!bookInfo.synopsis" style="white-space: pre-wrap;">
-          <b>Sinópse:</b><br />{{ bookInfo.synopsis }}
+          <strong>Sinópse:</strong><br />{{ bookInfo.synopsis }}
         </p>
         <p *ngIf="available">
-          <b>Quando será anunciado o ganhador desse livro?</b><br />{{
-            chooseDateInfo
+          <strong>Quando será anunciado o ganhador desse livro?</strong><br />{{
+          chooseDateInfo
           }}
         </p>
         <p>
-          <b>Local de Origem</b><br />{{ bookInfo.city }} -
+          <strong>Local de Origem</strong><br />{{ bookInfo.city }} -
           {{ bookInfo.state }}
         </p>
         <p *ngIf="available && userProfile">
-          <b>Frete grátis?</b><br />{{ isFreeFreight ? 'Sim' : 'Não' }}
+          <strong>Frete grátis?</strong><br />{{ isFreeFreight ? 'Sim' : 'Não' }}
         </p>
-        <div
-          class="custom-control custom-checkbox"
-          *ngIf="available && userProfile && !requested && !isFreeFreight"
-        >
-          <input
-            type="checkbox"
-            class="custom-control-input"
-            id="checkFreight"
-            [(ngModel)]="isCheckedFreight"
-          />
-          <label class="custom-control-label" for="checkFreight"
-            >Estou ciente que o frete não é grátis. Caso seja escolhido, me
-            comprometo a reembolsar o doador.</label
-          >
+        <div class="custom-control custom-checkbox" *ngIf="available && userProfile && !requested && !isFreeFreight">
+          <input type="checkbox" class="custom-control-input" id="checkFreight" [(ngModel)]="isCheckedFreight" />
+          <label class="custom-control-label" for="checkFreight">Estou ciente que o frete não é grátis. Caso seja
+            escolhido, me
+            comprometo a reembolsar o doador.</label>
         </div>
       </div>
     </div>
     <div class="form-row">
       <div class="form-group col-lg-12">
         <div class="modal-footer">
-          <span class="badge badge-success" *ngIf="requested"
-            >Você já solicitou. Aguarde e boa sorte!</span
-          >
+          <span class="badge badge-success" *ngIf="requested">Você já solicitou. Aguarde e boa sorte!</span>
 
-          <span class="badge badge-danger" *ngIf="!requested && !available"
-            >Não disponível.</span
-          >
+          <span class="badge badge-danger" *ngIf="!requested && !available">Não disponível.</span>
 
-          <input
-            type="button"
-            *ngIf="available && userProfile && !requested"
-            class="btn btn-primary"
-            value="Tenho interesse"
-            (click)="onRequestBook()"
-            [disabled]="!isFreeFreight && !isCheckedFreight"
-          />
+          <input type="button" *ngIf="available && userProfile && !requested" class="btn btn-primary"
+            value="Tenho interesse" (click)="onRequestBook()" [disabled]="!isFreeFreight && !isCheckedFreight" />
 
-          <input
-            type="button"
-            *ngIf="available && !userProfile"
-            class="btn btn-primary"
-            value="Faça login para solicitar o livro"
-            (click)="onLoginBook()"
-          />
-          <a [routerLink]="['/home']" class="btn btn-link" id="cancelButton"
-            >Cancelar</a
-          >
+          <input type="button" *ngIf="available && !userProfile" class="btn btn-primary"
+            value="Faça login para solicitar o livro" (click)="onLoginBook()" />
+          <a [routerLink]="['/home']" class="btn btn-link" id="cancelButton">Cancelar</a>
         </div>
       </div>
     </div>
   </div>
-</div>
+</div>

src/app/components/book/details/details.component.spec.ts

@@ -20,7 +20,7 @@ describe('DetailsComponent', () => {
       imports: [
         RouterTestingModule,
         AppConfigModule,
-        NgbModule.forRoot(),
+        NgbModule,
         NgbModalModule,
         HttpClientTestingModule,
         FormsModule,

src/app/components/book/donate/donate.component.spec.ts

@@ -1,14 +1,14 @@
 import { ToastrModule } from 'ngx-toastr';
 import { async, ComponentFixture, TestBed } from '@angular/core/testing';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
-import { Ng2SmartTableModule } from 'ng2-smart-table';
 import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
 import { RouterTestingModule } from '@angular/router/testing';
 
 import { DonateComponent } from './donate.component';
 
 import { AppConfigModule } from '../../../app-config.module';
 import { NO_ERRORS_SCHEMA } from '@angular/core';
+import { HttpClientTestingModule } from '@angular/common/http/testing';
 
 describe('DonateComponent', () => {
   let component: DonateComponent;
@@ -21,10 +21,10 @@ describe('DonateComponent', () => {
       imports: [
         FormsModule,
         ReactiveFormsModule,
-        Ng2SmartTableModule,
         AppConfigModule,
         RouterTestingModule,
         ToastrModule.forRoot(),
+        HttpClientTestingModule
       ],
       providers: [NgbActiveModal],
     }).compileComponents();

src/app/components/book/donate/donate.component.ts

@@ -4,7 +4,6 @@ import { FormBuilder, FormGroup, Validators } from '@angular/forms';
 import { Subject } from 'rxjs';
 import { takeUntil } from 'rxjs/operators';
 
-// import { LocalDataSource } from 'ng2-smart-table';
 import { BookService } from '../../../core/services/book/book.service';
 import { DonateBookUser } from '../../../core/models/donateBookUser';
 import { ToastrService } from 'ngx-toastr';

src/app/components/book/donations/donations.component.spec.ts

@@ -12,6 +12,8 @@ import { AppConfigModule } from '../../../app-config.module';
 import { NO_ERRORS_SCHEMA } from '@angular/core';
 import { ConfirmationDialogService } from 'src/app/core/services/confirmation-dialog/confirmation-dialog.service';
 import { RouterTestingModule } from '@angular/router/testing';
+import { HttpClientTestingModule } from '@angular/common/http/testing';
+import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 
 describe('DonationsComponent', () => {
   let component: DonationsComponent;
@@ -31,6 +33,8 @@ describe('DonationsComponent', () => {
         NgbModalModule,
         ToastrModule.forRoot(),
         RouterTestingModule,
+        HttpClientTestingModule,
+        BrowserAnimationsModule
       ],
       providers: [ConfirmationDialogService],
     }).compileComponents();

src/app/components/book/donor-modal/donor-modal.component.spec.ts

@@ -1,16 +1,24 @@
 import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
+import { HttpClientTestingModule } from '@angular/common/http/testing';
 
 import { DonorModalComponent } from './donor-modal.component';
+import { AppConfigModule } from '../../../app-config.module';
 
 describe('DonorModalComponent', () => {
   let component: DonorModalComponent;
   let fixture: ComponentFixture<DonorModalComponent>;
 
   beforeEach(async(() => {
     TestBed.configureTestingModule({
-      declarations: [ DonorModalComponent ]
+      declarations: [DonorModalComponent],
+      imports: [
+        HttpClientTestingModule,
+        AppConfigModule
+      ],
+      providers: [NgbActiveModal]
     })
-    .compileComponents();
+      .compileComponents();
   }));
 
   beforeEach(() => {