build: Ensure that contributions are valid (#57)

* test: Fixed all the tests in Angular

* feat: Validate content in the data.json

* build: Added testing to the build script (closes #56)

.travis.yml

@@ -1,11 +1,21 @@
-language: node_js
+dist: trusty
+sudo: false
 
+language: node_js
 node_js:
    - node # will use latest node
 
+addons:
+  apt:
+    sources:
+      - google-chrome
+    packages:
+      - google-chrome-stable
+
 cache: yarn
 
 script: # the build step
+   - yarn run test -- --no-watch --no-progress --browsers=ChromeHeadlessCI
    - yarn run deploy
 
 notifications:

karma.conf.js

@@ -26,6 +26,12 @@ module.exports = function (config) {
     logLevel: config.LOG_INFO,
     autoWatch: true,
     browsers: ['Chrome'],
+    customLaunchers: {
+      ChromeHeadlessCI: {
+        base: 'ChromeHeadless',
+        flags: ['--no-sandbox']
+      }
+    },
     singleRun: false
   });
 };

src/app/app.component.spec.ts

@@ -1,27 +1,30 @@
 import { TestBed, async } from '@angular/core/testing';
 import { AppComponent } from './app.component';
+import { MapComponent } from './map/map.component';
+import { MenuComponent } from './menu/menu.component';
+import { AgmCoreModule } from '@agm/core';
+import { RouterTestingModule } from '@angular/router/testing';
+import { CompanyService } from './company.service';
 describe('AppComponent', () => {
   beforeEach(async(() => {
     TestBed.configureTestingModule({
       declarations: [
-        AppComponent
+        AppComponent,
+        MapComponent,
+        MenuComponent,
       ],
+      imports: [
+        RouterTestingModule.withRoutes([]),
+        AgmCoreModule.forRoot({
+          apiKey: 'AIzaSyDqI3d8iyamjWvFSSGn1XlhTCxTBl6TBrk'
+        })
+      ],
+      providers: [CompanyService]
     }).compileComponents();
   }));
   it('should create the app', async(() => {
     const fixture = TestBed.createComponent(AppComponent);
     const app = fixture.debugElement.componentInstance;
     expect(app).toBeTruthy();
   }));
-  it(`should have as title 'app'`, async(() => {
-    const fixture = TestBed.createComponent(AppComponent);
-    const app = fixture.debugElement.componentInstance;
-    expect(app.title).toEqual('app');
-  }));
-  it('should render title in a h1 tag', async(() => {
-    const fixture = TestBed.createComponent(AppComponent);
-    fixture.detectChanges();
-    const compiled = fixture.debugElement.nativeElement;
-    expect(compiled.querySelector('h1').textContent).toContain('Welcome to app!');
-  }));
 });

src/app/app.component.ts

@@ -5,6 +5,4 @@ import { Component } from '@angular/core';
   templateUrl: './app.component.html',
   styleUrls: ['./app.component.css']
 })
-export class AppComponent {
-  title = 'app';
-}
+export class AppComponent { }

src/app/companies-by-tech/companies-by-tech.component.html

@@ -11,7 +11,7 @@ <h6 class="mb-0">{{tech}}</h6>
 <div class="card-body p-0">
   <div class="list-group list-group-flush">
     <a *ngFor="let company of companyService.companies" class="list-group-item list-group-item-action" [routerLink]="['/tech',tech,company.id]">
-      <i class="text-{{company.sponsorship || dark}} col-1 fa" [ngClass]="{'fa-building-o': !company.sponsorship, 'fa-trophy': company.sponsorship }"  aria-hidden="true"></i>
+      <i class="text-{{company?.sponsorship || 'dark'}} col-1 fa" [ngClass]="{'fa-building-o': !company?.sponsorship, 'fa-trophy': company?.sponsorship }"  aria-hidden="true"></i>
       <span class="col-10">{{company.name}}</span>
     </a>
   </div>

src/app/companies-by-tech/companies-by-tech.component.spec.ts

@@ -1,14 +1,18 @@
 import { async, ComponentFixture, TestBed } from '@angular/core/testing';
 
 import { CompaniesByTechComponent } from './companies-by-tech.component';
