Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Defect/365 istrusted logindotgov code error #388

Merged
merged 6 commits into from
Jul 13, 2022
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 2 additions & 0 deletions front-end/src/app/app-routing.module.ts
Original file line number Diff line number Diff line change
Expand Up @@ -5,12 +5,14 @@ import { TwoFactorLoginComponent } from './login/two-factor-login/two-factor-log
import { ConfirmTwoFactorComponent } from './login/confirm-two-factor/confirm-two-factor.component';
import { LayoutComponent } from './layout/layout.component';
import { DashboardComponent } from './dashboard/dashboard.component';
import { LoginGuard } from './shared/guards/login-page.guard';

const routes: Routes = [
{
path: '',
component: LoginComponent,
pathMatch: 'full',
canActivate:[LoginGuard],
},
{ path: 'twoFactLogin', component: TwoFactorLoginComponent },
{ path: 'confirm-2f', component: ConfirmTwoFactorComponent },
Expand Down
70 changes: 65 additions & 5 deletions front-end/src/app/dashboard/dashboard.component.spec.ts
Original file line number Diff line number Diff line change
@@ -1,19 +1,47 @@
import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
import { HttpClientTestingModule } from '@angular/common/http/testing';
import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { RouterTestingModule } from '@angular/router/testing';
import { Store } from '@ngrx/store';
import { provideMockStore } from '@ngrx/store/testing';
import { UserLoginData } from 'app/shared/models/user.model';
import { userLoggedInAction } from 'app/store/login.actions';
import { selectUserLoginData } from 'app/store/login.selectors';
import { environment } from 'environments/environment';
import { CookieService } from 'ngx-cookie-service';
import { PanelModule } from 'primeng/panel';
import { DashboardComponent } from './dashboard.component';

xdescribe('DashboardComponent', () => {
describe('DashboardComponent', () => {
let component: DashboardComponent;
let fixture: ComponentFixture<DashboardComponent>;
let cookieService: CookieService;
let store: Store;

beforeEach(
waitForAsync(() => {
const userLoginData: UserLoginData = {
committee_id: 'C00000000',
email: '[email protected]',
is_allowed: true,
token: 'jwttokenstring',
};

TestBed.configureTestingModule({
imports: [HttpClientTestingModule, RouterTestingModule],
imports: [
HttpClientTestingModule,
RouterTestingModule,
PanelModule,
BrowserAnimationsModule,
],
declarations: [DashboardComponent],
providers: [CookieService],
providers: [
CookieService,
provideMockStore({
initialState: { fecfile_online_userLoginData: userLoginData },
selectors: [{ selector: selectUserLoginData, value: userLoginData }],
}),
],
}).compileComponents();
})
);
Expand All @@ -22,9 +50,41 @@ xdescribe('DashboardComponent', () => {
fixture = TestBed.createComponent(DashboardComponent);
component = fixture.componentInstance;
fixture.detectChanges();
cookieService = TestBed.inject(CookieService);
store = TestBed.inject(Store);
});

xit('should create', () => {
it('should create', () => {
expect(component).toBeTruthy();
});

it('#dispatchUserLoggedInFromCookies happy path', () => {
const testCommitteeId = "testCommitteeId";
const testEmail = "testEmail";
const testIsAllowed = true;
const testToken = null;

const expectedUserLoginData: UserLoginData = {
committee_id: testCommitteeId,
email: testEmail,
is_allowed: testIsAllowed,
token: testToken
}
spyOn(cookieService, 'check').and.returnValue(true);
spyOn(cookieService, 'get').and.callFake((name: string) => {
if (name === environment.ffapiCommitteeIdCookieName) {
return testCommitteeId;
}
if (name === environment.ffapiEmailCookieName) {
return testEmail;
}
throw Error("fail!");
});
spyOn(store, 'dispatch');

component.dispatchUserLoggedInFromCookies();
expect(store.dispatch).toHaveBeenCalledWith(
userLoggedInAction({ payload: expectedUserLoginData }));
});

});
34 changes: 32 additions & 2 deletions front-end/src/app/dashboard/dashboard.component.ts
Original file line number Diff line number Diff line change
@@ -1,8 +1,38 @@
import { Component } from '@angular/core';
import { Component, OnInit } from '@angular/core';
import { Store } from '@ngrx/store';
import { UserLoginData } from 'app/shared/models/user.model';
import { userLoggedInAction } from 'app/store/login.actions';
import { environment } from 'environments/environment';
import { CookieService } from 'ngx-cookie-service';

@Component({
selector: 'app-dashboard',
templateUrl: './dashboard.component.html',
// styleUrls: ['./dashboard.component.scss'],
})
export class DashboardComponent {}
export class DashboardComponent implements OnInit {
constructor(
private store: Store,
private cookieService: CookieService
) { }

ngOnInit(): void {
this.dispatchUserLoggedInFromCookies();
}

dispatchUserLoggedInFromCookies() {
if (this.cookieService.check(environment.ffapiCommitteeIdCookieName)) {
const userLoginData: UserLoginData = {
committee_id: this.cookieService.get(
environment.ffapiCommitteeIdCookieName),
email: this.cookieService.get(
environment.ffapiEmailCookieName),
is_allowed: true,
token: null
}
this.cookieService.delete(environment.ffapiCommitteeIdCookieName)
this.cookieService.delete(environment.ffapiEmailCookieName)
this.store.dispatch(userLoggedInAction({ payload: userLoginData }));
}
}
}
Copy link
Contributor

@mjtravers mjtravers Jul 13, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can we drop the use of cookies and use the ngrx store 100% or is the use of cookies required?

[googling around...]

I see that the CORS_ALLOW_CRENDENTIALS setting in Django may require the use of cookies. Is that what you found, David?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@mjtravers well, the problem was that the server needs to send this data down to the client alongside a redirect. Because I couldn't use a JSON body in the redirect, I felt my only option was to pass them using cookies. This code then deletes the cookies once they are received following login.

Copy link
Contributor Author

@dheitzer dheitzer Jul 13, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It actually does ultimately store the cookie data in the store UserLoginData object, but only receives it from the server via cookies. I'm open for any suggestions on how to send these from the server though if we want to use something else.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

That works for me. Thanks for the clarification

4 changes: 4 additions & 0 deletions front-end/src/app/login/login/login.component.html
Original file line number Diff line number Diff line change
Expand Up @@ -125,6 +125,10 @@
<button type="submit" class="login__btn" [disabled]="isBusy">
<ng-template [ngIf]="true">Enter</ng-template>
</button>
&nbsp; or &nbsp;
<button type="button" (click)="navigateToLoginDotGov()" class="login-dot-gov-button">
<ng-template [ngIf]="true">Login with login.gov</ng-template>
</button>
</div>
</div>

Expand Down
5 changes: 5 additions & 0 deletions front-end/src/app/login/login/login.component.scss
Original file line number Diff line number Diff line change
Expand Up @@ -175,6 +175,11 @@
.login__btn:hover {
background-color: #c80505;
}
.login-dot-gov-button {
@extend .login__btn;
width: 240px;
margin-left: 0px;
}
.logged-out-msg {
font-size: 1em;
font-weight: bold;
Expand Down
39 changes: 37 additions & 2 deletions front-end/src/app/login/login/login.component.spec.ts
Original file line number Diff line number Diff line change
@@ -1,13 +1,42 @@
import { HttpClientTestingModule } from '@angular/common/http/testing';
import { ComponentFixture, TestBed } from '@angular/core/testing';

import { ReactiveFormsModule } from '@angular/forms';
import { RouterTestingModule } from '@angular/router/testing';
import { provideMockStore } from '@ngrx/store/testing';
import { UserLoginData } from 'app/shared/models/user.model';
import { selectUserLoginData } from 'app/store/login.selectors';
import { environment } from 'environments/environment';
import { LoginComponent } from './login.component';



describe('LoginComponent', () => {
let component: LoginComponent;
let fixture: ComponentFixture<LoginComponent>;

const userLoginData: UserLoginData = {
committee_id: 'C00000000',
email: '[email protected]',
is_allowed: true,
token: 'jwttokenstring',
};


beforeEach(async () => {
window.onbeforeunload = jasmine.createSpy();
await TestBed.configureTestingModule({
imports: [
HttpClientTestingModule,
RouterTestingModule,
ReactiveFormsModule,
],
providers: [
{ provide: Window, useValue: window },
provideMockStore({
initialState: { fecfile_online_userLoginData: userLoginData },
selectors: [{ selector: selectUserLoginData, value: userLoginData }],
}),
],
declarations: [LoginComponent],
}).compileComponents();
});
Expand All @@ -18,7 +47,13 @@ describe('LoginComponent', () => {
fixture.detectChanges();
});

xit('should create', () => {
it('should create', () => {
expect(component).toBeTruthy();
});

xit('navigateToLoginDotGov should href environment location', () => {
component.navigateToLoginDotGov();
expect(window.location.href).toEqual(environment.loginDotGovAuthUrl);
});

});
12 changes: 11 additions & 1 deletion front-end/src/app/login/login/login.component.ts
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,8 @@ import { LoginService } from '../../shared/services/login.service';
import { AuthService } from '../../shared/services/AuthService/auth.service';
import { SessionService } from '../../shared/services/SessionService/session.service';
import { UserLoginData } from 'app/shared/models/user.model';
import { Store } from '@ngrx/store';
import { userLoggedOutAction } from 'app/store/login.actions';

@Component({
selector: 'app-login',
Expand All @@ -23,12 +25,14 @@ export class LoginComponent implements OnInit {
public titleF!: string;
public titleR!: string;
public show!: boolean;
public loginDotGovAuthUrl: string | null = null;

constructor(
private fb: FormBuilder,
private loginService: LoginService,
private authService: AuthService,
private router: Router,
private store: Store,
private sessionService: SessionService
) {
this.frm = this.fb.group({
Expand All @@ -45,7 +49,9 @@ export class LoginComponent implements OnInit {
this.appTitle = environment.appTitle;
this.titleF = this.appTitle.substring(0, 3);
this.titleR = this.appTitle.substring(3);
this.loginService.logOut();
this.loginService.clearUserLoggedInCookies();
this.store.dispatch(userLoggedOutAction());
this.loginDotGovAuthUrl = environment.loginDotGovAuthUrl;
}

/**
Expand Down Expand Up @@ -104,4 +110,8 @@ export class LoginComponent implements OnInit {
showPassword() {
this.show = !this.show;
}

navigateToLoginDotGov() {
window.location.href = this.loginDotGovAuthUrl || "";
}
}
60 changes: 60 additions & 0 deletions front-end/src/app/shared/guards/login-page.guard.spec.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,60 @@
import { HttpClientTestingModule } from '@angular/common/http/testing';
import { TestBed } from '@angular/core/testing';
import { Router } from '@angular/router';
import { RouterTestingModule } from '@angular/router/testing';
import { provideMockStore } from '@ngrx/store/testing';
import { UserLoginData } from 'app/shared/models/user.model';
import { ApiService } from 'app/shared/services/api.service';
import { selectUserLoginData } from 'app/store/login.selectors';
import { LoginGuard } from './login-page.guard';


describe('LoginGuard', () => {
let guard: LoginGuard;
let apiService: ApiService;
let router: Router;

const userLoginData: UserLoginData = {
committee_id: 'C00000000',
email: '[email protected]',
is_allowed: true,
token: 'jwttokenstring',
};

beforeEach(() => {
TestBed.configureTestingModule({
imports: [HttpClientTestingModule, RouterTestingModule],
providers: [
ApiService,
provideMockStore({
initialState: { fecfile_online_userLoginData: userLoginData },
selectors: [{ selector: selectUserLoginData, value: userLoginData }],
}),
],
});
guard = TestBed.inject(LoginGuard);
apiService = TestBed.inject(ApiService);
router = TestBed.inject(Router);
});

it('should be created', () => {
expect(guard).toBeTruthy();
});

it('should reroute to dashboard if logged in', () => {
spyOn(apiService, 'isAuthenticated').and.returnValue(true);
const navigateSpy = spyOn(router, 'navigate');
const retval = guard.canActivate()
expect(navigateSpy).toHaveBeenCalledWith(['dashboard']);
expect(retval).toEqual(false);
});

it('should allow activate if not logged in', () => {
spyOn(apiService, 'isAuthenticated').and.returnValue(false);
const navigateSpy = spyOn(router, 'navigate');
const retval = guard.canActivate()
expect(navigateSpy).not.toHaveBeenCalled();
expect(retval).toEqual(true);
});

});
20 changes: 20 additions & 0 deletions front-end/src/app/shared/guards/login-page.guard.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
import { Injectable } from '@angular/core';
import { CanActivate, Router, UrlTree } from '@angular/router';
import { ApiService } from 'app/shared/services/api.service';
import { Observable } from 'rxjs';

@Injectable({
providedIn: 'root'
})
export class LoginGuard implements CanActivate {
constructor(private apiService: ApiService, private router: Router) { }
canActivate(): Observable<boolean | UrlTree> | Promise<boolean | UrlTree> | boolean | UrlTree {
if (this.apiService.isAuthenticated()) {
this.router.navigate(['dashboard']);
return false;
} else {
return true;
}
}

}
6 changes: 6 additions & 0 deletions front-end/src/app/shared/services/api.service.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -32,4 +32,10 @@ describe('ApiService', () => {
it('should be created', () => {
expect(service).toBeTruthy();
});

it('isAuthenticated should return true with committee_id set', () => {
const retval = service.isAuthenticated();
expect(retval).toBeTrue();
});

});
Loading