GeoffMahugu

{
  "name": "angular-io-example",
  "version": "1.0.0",
  "private": true,
  "description": "Example project from an angular.io guide.",
  "scripts": {
    "lint": "tslint ./src/**/*.ts -t verbose",
    "start": "ng serve",
    "test": "ng test",
    "build": "ng build --prod",

GeoffMahugu

 "scripts": {
    "e2e": "ng e2e"
 },
"devDependencies": {
  "protractor": "~5.4.0"
},

GeoffMahugu

{
  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
  "version": 1,
  "newProjectRoot": "projects",
  "projects": {
    "angular.io-example": {
      "root": "",
      "sourceRoot": "src",
      "projectType": "application",
      "prefix": "app",

GeoffMahugu

"test": {
  "builder": "@angular-devkit/build-angular:karma",
  "options": {
    "main": "src/test.ts",
    "polyfills": "src/polyfills.ts",
    "tsConfig": "src/tsconfig.spec.json",
    "karmaConfig": "src/karma.conf.js",
    "styles": [
      "src/styles.css"
    ],

GeoffMahugu

{
  "name": "angular-io-example",
  "version": "1.0.0",
  "private": true,
  "description": "Example project from an angular.io guide.",
  "scripts": {
    "lint": "tslint ./src/**/*.ts -t verbose",
    "start": "ng serve",
    "build": "ng build --prod",
    "ng": "ng",

GeoffMahugu

app
├── cypress
│    ├── fixtures
|    |    └──example.json 
|    ├── integration
|    |    └──examples
|    ├── plugins
|    |    └──index.json
|    ├── support
|    |    └──commands.js

GeoffMahugu

//Describe is the block container for the test script.
describe('My First Test', function () {
  //it: will contain the three phases for making a test
  it('Visit Landing Page', function () {
    //setup initial state by visiting the home page
    cy.visit("127.0.0.1:4200/");
    //Act: target the searchbox and type magma
    cy.get('#search-box')
      .type('magma');
    //Assert that the input has the name magma

GeoffMahugu

import { Component, OnInit } from '@angular/core';
import { WindowService } from '../core/window.service';
import { MatSnackBar } from '@angular/material';
import { Router  } from '@angular/router';
import * as firebase from 'firebase/app';
import { environment } from '../../environments/environment';
import { AuthService } from '../core/auth.service';

interface User {
  uid: string;

GeoffMahugu

<div fxLayout="column" fxLayoutWrap fxLayoutAlign="" style="margin-top: 30px;background-color: #fff; border-radius: 5px;padding-left: 10px;padding-right: 10px;padding-top: 10px; padding-bottom: 10px;">
    <div fxFlex="100" *ngIf="!windowRef.confirmationResult">
        <form fxLayout="column" fxLayoutAlign="center center">
            <div fxFlex='100' style="width: 100%;">
                <mat-form-field class="mat-form-input" style="width:100%;">
                    <span matPrefix>+254 &nbsp;</span>
                    <input matInput placeholder="Phone number" type="number" required name="phone_number" [(ngModel)]="phoneNumber.phone_number">
                    <mat-icon matSuffix style="color:#ff4081;">phone</mat-icon>
                </mat-form-field>
            </div>

GeoffMahugu

import { Injectable } from "@angular/core";
import { Router } from "@angular/router";
import * as firebase from "firebase/app";
import { AngularFireAuth } from "angularfire2/auth";
import { Observable } from "rxjs/Observable";
import "rxjs/add/operator/switchMap";
import "rxjs/add/operator/catch";
import "rxjs/observable/of";
import { MatSnackBar } from "@angular/material";
import { environment } from "../../environments/environment";