Fix e2e test and actually check login works

e2e/login.e2e-spec.ts

@@ -1,34 +1,59 @@
-import { HttpClientTestingModule, HttpTestingController } from '@angular/common/http/testing';
-import { TestBed, ComponentFixture, async } from '@angular/core/testing';
-import { HttpClient, HttpErrorResponse } from '@angular/common/http';
 import { LoginPageObject } from './login.po';
-import { ApiService } from '../src/app/providers/api-service';
+import { browser } from "protractor";
 
 describe('Login Page', () => {
   let page: LoginPageObject;
-  let api: ApiService;
-  let apiSpy: jasmine.SpyObj<ApiService>;
 
   beforeEach(() => {
     page = new LoginPageObject();
-    const spy = jasmine.createSpyObj
-    TestBed.configureTestingModule({ providers: [ApiService] });
+    page.navigateTo();
   });
 
-  api = TestBed.inject(ApiService);
-  apiSpy = TestBed.inject(ApiService);
-
   it('should have a header saying login', () => {
     expect(page.getLoginHeaderText()).toEqual('Login');
   });
 
   it('should have a username box of type email', () => {
-    expect(page.isUsernameFieldPresent()).toBeTruthy();
-    expect(page.getUsernameFieldType()).toEqual('email');
+    expect(page.isEmailFieldPresent()).toBeTruthy();
+    expect(page.getEmailFieldType()).toEqual('email');
   });
 
   it('should have a password box of type password', () => {
     expect(page.isPasswordFieldPresent()).toBeTruthy();
     expect(page.getPasswordFieldType()).toBe('password');
   });
+
+  it('should have a login button of type submit', () => {
+    expect(page.isLoginButtonPresent()).toBeTruthy();
+    expect(page.getLoginButtonType()).toBe('submit');
+  });
+
+  it('should have a disabled login button when empty', () => {
+    expect(page.isLoginButtonEnabled()).toBeFalsy();
+  });
+
+  it('should have a disabled login button when only email', () => {
+    page.fillEmailFieldWith('test@example.com');
+    expect(page.isLoginButtonEnabled()).toBeFalsy();
+  });
+
+  it('should have a disabled login button when only password', () => {
+    page.fillPasswordFieldWith('abc123');
+    expect(page.isLoginButtonEnabled()).toBeFalsy();
+  });
+
+  it('should have an enabled login button when both inputs filled', () => {
+    page.fillEmailFieldWith('test@example.com');
+    page.fillPasswordFieldWith('abc123');
+    expect(page.isLoginButtonEnabled()).toBeTruthy();
+  });
+
+  it('should submit the filled data when login pressed', () => {
+    page.fillEmailFieldWith('test@example.com');
+    page.fillPasswordFieldWith('abc123');
+    expect(page.isLoginButtonEnabled()).toBeTruthy();
+    page.getLoginButton().click();
+    browser.waitForAngular();
+    expect(browser.getCurrentUrl()).toContain('dashboard');
+  });
 });

e2e/login.po.ts

@@ -9,12 +9,23 @@ export class LoginPageObject {
     return element(by.css('app-root h1')).getText();
   }
 
-  getUsernameField() { return element(by.id('username')); }
+  getEmailField() { return element(by.id('username')); }
   getPasswordField() { return element(by.id('password')); }
+  getLoginButton() { return element(by.id('login')); }
 
-  isUsernameFieldPresent() { return this.getUsernameField().isPresent(); }
+  isEmailFieldPresent() { return this.getEmailField().isPresent(); }
   isPasswordFieldPresent() { return this.getPasswordField().isPresent(); }
+  isLoginButtonPresent() { return this.getLoginButton().isPresent(); }
 
-  getUsernameFieldType() { return this.getUsernameField().getAttribute('type'); }
+  getEmailFieldType() { return this.getEmailField().getAttribute('type'); }
   getPasswordFieldType() { return this.getPasswordField().getAttribute('type'); }
+  getLoginButtonType() { return this.getLoginButton().getAttribute('type'); }
+
+  isLoginButtonEnabled() { return this.getLoginButton().isEnabled(); }
+
+  clearEmailField() { return this.getEmailField().clear() };
+  clearPasswordField() { return this.getPasswordField().clear() };
+
+  fillEmailFieldWith(text) { return this.getEmailField().sendKeys(text) };
+  fillPasswordFieldWith(text) { return this.getPasswordField().sendKeys(text) };
 }