Skip to content

Commit

Permalink
Merge pull request #39 from fga-eps-mds/details-login-social
Browse files Browse the repository at this point in the history
Details login social
  • Loading branch information
geraldovictor authored Dec 9, 2023
2 parents 9880c4e + 0e73386 commit 48861e8
Show file tree
Hide file tree
Showing 7 changed files with 68 additions and 93 deletions.
24 changes: 0 additions & 24 deletions localhost.crt

This file was deleted.

28 changes: 0 additions & 28 deletions localhost.key

This file was deleted.

12 changes: 3 additions & 9 deletions src/app/app-routing.module.ts
Original file line number Diff line number Diff line change
Expand Up @@ -16,22 +16,16 @@ import { UpdateRoleComponent } from './pages/update-role/update-role.component';
import { AdminGuard } from './services/admin.guard';
import { SuggestAgendaComponent } from './pages/suggest-agenda/suggest-agenda.component';
import { ParticipateComponent } from './pages/participate/participate.component';
import { GridDaysComponent } from './pages/grid-days/grid-days.component';
import { GridComponent } from './pages/grid/grid.component';
import { GridDaysComponent } from './pages/grid-days/grid-days.component';
import { GridComponent } from './pages/grid/grid.component';

import { WithTokenGuard } from './guard/with-token.guard';

const routes: Routes = [
{ path: 'login', component: LoginComponent },
{ path: 'register', component: RegisterComponent },
{ path: 'loginsocial', component: LoginSocialComponent },
{ path: 'stream', component: StreamViewComponent },
{ path: 'videos', component: VideoComponent },
{ path: 'video/:idVideo', component: VideoViewerComponent },
{ path: 'activeAccount', component: ActiveAccountComponent },
{ path: 'sendCodeResetPassword', component: CheckCodeRestPasswordComponent },
{ path: 'changePassword', component: ResetPasswordComponent },
{ path: '', component: VideoComponent, canActivate: [AuthGuard], }, // Default route - Showd be stream component
{ path: '', component: VideoComponent, canActivate: [AuthGuard], },
{ path: 'login', component: LoginComponent, canActivate: [WithTokenGuard], },
{ path: 'register', component: RegisterComponent, canActivate: [WithTokenGuard], },
{ path: 'loginsocial', component: LoginSocialComponent, canActivate: [WithTokenGuard], },
Expand Down
2 changes: 1 addition & 1 deletion src/app/components/background/background.component.html
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
<div class="pt-10 flex justify-center items-center">
<img alt="simbolo-unb" src="../../../assets/Simbolo_UnBTV-01 1.png" />
</div>
<div *ngIf="getActualRoute() !== '/login'">
<div *ngIf="getActualRoute() !== '/login' && getActualRoute() !== '/loginsocial'">
<nav class="flex flex-row items-center justify-center pl-3">
<ul class="flex flex-row gap-1 text-xs">
<div *ngIf="getActualRoute() === '/stream'">
Expand Down
16 changes: 6 additions & 10 deletions src/app/pages/login-social/login-social.component.css
Original file line number Diff line number Diff line change
Expand Up @@ -13,8 +13,8 @@
align-items: center;
width: 100%;
max-width: 360px;
margin-right: auto;
margin-left: auto;
margin-right: auto;
margin-left: auto;
height: 100%;
}

Expand All @@ -29,13 +29,12 @@
top: 210px;
left: 50px;
margin: 5px;
border: 0.15px solid #3C3C3B;
border: 0.15px solid #3C3C3B;
border-radius: 9px;
line-height: 10px;
font-weight: 400;
font-size: 13px;
background-image: url('../../../assets/google.png');
background-position: center;
background-size: 7% auto;
background-repeat: no-repeat;
background-position: 220px 6px;
Expand All @@ -46,7 +45,6 @@

.facebook-button {
text-align: center;
background-color: white;
color: black;
padding: 10px 20px;
border-color: black;
Expand All @@ -60,14 +58,13 @@
border-radius: 5px;
line-height: 10px;
background-image: url('../../../assets/facebook-icon-white-png.png');
background-position: center;
background-size: 8% auto;
background-repeat: no-repeat;
background-position: 12px 9px;
margin-bottom: 10.5px;
margin-top: 19.5px;
background-color: #1877F2;

}


Expand All @@ -78,8 +75,8 @@
font-family: Helvetic ,sans-serif;
font-size: 14px;
color: white;


}

