Merge pull request #26 from sartography/testing

Testing

.travis.yml

@@ -16,12 +16,12 @@ services:
 
 before_install:
   - |
-    branches=('dev' 'testing' 'demo' 'training' 'staging')
+    if [[ $TRAVIS_BRANCH =~ ^(dev|testing|demo|training|staging|rrt\/.*)$ ]]; then
-    if [[ " ${arr[@]} " =~ " ${TRAVIS_BRANCH} " ]]; then
+      export E2E_TAG="${TRAVIS_BRANCH//\//_}"
-      export E2E_TAG="$TRAVIS_BRANCH"
     else
       export E2E_TAG="latest"
     fi
+    echo "E2E_TAG = $E2E_TAG"
 
 install:
   - npm install

karma.globals.js

@@ -2,4 +2,5 @@ var ENV = {
   production: 'false',
   api: 'apiRoot',
   irbUrl: 'irbUrl',
+  homeRoute: 'home',
 };

package-lock.json

@@ -12291,9 +12291,9 @@
       "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg=="
     },
     "sartography-workflow-lib": {
-      "version": "0.0.164",
+      "version": "0.0.170",
-      "resolved": "https://registry.npmjs.org/sartography-workflow-lib/-/sartography-workflow-lib-0.0.164.tgz",
+      "resolved": "https://registry.npmjs.org/sartography-workflow-lib/-/sartography-workflow-lib-0.0.170.tgz",
-      "integrity": "sha512-0sbIR8gkXfPOJOJzHQyzzo7mIS9W8bLiQW/pzp/RWATj0j+MGn9z6aPKQBs6PKUP0KMzAOXfXywkR3e3aPJSoA=="
+      "integrity": "sha512-bLj7scU+z2lafzPmbpAAqLoGJZX0e2t1PZq5C4sqWIU/vuq3xf5dQGFL7nOyWpfxGchxWjszi1+9LqC2PhSJtw=="
     },
     "sass": {
       "version": "1.23.3",

package.json

@@ -52,7 +52,7 @@
     "ngx-file-drop": "^8.0.8",
     "ngx-markdown": "^9.0.0",
     "rxjs": "~6.5.4",
-    "sartography-workflow-lib": "^0.0.164",
+    "sartography-workflow-lib": "^0.0.170",
     "tslib": "^1.11.1",
     "uuid": "^7.0.2",
     "zone.js": "^0.10.3"

src/app/app-routing.module.ts

@@ -4,6 +4,8 @@ import {SessionRedirectComponent} from 'sartography-workflow-lib';
 import {environment} from '../environments/environment.runtime';
 import {HomeComponent} from './home/home.component';
 import {ModelerComponent} from './modeler/modeler.component';
+import {ProtocolBuilderComponent} from './protocol-builder/protocol-builder.component';
+import {ReferenceFilesComponent} from './reference-files/reference-files.component';
 import {SignInComponent} from './sign-in/sign-in.component';
 import {SignOutComponent} from './sign-out/sign-out.component';
 
@@ -18,6 +20,14 @@ const routes: Routes = [
     path: 'home',
     component: HomeComponent
   },
+  {
+    path: 'pb',
+    component: ProtocolBuilderComponent
+  },
+  {
+    path: 'reffiles',
+    component: ReferenceFilesComponent
+  },
   {
     path: 'modeler/:workflowSpecId',
     component: ModelerComponent

src/app/app.module.ts

@@ -49,6 +49,8 @@ import {SignInComponent} from './sign-in/sign-in.component';
 import {SignOutComponent} from './sign-out/sign-out.component';
 import {WorkflowSpecCardComponent} from './workflow-spec-card/workflow-spec-card.component';
 import {WorkflowSpecListComponent} from './workflow-spec-list/workflow-spec-list.component';
+import { ProtocolBuilderComponent } from './protocol-builder/protocol-builder.component';
+import { ReferenceFilesComponent } from './reference-files/reference-files.component';
 
 @Injectable()
 export class ThisEnvironment implements AppEnvironment {
@@ -81,6 +83,8 @@ export class ThisEnvironment implements AppEnvironment {
     HomeComponent,
     WorkflowSpecCardComponent,
     ApiErrorsComponent,
+    ProtocolBuilderComponent,
+    ReferenceFilesComponent,
   ],
   imports: [
     BrowserAnimationsModule,

src/app/file-list/file-list.component.ts

@@ -96,7 +96,7 @@ export class FileListComponent implements OnInit {
       fileMetaId: fm ? fm.id : undefined,
       file: file,
       mode: 'local',
-      fileTypes: [FileType.DOCX],
+      fileTypes: [FileType.DOC, FileType.DOCX, FileType.XLSX, FileType.XLS],
     };
     const dialogRef = this.dialog.open(OpenFileDialogComponent, {data: dialogData});
 

src/app/navbar/navbar.component.ts

@@ -47,8 +47,9 @@ export class NavbarComponent {
   private _loadNavLinks() {
     const displayName = this.user.display_name || this.user.first_name || this.user.last_name;
     this.navLinks = [
-      {path: '/', id: 'nav_home', label: 'Home'},
+      {path: '/home', id: 'nav_home', label: 'Configurator'},
-      {path: '/inbox', id: 'nav_inbox', label: 'Inbox'},
+      {path: '/pb', id: 'nav_pb', label: 'Protocol Builder Tester'},
+      {path: '/reffiles', id: 'nav_reffiles', label: 'Reference Files'},
       {path: '/help', id: 'nav_help', label: 'Help'},
       {
         id: 'nav_account', label: `${displayName} (${this.user.email_address})`,

src/app/protocol-builder/protocol-builder.component.html

@@ -0,0 +1,4 @@
+<div class="full-height" fxLayout="column" fxLayoutAlign="center center">
+  <h1>Protocol Builder Tester</h1>
+  <p>(Coming soon)</p>
+</div>

src/app/protocol-builder/protocol-builder.component.spec.ts

@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ProtocolBuilderComponent } from './protocol-builder.component';
+
+describe('ProtocolBuilderComponentComponent', () => {
+  let component: ProtocolBuilderComponent;
+  let fixture: ComponentFixture<ProtocolBuilderComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ ProtocolBuilderComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(ProtocolBuilderComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/protocol-builder/protocol-builder.component.ts

@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-protocol-builder',
+  templateUrl: './protocol-builder.component.html',
+  styleUrls: ['./protocol-builder.component.scss']
+})
+export class ProtocolBuilderComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit(): void {
+  }
+
+}

src/app/reference-files/reference-files.component.html

@@ -0,0 +1,12 @@
+<div class="container" fxLayout="column" fxLayoutGap="40px">
+  <h1>Reference Files</h1>
+
+  <div *ngFor="let refFile of referenceFiles" fxLayout="row" fxLayoutGap="40px">
+    <h3>{{refFile.name}}</h3>
+    <div class="file-buttons" fxLayout="row" fxLayoutGap="10px">
+      <button mat-icon-button (click)="downloadFile(refFile)" color="primary"><mat-icon>save_alt</mat-icon></button>
+      <button mat-icon-button (click)="openFileDialog(refFile)" color="primary"><mat-icon>edit</mat-icon></button>
+    </div>
+  </div>
+</div>
+

src/app/reference-files/reference-files.component.spec.ts

@@ -0,0 +1,123 @@
+import {HttpHeaders} from '@angular/common/http';
+import {HttpClientTestingModule, HttpTestingController} from '@angular/common/http/testing';
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import {MAT_DIALOG_DATA, MatDialogModule, MatDialogRef} from '@angular/material/dialog';
+import {MatIconModule} from '@angular/material/icon';
+import {MatSnackBarModule} from '@angular/material/snack-bar';
+import {BrowserDynamicTestingModule} from '@angular/platform-browser-dynamic/testing';
+import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
+import {of} from 'rxjs';
+import {ApiService, FileMeta, FileType, MockEnvironment, mockFileMetaReference0} from 'sartography-workflow-lib';
+import {OpenFileDialogComponent} from '../_dialogs/open-file-dialog/open-file-dialog.component';
+import * as FileSaver from 'file-saver';
+import { ReferenceFilesComponent } from './reference-files.component';
+import createClone from 'rfdc';
+
+describe('ReferenceFilesComponent', () => {
+  let httpMock: HttpTestingController;
+  let component: ReferenceFilesComponent;
+  let fixture: ComponentFixture<ReferenceFilesComponent>;
+
+  // Mock file and response headers
+  const mockDocMeta: FileMeta = createClone()(mockFileMetaReference0);
+  mockDocMeta.type = FileType.XLSX;
+
+  const expectedFile = new File([], mockDocMeta.name, {
+    type: mockDocMeta.content_type,
+    lastModified: mockDocMeta.file.lastModified
+  });
+
+  const mockHeaders = new HttpHeaders()
+    .append('last-modified', expectedFile.lastModified.toString())
+    .append('content-type', mockDocMeta.content_type);
+
+  const mockArrayBuffer = new ArrayBuffer(8);
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      imports: [
+        BrowserAnimationsModule,
+        HttpClientTestingModule,
+        MatDialogModule,
+        MatIconModule,
+        MatSnackBarModule,
+      ],
+      declarations: [
+        OpenFileDialogComponent,
+        ReferenceFilesComponent,
+      ],
+      providers: [
+        ApiService,
+        {provide: 'APP_ENVIRONMENT', useClass: MockEnvironment},
+        {
+          provide: MatDialogRef,
+          useValue: {
+            close: (dialogResult: any) => {
+            }
+          }
+        },
+        {provide: MAT_DIALOG_DATA, useValue: []},
+      ]
+    }).overrideModule(BrowserDynamicTestingModule, {
+      set: {
+        entryComponents: [
+          OpenFileDialogComponent,
+        ]
+      }
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(ReferenceFilesComponent);
+    component = fixture.componentInstance;
+    httpMock = TestBed.inject(HttpTestingController);
+    fixture.detectChanges();
+
+    const req = httpMock.expectOne('apiRoot/reference_file');
+    expect(req.request.method).toEqual('GET');
+    req.flush([mockFileMetaReference0]);
+    expect(component.referenceFiles.length).toEqual(1);
+  });
+
+  afterEach(() => {
+    httpMock.verify();
+    fixture.destroy();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+
+  it('should update existing file from file dialog', () => {
+    const openDialogSpy = spyOn(component.dialog, 'open')
+      .and.returnValue({afterClosed: () => of({fileMetaId: mockFileMetaReference0.id, file: mockFileMetaReference0.file})} as any);
+    const _loadReferenceFilesSpy = spyOn((component as any), '_loadReferenceFiles').and.stub();
+
+    component.openFileDialog(mockFileMetaReference0);
+
+    const fReq = httpMock.expectOne(`apiRoot/reference_file/${mockDocMeta.name}`);
+    expect(fReq.request.method).toEqual('GET');
+    fReq.flush(mockArrayBuffer, {headers: mockHeaders});
+
+    const updateReq = httpMock.expectOne(`apiRoot/reference_file/${mockFileMetaReference0.name}`);
+    expect(updateReq.request.method).toEqual('PUT');
+    updateReq.flush(mockArrayBuffer, {headers: mockHeaders});
+
+    expect(openDialogSpy).toHaveBeenCalled();
+    expect(_loadReferenceFilesSpy).toHaveBeenCalled();
+  });
+
+  it('should save file', () => {
+    const fileSaverSpy = spyOn(FileSaver, 'saveAs').and.stub();
+
+    component.downloadFile(mockDocMeta);
+
+    const fReq = httpMock.expectOne(`apiRoot/reference_file/${mockDocMeta.name}`);
+    expect(fReq.request.method).toEqual('GET');
+    fReq.flush(mockArrayBuffer, {headers: mockHeaders});
+
+    expect(fileSaverSpy).toHaveBeenCalled();
+  });
+
+});

src/app/reference-files/reference-files.component.ts

@@ -0,0 +1,62 @@
+import {Component, OnInit} from '@angular/core';
+import {MatDialog} from '@angular/material/dialog';
+import {MatSnackBar} from '@angular/material/snack-bar';
+import * as fileSaver from 'file-saver';
+import {ApiService, FileMeta, FileType} from 'sartography-workflow-lib';
+import {OpenFileDialogComponent} from '../_dialogs/open-file-dialog/open-file-dialog.component';
+import {OpenFileDialogData} from '../_interfaces/dialog-data';
+
+@Component({
+  selector: 'app-reference-files',
+  templateUrl: './reference-files.component.html',
+  styleUrls: ['./reference-files.component.scss']
+})
+export class ReferenceFilesComponent implements OnInit {
+  referenceFiles: FileMeta[];
+
+  constructor(
+    private apiService: ApiService,
+    public dialog: MatDialog,
+    private snackBar: MatSnackBar,
+  ) {
+    this._loadReferenceFiles();
+  }
+
+  ngOnInit(): void {
+  }
+
+  _loadReferenceFiles() {
+    this.apiService.listReferenceFiles().subscribe(f => this.referenceFiles = f);
+  }
+
+  openFileDialog(fm: FileMeta) {
+    this.apiService.getReferenceFile(fm.name).subscribe(oldFile => {
+      const dialogData: OpenFileDialogData = {
+        fileMetaId: fm.id,
+        file: new File([oldFile.body], fm.name, {
+          type: fm.content_type,
+          lastModified: parseInt(oldFile.headers.get('last-modified'), 10)
+        }),
+        mode: 'local',
+        fileTypes: [FileType.XLSX, FileType.XLS],
+      };
+      const dialogRef = this.dialog.open(OpenFileDialogComponent, {data: dialogData});
+
+      dialogRef.afterClosed().subscribe((data: OpenFileDialogData) => {
+        if (data && data.file) {
+          this.apiService.updateReferenceFile(fm.name, data.file).subscribe(() => {
+          this.snackBar.open(`Updated file ${fm.name}.`, 'Ok', {duration: 3000});
+            this._loadReferenceFiles();
+          });
+        }
+      });
+    });
+  }
+
+  downloadFile(fm: FileMeta) {
+    this.apiService.getReferenceFile(fm.name).subscribe(response => {
+      const blob = new Blob([response.body], {type: fm.content_type});
+      fileSaver.saveAs(blob, fm.name);
+    });
+  }
+}

src/environments/environment.runtime.ts

@@ -2,14 +2,11 @@ import {AppEnvironment} from 'sartography-workflow-lib';
 
 declare var ENV;
 
-const envHas = (key, temp): boolean => (ENV && (ENV[key] !== null) && (ENV[key] !== undefined) && (ENV[key] !== temp));
+export const _has = (env, key, temp): boolean => env && ![null, undefined, temp, ''].includes(env[key]);
 
 export const environment: AppEnvironment = {
-  homeRoute: envHas('homeRoute', '$HOME_ROUTE') ? ENV.homeRoute : 'home',
+  homeRoute: _has(ENV, 'homeRoute', '$HOME_ROUTE') ? ENV.homeRoute : 'home',
-  production: envHas('production', '$PRODUCTION') ? (ENV.production === 'true') : false,
+  production: _has(ENV, 'production', '$PRODUCTION') ? (ENV.production === 'true') : false,
-  api: envHas('api', '$API_URL') ? ENV.api : 'http://localhost:5000/v1.0',
+  api: _has(ENV, 'api', '$API_URL') ? ENV.api : 'http://localhost:5000/v1.0',
-  irbUrl: envHas('irbUrl', '$IRB_URL') ? ENV.irbUrl : 'http://localhost:5001',
+  irbUrl: _has(ENV, 'irbUrl', '$IRB_URL') ? ENV.irbUrl : 'http://localhost:5001',
 };
-
-
-

src/environments/environment.spec.ts

@@ -1,5 +1,6 @@
-import {environment} from './environment.runtime';
+import {_has, environment} from './environment.runtime';
 
+declare var ENV;
 
 describe('Environments', () => {
   it('should have settings for all the environments', () => {
@@ -7,5 +8,40 @@ describe('Environments', () => {
     expect(environment.production).toEqual(false);
     expect(environment.api).toEqual('apiRoot');
     expect(environment.irbUrl).toEqual('irbUrl');
+    expect(environment.homeRoute).toEqual('home');
+  });
+
+  it('should check if environment variables are defined', () => {
+    const env = {
+      homeRoute: '$HOME_ROUTE',
+      production: '$PRODUCTION',
+      api: '$API_URL',
+      irbUrl: '$IRB_URL',
+    };
+
+    expect(_has(env, 'homeRoute', '$HOME_ROUTE')).toBeFalse();
+    expect(_has(env, 'production', '$PRODUCTION')).toBeFalse();
+    expect(_has(env, 'api', '$API_URL')).toBeFalse();
+    expect(_has(env, 'irbUrl', '$IRB_URL')).toBeFalse();
+
+    env.homeRoute = undefined;
+    env.production = undefined;
+    env.api = undefined;
+    env.irbUrl = undefined;
+
+    expect(_has(env, 'homeRoute', '$HOME_ROUTE')).toBeFalse();
+    expect(_has(env, 'production', '$PRODUCTION')).toBeFalse();
+    expect(_has(env, 'api', '$API_URL')).toBeFalse();
+    expect(_has(env, 'irbUrl', '$IRB_URL')).toBeFalse();
+
+    env.homeRoute = 'something';
+    env.production = 'something';
+    env.api = 'something';
+    env.irbUrl = 'something';
+
+    expect(_has(env, 'homeRoute', '$HOME_ROUTE')).toBeTrue();
+    expect(_has(env, 'production', '$PRODUCTION')).toBeTrue();
+    expect(_has(env, 'api', '$API_URL')).toBeTrue();
+    expect(_has(env, 'irbUrl', '$IRB_URL')).toBeTrue();
   });
 });