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

Refactor post components #13

Merged
merged 4 commits into from
Mar 25, 2020
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
44 changes: 44 additions & 0 deletions client/e2e/src/add-note.e2e-spec.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,44 @@
import {browser, protractor, by, element, utils} from 'protractor';
import { AddNotePage, TestNote } from './add-note.po';
import { E2EUtil } from './e2e.util';

describe('Add note', () => {
let page: AddNotePage;
const EC = protractor.ExpectedConditions;

beforeEach(() => {
page = new AddNotePage();
page.navigateTo();
});

it('Should have the correct title', () => {
expect(page.getTitle()).toEqual('New Note');
});


it('Should enable and disable the add note button', async () => {
expect(element(by.buttonText('ADD NOTE')).isEnabled()).toBe(false);
await page.typeInput('messageField', 'bit.ly/umm-cscc');
expect(element(by.buttonText('ADD NOTE')).isEnabled()).toBe(true);
});

it('Should add a new note and go to the right page', async () => {
const note: TestNote = {
owner_id: E2EUtil.randomText(14),
message: E2EUtil.randomLetters(10),
owner: E2EUtil.randomText(10),
};

await page.addNote(note);

// Wait until the URL does not contain 'notes/new
await browser.wait(EC.not(EC.urlContains('notes/new')), 10000);

const url = await page.getUrl();
expect(RegExp('/owner/78f1d3bfa098879fe7a01373/notes').test(url)).toBe(true);
expect(url.endsWith('/notes/new')).toBe(false);
});

});

/// Tried lots of things and nothing worked.
18 changes: 9 additions & 9 deletions client/e2e/src/add-post.po.ts → client/e2e/src/add-note.po.ts
Original file line number Diff line number Diff line change
@@ -1,22 +1,22 @@
import { browser, by, element, Key, ElementFinder } from 'protractor';

