Form value not updating

I'm new in testing and till now have succedded in setting up Testing using the ng-cli. I am currently testing a simple login form. This is how far I've come up with

login.component.ts

import { Component, OnInit } from '@angular/core';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { ActivatedRoute, Router } from '@angular/router';
import { AuthService } from '../auth.service';

@Component({
  selector: 'app-login',
  templateUrl: './login.component.html'
})
export class LoginComponent implements OnInit {
  loginForm: FormGroup;
  showError: boolean = false;
  verfiedUser: boolean = true;

  constructor(public fb: FormBuilder, private _router: Router, private _activatedRoute: ActivatedRoute, private auth: AuthService) { }

  ngOnInit() {
    this.loginForm = this.fb.group({
      username: ['', Validators.required],
      password: ['', Validators.required]
    });

    this._activatedRoute.params.subscribe(params => this.verfiedUser = (params['verified'] === 'true'));
  }

  loginPassword (value): void {
    // this.auth.login(value.username, value.password).subscribe(response => console.log(response), err => console.log(err));
  }
}

login.spec.ts

import { async, ComponentFixture, TestBed, tick } from '@angular/core/testing';
import { By }              from '@angular/platform-browser';
import { DebugElement }    from '@angular/core';
import { FormGroup, ReactiveFormsModule } from '@angular/forms';
import { LoginComponent } from './login.component';
import {
  ActivatedRoute, ActivatedRouteStub, click, newEvent, Router, RouterStub
} from '../testing';
import { RouterTestingModule } from '@angular/router/testing';
import { AuthService } from '../auth.service';

import {
  HttpModule, Http, XHRBackend, Response, ResponseOptions
} from '@angular/http';

import { AppModule } from '../app.module';

function createEvent(eventType: any): Event {
  const evt: Event = document.createEvent('Event');
  evt.initEvent(eventType, true, true);
  return evt;
}

describe('LoginComponent (templateUrl)', () => {

  let comp:    LoginComponent;
  let fixture: ComponentFixture<LoginComponent>;
  let de:      DebugElement;
  let el:      HTMLElement;
  let loginForm: FormGroup;

  // async beforeEach
  beforeEach(async(() => {
    let activatedRoute = new ActivatedRouteStub();

    TestBed.configureTestingModule({
      imports: [AppModule]
    })
    .compileComponents();  // compile template and css
  }));

  // synchronous beforeEach
  beforeEach(() => {
    fixture = TestBed.createComponent(LoginComponent);

    comp = fixture.componentInstance; // BannerComponent test instance
    loginForm = comp.loginForm;
  });

  it('should have a login form which is clean and disabled', () => {
    const loginBtn: DebugElement = fixture.debugElement.query(By.css('.login-form button[type="submit"]'));

    console.log(comp, comp.loginForm, loginForm);
    fixture.detectChanges();

    console.log(comp, comp.loginForm, loginForm);

    expect(comp.loginForm.value).toEqual({
      username: '',
      password: ''
    }, 'does not match');

    expect(loginBtn.nativeElement.disabled).toBe(true);
  });

});

I'm currently stuck with these errors. 1. loginForm is undefined, though comp and comp.loginForm is defined. 2. Even after fixture.detectChanges() the form is not updating.

Any help, in the right direction will help.

Thanks,