.email-button{
Expand All @@ -100,7 +97,6 @@
margin-top: 10px;
margin-bottom: 18.5px;
background-image: url('../../../assets/email-svgrepo-com.svg');
background-position: center;
background-size: 8% auto;
background-repeat: no-repeat;
background-position: 12px 9px;
Expand Down
5 changes: 4 additions & 1 deletion src/app/pages/login/login.component.html
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@

<div class="flex justify-center items-center h-4/5">
<div class="flex justify-center items-center h-full">
<form [formGroup]="userForm" (submit)="login()" class="text-center">
<div class="mb-4">
<input pInputText class="w-64 h-8 border rounded-lg border-gray-300 pl-4 md:w-96 md:h-10" type="email" formControlName="email" name="email" placeholder="E-mail" required>
Expand All @@ -19,5 +19,8 @@
<div class="flex justify-start items-center text-blue-brand underline pl-4 cursor-pointer" (click)="navigator('/register')">
Cadastre-se
</div>
<div id="loginSocialButton" class="pt-4 flex justify-start items-center text-blue-brand underline pl-4 cursor-pointer" (click)="navigator('/loginsocial')">
Login com redes sociais
</div>
</form>
</div>
74 changes: 54 additions & 20 deletions src/app/pages/login/login.component.spec.ts
Original file line number Diff line number Diff line change
@@ -1,4 +1,9 @@
import { ComponentFixture, TestBed, tick, fakeAsync } from '@angular/core/testing';
import {
ComponentFixture,
TestBed,
tick,
fakeAsync,
} from '@angular/core/testing';
import { LoginComponent } from './login.component';
import { FormBuilder, ReactiveFormsModule } from '@angular/forms';
import { HttpClientTestingModule } from '@angular/common/http/testing';
Expand All @@ -13,22 +18,22 @@ import { VideoComponent } from '../video/video.component';
import { HttpErrorResponse } from '@angular/common/http';
import { ActiveAccountComponent } from '../active-account/active-account.component';


const mockUserReturn = {
"access_token": "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpZCI6MSwiZW1haWwiOiJqb2FvMTV2aWN0b3IwOEBnbWFpbC5jb20iLCJleHAiOjE2OTkzMTI5MzV9.1B9qBJt8rErwBKyD5JCdsPozsw86oQ38tdfDuMM2HFI",
"token_type": "bearer"
access_token:
'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpZCI6MSwiZW1haWwiOiJqb2FvMTV2aWN0b3IwOEBnbWFpbC5jb20iLCJleHAiOjE2OTkzMTI5MzV9.1B9qBJt8rErwBKyD5JCdsPozsw86oQ38tdfDuMM2HFI',
token_type: 'bearer',
};

class AuthServiceMock {
constructor() { }
constructor() {}

loginUser() {
return of({ success: true });
}
}

class AlertServiceMock {
constructor() { }
constructor() {}
showMessage() {
return of({ success: true });
}
Expand All @@ -45,21 +50,26 @@ describe('LoginComponent', () => {

beforeEach(async () => {
TestBed.configureTestingModule({
imports: [HttpClientTestingModule, ReactiveFormsModule, RouterTestingModule.withRoutes(
[
imports: [
HttpClientTestingModule,
ReactiveFormsModule,
RouterTestingModule.withRoutes([
{ path: 'profile', component: ProfileComponent },
{ path: 'sendCodeResetPassword', component: CheckCodeRestPasswordComponent },
{
path: 'sendCodeResetPassword',
component: CheckCodeRestPasswordComponent,
},
{ path: 'register', component: RegisterComponent },
{ path: 'videos', component: VideoComponent },
{ path: 'activeAccount', component: ActiveAccountComponent }
]
)],
{ path: 'activeAccount', component: ActiveAccountComponent },
]),
],
providers: [
FormBuilder,
AuthService,
AlertService,
{ provide: AlertService, useValue: new AlertServiceMock() }, // Provide the mock class
{ provide: AuthService, useValue: new AuthServiceMock() }
{ provide: AuthService, useValue: new AuthServiceMock() },
],
declarations: [LoginComponent],
}).compileComponents();
Expand All @@ -85,7 +95,9 @@ describe('LoginComponent', () => {
const form = component.userForm;
form.setValue({ email: '[email protected]', password: 'password' });

const submitButton = fixture.nativeElement.querySelector('button[type="submit"]');
const submitButton = fixture.nativeElement.querySelector(
'button[type="submit"]'
);
submitButton.click();
tick();

Expand All @@ -97,38 +109,60 @@ describe('LoginComponent', () => {
const alertSpy = spyOn(alertService, 'showMessage');
fixture.detectChanges();

const submitButton = fixture.nativeElement.querySelector('button[type="submit"]');
const submitButton = fixture.nativeElement.querySelector(
'button[type="submit"]'
);
submitButton.click();
tick();

expect(alertSpy).toHaveBeenCalledWith('info', 'Alerta', 'Preencha todos os campos corretamente!');
expect(alertSpy).toHaveBeenCalledWith(
'info',
'Alerta',
'Preencha todos os campos corretamente!'
);
}));

it('should call navigator method when "Esqueceu a senha?" is clicked', () => {
spyOn(component, 'navigator').and.callThrough();
const forgotPasswordLink = fixture.nativeElement.querySelector('.text-gray-400');
const forgotPasswordLink =
fixture.nativeElement.querySelector('.text-gray-400');
forgotPasswordLink.click();

expect(component.navigator).toHaveBeenCalledWith('/sendCodeResetPassword');
});

it('should call navigator method when "Cadastre-se" is clicked', () => {
spyOn(component, 'navigator').and.callThrough();
const registerLink = fixture.nativeElement.querySelector('.text-blue-brand');
const registerLink =
fixture.nativeElement.querySelector('.text-blue-brand');
registerLink.click();

expect(component.navigator).toHaveBeenCalledWith('/register');
});

it('should call navigator method when "Login com redes sociais" is clicked', () => {
const navigatorSpy = spyOn(component, 'navigator').and.callThrough();
const loginSocial = fixture.nativeElement.querySelector('#loginSocialButton');
loginSocial.click();

expect(navigatorSpy).toHaveBeenCalledWith('/loginsocial');
});

it('should call login and return an error', () => {
fixture.detectChanges();
const form = component.userForm;
form.setValue({ email: '[email protected]', password: 'password' });
const mySpy = spyOn(authService, 'loginUser').and.returnValue(throwError(() => new HttpErrorResponse({ error: { detail: 'A sua conta ainda não foi ativada.' } })));
const mySpy = spyOn(authService, 'loginUser').and.returnValue(
throwError(
() =>
new HttpErrorResponse({
error: { detail: 'A sua conta ainda não foi ativada.' },
})
)
);
spyOn(component, 'navigator').and.callThrough();
component.login();
expect(mySpy).toHaveBeenCalled();
expect(component.navigator).toHaveBeenCalledWith('/activeAccount');
});

});

0 comments on commit 48861e8

Please sign in to comment.