export interface TestPost {
export interface TestNote {
owner_id: string;
message: string;
owner: string;
}

export class AddPostPage {
export class AddNotePage {
navigateTo() {
return browser.get('/owner/78f1d3bfa098879fe7a01373/posts/new');
return browser.get('/owner/78f1d3bfa098879fe7a01373/notes/new');
}

getUrl() {
return browser.getCurrentUrl();
}

getTitle() {
const title = element(by.className('add-post-title')).getText();
const title = element(by.className('add-note-title')).getText();
return title;
}

Expand All @@ -33,12 +33,12 @@ export class AddPostPage {
});
}

clickAddPost() {
return element(by.buttonText('ADD POST')).click();
clickAddNote() {
return element(by.buttonText('ADD NOTE')).click();
}

async addPost(newPost: TestPost) {
await this.typeInput('messageField', newPost.message);
return this.clickAddPost();
async addNote(newNote: TestNote) {
await this.typeInput('messageField', newNote.message);
return this.clickAddNote();
}
}
45 changes: 0 additions & 45 deletions client/e2e/src/add-post.e2e-spec.ts

This file was deleted.

4 changes: 2 additions & 2 deletions client/e2e/src/doorboard.e2e-spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -14,9 +14,9 @@ describe('Owner Doorboard', () => {
expect(page.getPageTitle()).toEqual('Rachel Johnson');
});

it('Should have the correct first post', async () => {
it('Should have the correct first note', async () => {
page.getOwnerListItems().first();
expect(element(by.className('post-card')).getText()).toEqual(
expect(element(by.className('note-card')).getText()).toEqual(
'I\'m going to be a few minutes late to my office hours today. I got caught in traffic this morning.');
});
});
Expand Down
4 changes: 2 additions & 2 deletions client/e2e/src/doorboard.po.ts
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import {browser, by, element, Key, ElementFinder} from 'protractor';
export class DoorBoard {
// navigates to Rachel Johnson's doorboard
navigateTo() {
return browser.get('/owner/588935f57546a2daea44de7c/posts');
return browser.get('/owner/588935f57546a2daea44de7c/notes');
}

getUrl() {
Expand All @@ -16,6 +16,6 @@ export class DoorBoard {
}

getOwnerListItems() {
return element(by.className('list-of-owner-posts')).all(by.className('list-of-posts'));
return element(by.className('list-of-owner-notes')).all(by.className('list-of-notes'));
}
}
2 changes: 1 addition & 1 deletion client/e2e/src/owner-list.e2e-spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -79,7 +79,7 @@ describe('Owner list', () => {

// When the view profile button on the first owner card is clicked, the URL should have a valid mongo ID
const url = await page.getUrl();
expect(RegExp('/owner/[0-9a-fA-F]{24}/posts$', 'i').test(url)).toBe(true);
expect(RegExp('/owner/[0-9a-fA-F]{24}/notes$', 'i').test(url)).toBe(true);

});

Expand Down
6 changes: 3 additions & 3 deletions client/src/app/app-routing.module.ts
Original file line number Diff line number Diff line change
@@ -1,18 +1,18 @@
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { HomeComponent } from './home/home.component';
import { AddPostComponent } from './posts/add-post.component';
import { AddNoteComponent } from './notes/add-note.component';
import { OwnerListComponent } from './owners/owner-list.component';
import { OwnerDoorBoardComponent } from './owners/owner-doorboard.component';
import { AddOwnerComponent } from './owners/add-owner.component';


const routes: Routes = [
{path: '', component: HomeComponent},
{path: 'owner/:id/posts/new', component: AddPostComponent},
{path: 'owner/:id/notes/new', component: AddNoteComponent},
{path: 'owners', component: OwnerListComponent},
{path: 'owners/new', component: AddOwnerComponent},
{path: 'owner/:id/posts', component: OwnerDoorBoardComponent}
{path: 'owner/:id/notes', component: OwnerDoorBoardComponent}
];

@NgModule({
Expand Down
8 changes: 4 additions & 4 deletions client/src/app/app.module.ts
Original file line number Diff line number Diff line change
Expand Up @@ -29,8 +29,8 @@ import { HomeComponent } from './home/home.component';
import { OwnerService } from './owners/owner.service';
import { HttpClientModule } from '@angular/common/http';
import { LayoutModule } from '@angular/cdk/layout';
import { AddPostComponent } from './posts/add-post.component';
import { PostService } from './posts/post.service';
import { AddNoteComponent } from './notes/add-note.component';
import { NoteService } from './notes/note.service';
import { OwnerCardComponent } from './owners/owner-card.component';
import { OwnerDoorBoardComponent } from './owners/owner-doorboard.component';
import { AddOwnerComponent } from './owners/add-owner.component';
Expand Down Expand Up @@ -58,7 +58,7 @@ const MATERIAL_MODULES: any[] = [
declarations: [
AppComponent,
HomeComponent,
AddPostComponent,
AddNoteComponent,
OwnerListComponent,
OwnerCardComponent,
OwnerDoorBoardComponent,
Expand All @@ -76,7 +76,7 @@ const MATERIAL_MODULES: any[] = [
AppRoutingModule
],
providers: [
PostService,
NoteService,
OwnerService
],
bootstrap: [AppComponent]
Expand Down
Original file line number Diff line number Diff line change
@@ -1,29 +1,29 @@
<div fxLayout="row">
<div fxFlex fxFles.gt-sm="80" fxFlexOffset.gt-sm="10">
<form [formGroup]="addPostForm" (ngSubmit)="submitForm();">
<mat-card class="add-post-card">
<form [formGroup]="addNoteForm" (ngSubmit)="submitForm();">
<mat-card class="add-note-card">
<mat-card-header>
<mat-card-title class="add-post-title">New Post</mat-card-title>
<mat-card-title class="add-note-title">New Note</mat-card-title>
</mat-card-header>
<mat-card-content fxLayout="column">

<mat-form-field>
<mat-label>Message</mat-label>
<input matInput id="messageField" placeholder="Message" formControlName="message"
required>
<mat-error *ngFor="let validation of add_post_validation_messages.message">
<mat-error *ngFor="let validation of add_note_validation_messages.message">
<mat-error class="error-message" id="message-error"
*ngIf="addPostForm.get('message').hasError(validation.type) && (addPostForm.get('message').dirty || addPostForm.get('message').touched)">
*ngIf="addNoteForm.get('message').hasError(validation.type) && (addNoteForm.get('message').dirty || addNoteForm.get('message').touched)">
{{validation.message}}
</mat-error>
</mat-error>
</mat-form-field>

</mat-card-content>
<mat-card-actions align="end">
<button mat-button id="confirmAddPostButton" type="button" color="primary"
[disabled]="!addPostForm.valid" type="submit">
ADD POST
<button mat-button id="confirmAddNoteButton" type="button" color="primary"
[disabled]="!addNoteForm.valid" type="submit">
ADD NOTE
</button>
</mat-card-actions>
</mat-card>
Expand Down
Original file line number Diff line number Diff line change
@@ -1,3 +1,3 @@
.add-post-title {
.add-note-title {
font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
}
Original file line number Diff line number Diff line change
Expand Up @@ -8,15 +8,15 @@ import { MatSnackBarModule } from '@angular/material/snack-bar';
import { By } from '@angular/platform-browser';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { RouterTestingModule } from '@angular/router/testing';
import { MockPostService } from 'src/testing/post.service.mock';
import { AddPostComponent } from './add-post.component';
import { PostService } from './post.service';
import { MockNoteService } from 'src/testing/note.service.mock';
import { AddNoteComponent } from './add-note.component';
import { NoteService } from './note.service';

describe('AddPostComponent', () => {
let addPostComponent: AddPostComponent;
let addPostForm: FormGroup;
describe('AddNoteComponent', () => {
let addNoteComponent: AddNoteComponent;
let addNoteForm: FormGroup;
let calledClose: boolean;
let fixture: ComponentFixture<AddPostComponent>;
let fixture: ComponentFixture<AddNoteComponent>;

beforeEach(async(() => {
TestBed.configureTestingModule({
Expand All @@ -31,22 +31,22 @@ describe('AddPostComponent', () => {
BrowserAnimationsModule,
RouterTestingModule
],
declarations: [AddPostComponent],
providers: [{ provide: PostService, useValue: new MockPostService() }]
declarations: [AddNoteComponent],
providers: [{ provide: NoteService, useValue: new MockNoteService() }]
}).compileComponents().catch(error => {
expect(error).toBeNull();
});
}));

beforeEach(() => {
calledClose = false;
fixture = TestBed.createComponent(AddPostComponent);
addPostComponent = fixture.componentInstance;
addPostComponent.ngOnInit();
fixture = TestBed.createComponent(AddNoteComponent);
addNoteComponent = fixture.componentInstance;
addNoteComponent.ngOnInit();
fixture.detectChanges();
addPostForm = addPostComponent.addPostForm;
expect(addPostForm).toBeDefined();
expect(addPostForm.controls).toBeDefined();
addNoteForm = addNoteComponent.addNoteForm;
expect(addNoteForm).toBeDefined();
expect(addNoteForm.controls).toBeDefined();
});

// Not terribly important; if the component doesn't create
Expand All @@ -55,21 +55,21 @@ describe('AddPostComponent', () => {
// our component definitions don't have errors that would
// prevent them from being successfully constructed.
it('should create the component and form', () => {
expect(addPostComponent).toBeTruthy();
expect(addPostForm).toBeTruthy();
expect(addNoteComponent).toBeTruthy();
expect(addNoteForm).toBeTruthy();
});

// Confirms that an initial, empty form is *not* valid, so
// people can't submit an empty form.
it('form should be invalid when empty', () => {
expect(addPostForm.valid).toBeFalsy();
expect(addNoteForm.valid).toBeFalsy();
});

describe('The message field', () => {
let messageControl: AbstractControl;

beforeEach(() => {
messageControl = addPostComponent.addPostForm.controls[`message`];
messageControl = addNoteComponent.addNoteForm.controls[`message`];
});

it('should not allow empty messages', () => {
Expand Down
Loading