+import { RouterTestingModule } from '@angular/router/testing';
+import { CompanyService } from '../company.service';
 
 describe('CompaniesByTechComponent', () => {
   let component: CompaniesByTechComponent;
   let fixture: ComponentFixture<CompaniesByTechComponent>;
 
   beforeEach(async(() => {
     TestBed.configureTestingModule({
-      declarations: [ CompaniesByTechComponent ]
+      imports: [RouterTestingModule.withRoutes([])],
+      declarations: [ CompaniesByTechComponent ],
+      providers: [CompanyService]
     })
     .compileComponents();
   }));

src/app/companies/companies.component.html

@@ -11,7 +11,7 @@ <h6 class="mb-0">Companies</h6>
 <div class="card-body p-0">
   <div class="list-group list-group-flush">
     <a *ngFor="let company of companyService.companies" class="list-group-item list-group-item-action" [routerLink]="['/companies',company.id]">
-      <i class="text-{{company.sponsorship || dark}} col-1 fa" [ngClass]="{'fa-building-o': !company.sponsorship, 'fa-trophy': company.sponsorship }"  aria-hidden="true"></i>
+      <i class="text-{{company?.sponsorship || 'dark'}} col-1 fa" [ngClass]="{'fa-building-o': !company?.sponsorship, 'fa-trophy': company?.sponsorship }"  aria-hidden="true"></i>
       <span class="col-10">{{company.name}}</span>
     </a>
   </div>

src/app/companies/companies.component.spec.ts

@@ -1,14 +1,18 @@
 import { async, ComponentFixture, TestBed } from '@angular/core/testing';
 
 import { CompaniesComponent } from './companies.component';
+import { CompanyService } from '../company.service';
+import { RouterTestingModule } from '@angular/router/testing';
 
 describe('CompaniesComponent', () => {
   let component: CompaniesComponent;
   let fixture: ComponentFixture<CompaniesComponent>;
 
   beforeEach(async(() => {
     TestBed.configureTestingModule({
-      declarations: [ CompaniesComponent ]
+      imports: [RouterTestingModule.withRoutes([])],
+      declarations: [ CompaniesComponent ],
+      providers: [CompanyService]
     })
     .compileComponents();
   }));

src/app/company.service.ts

@@ -1,52 +1,50 @@
-import {Injectable} from '@angular/core'
+import {Injectable} from '@angular/core';
 
-import * as data from '../assets/data.json'
-import {SponsorshipTiers} from './sponsorship-tiers.enum'
+import * as data from '../assets/data.json';
+import {SponsorshipTiers} from './sponsorship-tiers.enum';
 
 @Injectable()
 export class CompanyService {
 
-  companies
-  techs
+  companies;
+  techs;
 
   constructor() {
-    this.companies = data.default || []
-    this.companies.sort((a, b) => this.sortCompanies(a, b))
-
-    // this.techs = Array.from(this.companies.reduce((acc, curr) => {
-    //   curr.technology.forEach(tech => acc.add(tech))
-    //   return acc
-    // }, new Set()).values())
+    this.companies = data.default.filter(d => !!d) || [];
+    this.companies.sort((a, b) => this.sortCompanies(a, b));
     this.techs = [].concat.apply([], this.companies.map(c => c.technology))
-      .filter((item, pos, self) => self.indexOf(item) == pos)
+      .filter((item, pos, self) => self.indexOf(item) === pos)
       .map(tech => ({
         name: tech,
-        percentage: Math.round(this.companies.length > 0 ? this.companies.filter(c => c.technology && c.technology.some(t => t === tech)).length / this.companies.length * 100 : 0)
+        percentage: Math.round(
+          this.companies.length > 0 ?
+            this.companies.filter(c => c.technology && c.technology.some(t => t === tech)).length / this.companies.length * 100 : 0
+        )
       }))
-      .sort((a,b) => a && b && a.percentage && b.percentage ? b.percentage - a.percentage : 0)
+      .sort((a, b) => a && b && a.percentage && b.percentage ? b.percentage - a.percentage : 0);
   }
 
   filterByTech(tech) {
-    this.companies = data.default || []
-    this.companies = this.companies.filter(company => company.technology.includes(tech)).sort((a, b) => this.sortCompanies(a, b))
+    this.companies = data.default.filter(d => !!d) || [];
+    this.companies = this.companies.filter(company => company.technology.includes(tech)).sort((a, b) => this.sortCompanies(a, b));
   }
 
   init() {
-    this.companies = data.default || []
-    this.companies.sort((a, b) => this.sortCompanies(a, b))
+    this.companies = data.default.filter(d => !!d) || [];
+    this.companies.sort((a, b) => this.sortCompanies(a, b));
   }
 
   filterById(id) {
-    this.companies = this.companies.filter(company => company.id === id).sort((a, b) => this.sortCompanies(a, b))
+    this.companies = this.companies.filter(company => company.id === id).sort((a, b) => this.sortCompanies(a, b));
   }
 
   sortCompanies(a, b) {
     return this.compareTiers(a, b) !== 0 ?
       this.compareTiers(a, b) :
-      a.name.toLowerCase().localeCompare(b.name.toLowerCase())
+      a.name.toLowerCase().localeCompare(b.name.toLowerCase());
   }
 
   compareTiers(a, b) {
-    return SponsorshipTiers[b.sponsorship as string] - SponsorshipTiers[a.sponsorship as string]
+    return !!b && !!a ? SponsorshipTiers[b.sponsorship as string] - SponsorshipTiers[a.sponsorship as string] : 0;
   }
 }

src/app/company/company.component.html

@@ -5,28 +5,28 @@
   </a>
 </div>
 <div class="card-header">
-  <h6 class="mb-0">{{companyService.companies[0].name}}</h6>
+  <h6 class="mb-0">{{companyService?.companies[0]?.name}}</h6>
   <small>&nbsp;</small>
 </div>
 <div class="card-body">
-  <div *ngIf="companyService.companies[0].sponsorship">
+  <div *ngIf="companyService?.companies[0]?.sponsorship">
     <p class="font-weight-bold">Sponsorship Tier:</p>
-    <p>{{companyService.companies[0].sponsorship | titlecase}} Sponsor</p>
+    <p>{{companyService?.companies[0]?.sponsorship | titlecase}} Sponsor</p>
   </div>
   <div class="my-3">
     <p class="font-weight-bold">Address:</p>
-    <p>{{companyService.companies[0].address}}</p>
+    <p>{{companyService?.companies[0]?.address}}</p>
   </div>
   <div class="my-3">
     <p class="font-weight-bold">Website:</p>
-    <p><a [href]="companyService.companies[0].website">{{companyService.companies[0].website}}</a></p>
+    <p><a [href]="companyService?.companies[0]?.website">{{companyService.companies[0]?.website}}</a></p>
   </div>
   <div class="row mt-3">
     <div class="col-12 font-weight-bold">
       Tech:
     </div>
     <div class="col-12 mt-3">
-      <button *ngFor="let tech of companyService.companies[0].technology" type="button"
+      <button *ngFor="let tech of companyService?.companies[0]?.technology" type="button"
               class="btn btn-outline-info mr-3 mb-3" [routerLink]="['/tech',tech]">
         {{tech}}
       </button>

src/app/company/company.component.spec.ts

@@ -1,14 +1,18 @@
 import { async, ComponentFixture, TestBed } from '@angular/core/testing';
 
 import { CompanyComponent } from './company.component';
+import { RouterTestingModule } from '@angular/router/testing';
+import { CompanyService } from '../company.service';
 
 describe('CompanyComponent', () => {
   let component: CompanyComponent;
   let fixture: ComponentFixture<CompanyComponent>;
 
   beforeEach(async(() => {
     TestBed.configureTestingModule({
-      declarations: [ CompanyComponent ]
+      imports: [RouterTestingModule.withRoutes([])],
+      declarations: [ CompanyComponent ],
+      providers: [CompanyService]
     })
     .compileComponents();
   }));

src/app/filter-by/filter-by.component.spec.ts

@@ -1,13 +1,15 @@
 import { async, ComponentFixture, TestBed } from '@angular/core/testing';
 
 import { FilterByComponent } from './filter-by.component';
+import { RouterTestingModule } from '@angular/router/testing';
 
 describe('FilterByComponent', () => {
   let component: FilterByComponent;
   let fixture: ComponentFixture<FilterByComponent>;
 
   beforeEach(async(() => {
     TestBed.configureTestingModule({
+      imports: [RouterTestingModule.withRoutes([])],
       declarations: [ FilterByComponent ]
     })
     .compileComponents();

src/app/industries.ts

@@ -0,0 +1,27 @@
+export enum IndustryType {
+  'Agriculture' = 'Agriculture',
+  'Cloud-based solutions or services' = 'Cloud-based solutions or services',
+  'Consulting' = 'Consulting',
+  'Data and analytics' = 'Data and analytics',
+  'Education and training' = 'Education and training',
+  'Energy or utilities' = 'Energy or utilities',
+  'Financial and banking' = 'Financial and banking',
+  'Government or public administration' = 'Government or public administration',
+  'Health care or social services' = 'Health care or social services',
+  'Information technology' = 'Information technology',
+  'Internet' = 'Internet',
+  'Manufacturing' = 'Manufacturing',
+  'Marketing' = 'Marketing',
+  'Media, advertising, publishing, or entertainment' = 'Media, advertising, publishing, or entertainment',
+  'Nonprofit' = 'Nonprofit',
+  'Real estate' = 'Real estate',
+  'Research - academic or scientific' = 'Research - academic or scientific',
+  'Retail or ecommerce' = 'Retail or ecommerce',
+  'Security' = 'Security',
+  'Software as a service (saas) development' = 'Software as a service (saas) development',
+  'Software development - other' = 'Software development - other',
+  'Telecommunications' = 'Telecommunications',
+  'Transportation' = 'Transportation',
+  'Travel' = 'Travel',
+  'Web development or design' = 'Web development or design',
+}

src/app/map/map.component.html

@@ -1,5 +1,5 @@
 <agm-map [latitude]="lat" [longitude]="lng" [zoom]="zoom">
   <ng-container *ngFor="let d of companyService.companies">
-    <agm-marker [iconUrl]="d.sponsorship ? './assets/icons/'+d.sponsorship+'-dot.png' : ''" [zIndex]="getZIndex(d.sponsorship)" [latitude]="d.lat" [longitude]="d.lng" [title]="d.name" (markerClick)="goto(d.id)"></agm-marker>
+    <agm-marker [iconUrl]="d?.sponsorship ? './assets/icons/'+d?.sponsorship+'-dot.png' : ''" [zIndex]="getZIndex(d?.sponsorship)" [latitude]="d?.lat" [longitude]="d?.lng" [title]="d?.name" (markerClick)="goto(d?.id)"></agm-marker>
   </ng-container>
 </agm-map>

src/app/map/map.component.spec.ts

@@ -0,0 +1,34 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { RouterTestingModule } from '@angular/router/testing';
+import { CompanyService } from '../company.service';
+import { MapComponent } from './map.component';
+import { AgmCoreModule } from '@agm/core';
+
+describe('MapComponent', () => {
+  let component: MapComponent;
+  let fixture: ComponentFixture<MapComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      imports: [
+        RouterTestingModule.withRoutes([]),
+        AgmCoreModule.forRoot({
+          apiKey: 'AIzaSyDqI3d8iyamjWvFSSGn1XlhTCxTBl6TBrk'
+        })
+      ],
+      declarations: [ MapComponent ],
+      providers: [CompanyService]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(MapComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/menu/menu.component.spec.ts

@@ -0,0 +1,28 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { RouterTestingModule } from '@angular/router/testing';
+import { CompanyService } from '../company.service';
+import { MenuComponent } from './menu.component';
+
+describe('MenuComponent', () => {
+  let component: MenuComponent;
+  let fixture: ComponentFixture<MenuComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      imports: [RouterTestingModule.withRoutes([])],
+      declarations: [ MenuComponent ],
+      providers: [CompanyService]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(MenuComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});