Merge pull request #2692 from Azure/dev

Deployment

Author: hartra344

client/.angular-cli.json

@@ -62,7 +62,10 @@
         "src/**/*.spec.ts",
         "src/app/shared/**/*.ts",
         "src/app/pickers/microsoft-graph/microsoft-graph-helper.ts",
-        "**/radio-selector/**"
+        "**/radio-selector/**",
+        "**/try-now-busy-state/**",
+        "**/load-image.directive.ts",
+        "**/pop-over/**"
       ]
     },
     "karma": {

client/package.json

@@ -36,7 +36,7 @@
         "marked": "^0.3.9",
         "moment-mini-ts": "^2.20.1",
         "monaco-editor": "^0.10.0",
-        "ng-sidebar": "^6.0.1",
+        "ng-sidebar": "^7.1.0",
         "ng2-cookies": "^1.0.3",
         "ng2-file-upload": "~1.2.1",
         "ng2-popover": "^0.0.14",

client/src/app/api/api-details/api-details.component.ts

@@ -16,6 +16,7 @@ import { AiService } from '../../shared/services/ai.service';
 import { RequestResposeOverrideComponent } from '../request-respose-override/request-respose-override.component';
 import { ArmSiteDescriptor } from '../../shared/resourceDescriptors';
 import { NavigableComponent, ExtendedTreeViewInfo } from '../../shared/components/navigable-component';
+import { SiteService } from '../../shared/services/site.service';
 
 @Component({
     selector: 'api-details',
@@ -42,6 +43,7 @@ export class ApiDetailsComponent extends NavigableComponent implements OnDestroy
         private _translateService: TranslateService,
         private _aiService: AiService,
         private _functionAppService: FunctionAppService,
+        private _siteService: SiteService,
         injector: Injector) {
         super('api-details', injector, DashboardType.ProxyDashboard);
 
@@ -62,7 +64,7 @@ export class ApiDetailsComponent extends NavigableComponent implements OnDestroy
                         this.initEdit();
                         return Observable.zip(
                             this._functionAppService.getApiProxies(context),
-                            this._functionAppService.getFunctionAppAzureAppSettings(context));
+                            this._siteService.getAppSettings(context.site.id));
                     });
             })
             .do(r => {

client/src/app/api/api-new/api-new.component.ts

@@ -15,6 +15,7 @@ import { FunctionInfo } from '../../shared/models/function-info';
 import { errorIds } from '../../shared/models/error-ids';
 import { RequestResposeOverrideComponent } from '../request-respose-override/request-respose-override.component';
 import { NavigableComponent } from '../../shared/components/navigable-component';
+import { SiteService } from '../../shared/services/site.service';
 
 @Component({
     selector: 'api-new',
@@ -55,6 +56,7 @@ export class ApiNewComponent extends NavigableComponent {
         private _translateService: TranslateService,
         private _aiService: AiService,
         private _functionAppService: FunctionAppService,
+        private _siteService: SiteService,
         fb: FormBuilder,
         injector: Injector) {
         super('api-new', injector, DashboardType.CreateProxyDashboard);
@@ -94,7 +96,7 @@ export class ApiNewComponent extends NavigableComponent {
                         return Observable.zip(
                             this._functionAppService.getFunctions(context),
                             this._functionAppService.getApiProxies(context),
-                            this._functionAppService.getFunctionAppAzureAppSettings(context),
+                            this._siteService.getAppSettings(context.site.id),
                             (f, p, a) => ({ fcs: f, proxies: p, appSettings: a, context: context }));
                     });
             })

client/src/app/binding/binding.component.ts

@@ -17,6 +17,7 @@ import { FunctionInfo } from '../shared/models/function-info';
 import { FunctionAppService } from 'app/shared/services/function-app.service';
 import { FunctionAppContext } from 'app/shared/function-app-context';
 import { FunctionAppContextComponent } from 'app/shared/components/function-app-context-component';
+import { SiteService } from '../shared/services/site.service';
 
 declare var marked: any;
 
@@ -59,6 +60,7 @@ export class BindingComponent extends FunctionAppContextComponent implements OnD
     constructor(@Inject(ElementRef) elementRef: ElementRef,
         broadcastService: BroadcastService,
         private _functionAppService: FunctionAppService,
+        private _siteService: SiteService,
         private _portalService: PortalService,
         private _cacheService: CacheService,
         private _translateService: TranslateService,
@@ -116,7 +118,7 @@ export class BindingComponent extends FunctionAppContextComponent implements OnD
             .switchMap(viewInfo => {
                 // TODO: [alrod] handle error
                 this._functionInfo = viewInfo.functionInfo.result;
-                return this._functionAppService.getFunctionAppAzureAppSettings(viewInfo.context);
+                return this._siteService.getAppSettings(viewInfo.context.site.id);
             })
             .subscribe(appSettingsResult => {
                 // TODO: [alrod] handle error

client/src/app/busy-state/busy-state.component.spec.ts

@@ -0,0 +1,81 @@
+import { TestBed, ComponentFixture, fakeAsync, tick } from '@angular/core/testing';
+import { async } from 'q';
+import { BusyStateComponent } from './busy-state.component';
+import { TryNowBusyStateComponent } from '../try-now-busy-state/try-now-busy-state.component';
+import { MockComponent } from 'ng-mocks';
+import { BroadcastService } from '../shared/services/broadcast.service';
+import { MockLogService } from '../test/mocks/log.service.mock';
+import { LogService } from '../shared/services/log.service';
+import { Component, ViewChild } from '@angular/core';
+import { BusyStateScopeManager } from './busy-state-scope-manager';
+
+@Component({
+    selector: `app-host-component`,
+    template: `<busy-state name="global"></busy-state>`
+})
+class TestBusyStateHostComponent {
+    @ViewChild(BusyStateComponent)
+    public busyStateComponent: BusyStateComponent;
+
+    private _busyManager: BusyStateScopeManager;
+
+    constructor(broadcastService: BroadcastService) {
+        this._busyManager = new BusyStateScopeManager(broadcastService, 'global');
+    }
+
+    public setBusy() {
+        this._busyManager.setBusy();
+    }
+
+    public clearBusy() {
+        this._busyManager.clearBusy();
+    }
+}
+describe('BusyStateComponent', () => {
+
+    let busyStateComponent: BusyStateComponent;
+    let hostComponent: TestBusyStateHostComponent;
+    let testFixture: ComponentFixture<TestBusyStateHostComponent>;
+
+    beforeEach(async(() => {
+        TestBed.configureTestingModule({
+            declarations: [BusyStateComponent, TestBusyStateHostComponent, MockComponent(TryNowBusyStateComponent)],
+            providers: [
+                BroadcastService,
+                { provide: LogService, useClass: MockLogService }
+            ],
+            imports: []
+        })
+            .compileComponents();
+
+    }));
+
+    beforeEach(() => {
+        testFixture = TestBed.createComponent(TestBusyStateHostComponent);
+        hostComponent = testFixture.componentInstance;
+        busyStateComponent = hostComponent.busyStateComponent;
+        testFixture.detectChanges();
+    });
+
+    describe('init', () => {
+        it('component show init', () => {
+            expect(busyStateComponent).toBeTruthy();
+        });
+    });
+
+    describe('public use', () => {
+        it('set busy broadcast should set busy state to true', fakeAsync(() => {
+            hostComponent.setBusy();
+            tick(100); // wait 100 ms for debounce time
+            expect(busyStateComponent.busy).toBeTruthy();
+        }));
+
+        it('clear busy broadcast should set busy state to false', fakeAsync(() => {
+            hostComponent.setBusy();
+            tick(100); // wait 100 ms for debounce time
+            hostComponent.clearBusy();
+            tick(100);
+            expect(busyStateComponent.busy).toBeFalsy();
+        }));
+    });
+});

client/src/app/controls/card-info-control/card-info-control.component.scss

@@ -3,7 +3,10 @@
     vertical-align: middle
 }
 .cardContainer {
-    padding: 25px 25px;
+   padding-top: 10px;
+   padding-left: 25px;
+   padding-right: 25px;
+   padding-bottom: 10px;
 }
 
 

client/src/app/controls/card-info-control/card-info-control.component.spec.ts

@@ -0,0 +1,51 @@
+import { TestBed, ComponentFixture } from '@angular/core/testing';
+import { async } from 'q';
+import { Component, ViewChild } from '@angular/core';
+import { CardInfoControlComponent } from './card-info-control.component';
+import { MockDirective } from 'ng-mocks';
+import { LoadImageDirective } from '../load-image/load-image.directive';
+import { TranslateModule } from '@ngx-translate/core';
+
+@Component({
+    selector: `app-card-info-host-component`,
+    template: `<app-card-info-control [image]="image" [header]="header" [description]="description" [learnMoreLink]="learnMoreLink"></app-card-info-control>`
+})
+class TestCardInfoHostComponent {
+    @ViewChild(CardInfoControlComponent)
+    public cardDashbaordComponent: CardInfoControlComponent;
+
+    public image = '';
+    public header = '';
+    public description = '';
+    public learnMoreLink = '';
+}
+
+describe('CardInfoControl', () => {
+    let cardInfoComponent: CardInfoControlComponent;
+    let hostComponent: TestCardInfoHostComponent;
+    let testFixture: ComponentFixture<TestCardInfoHostComponent>;
+
+    beforeEach(async(() => {
+        TestBed.configureTestingModule({
+            declarations: [CardInfoControlComponent, TestCardInfoHostComponent, MockDirective(LoadImageDirective)],
+            providers: [
+            ],
+            imports: [TranslateModule.forRoot()]
+        })
+            .compileComponents();
+
+    }));
+
+    beforeEach(() => {
+        testFixture = TestBed.createComponent(TestCardInfoHostComponent);
+        hostComponent = testFixture.componentInstance;
+        cardInfoComponent = hostComponent.cardDashbaordComponent;
+        testFixture.detectChanges();
+    });
+
+    describe('init', () => {
+        it('control initiates', () => {
+            expect(cardInfoComponent).toBeTruthy();
+        });
+    });
+});

client/src/app/controls/command-bar/command-bar.component.spec.ts

@@ -0,0 +1,30 @@
+import { CommandBarComponent } from './command-bar.component';
+import { CommonModule } from '@angular/common';
+import { async } from 'q';
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+describe('CommandBar', () => {
+  let commandBar: CommandBarComponent;
+  let testFixture: ComponentFixture<CommandBarComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [CommandBarComponent],
+      imports: [CommonModule]
+    })
+      .compileComponents();
+
+  }));
+
+  beforeEach(() => {
+    testFixture = TestBed.createComponent(CommandBarComponent);
+    commandBar = testFixture.componentInstance;
+    testFixture.detectChanges();
+  });
+
+  describe('init', () => {
+    it('should initialize component', () => {
+      expect(commandBar).toBeTruthy();
+    });
+  });
+});

client/src/app/controls/command-bar/command/command.component.spec.ts

@@ -0,0 +1,109 @@
+import { Component, ViewChild } from '@angular/core';
+import { CommandComponent } from './command.component';
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { async } from 'q';
+import { MockDirective } from 'ng-mocks';
+import { LoadImageDirective } from '../../load-image/load-image.directive';
+import { By } from '@angular/platform-browser';
+import { KeyCodes } from '../../../shared/models/constants';
+
+@Component({
+    selector: `app-command-host-component`,
+    template: `<command [displayText]="displayText" [iconUrl]="iconUrl" [disabled]="disabled" (click)="onClick($event)"></command>`
+})
+class TestCommandHostComponent {
+    @ViewChild(CommandComponent)
+    public commandComponent: CommandComponent;
+
+    public iconUrl = 'testicon';
+    public displayText = 'testtext';
+    public disabled = false;
+
+    public clicked = false;
+    public onClick(event) {
+        this.clicked = true;
+    }
+}
+
+describe('CommandControl', () => {
+    let commandComponent: CommandComponent;
+    let hostComponent: TestCommandHostComponent;
+    let testFixture: ComponentFixture<TestCommandHostComponent>;
+
+    beforeEach(async(() => {
+        TestBed.configureTestingModule({
+            declarations: [CommandComponent, TestCommandHostComponent, MockDirective(LoadImageDirective)]
+        })
+            .compileComponents();
+
+    }));
+
+    beforeEach(() => {
+        testFixture = TestBed.createComponent(TestCommandHostComponent);
+        hostComponent = testFixture.componentInstance;
+        commandComponent = hostComponent.commandComponent;
+        testFixture.detectChanges();
+    });
+
+    describe('init', () => {
+        it('should init control', () => {
+            expect(commandComponent).toBeTruthy();
+        });
+        it('should have correct text and icon', () => {
+            expect(commandComponent.displayText).toBe('testtext');
+            expect(commandComponent.iconUrl).toBe('testicon');
+        });
+
+        it('should be enabled by default', () => {
+            expect(commandComponent.disabled).toBeFalsy();
+        });
+
+    });
+
+    describe('Enabled Behavior', () => {
+        it('should not have disabled-command class', () => {
+            const elem = testFixture.debugElement.query(By.css('.disabled-command'));
+            expect(elem).toBeFalsy();
+        });
+
+        it('click should trigger click event', () => {
+            const elem = testFixture.debugElement.query(By.css('a'));
+            elem.nativeElement.click();
+            expect(hostComponent.clicked).toBeTruthy();
+        });
+
+        it('enter keypress should trigger click event', () => {
+            const elem = testFixture.debugElement.query(By.css('a'));
+            elem.triggerEventHandler('keydown', {
+                keyCode: KeyCodes.enter
+            });
+            expect(hostComponent.clicked).toBeTruthy();
+        });
+    });
+
+    describe('Disabled Behavior', () => {
+        it('should have disabled-command class', () => {
+            hostComponent.disabled = true;
+            testFixture.detectChanges();
+            const elem = testFixture.debugElement.query(By.css('.disabled-command'));
+            expect(elem).toBeTruthy();
+        });
+        it('click should not trigger click event', () => {
+            hostComponent.disabled = true;
+            testFixture.detectChanges();
+            const elem = testFixture.debugElement.query(By.css('a'));
+            elem.nativeElement.click();
+            expect(hostComponent.clicked).toBeFalsy();
+        });
+
+        it('enter keypress should trigger click event', () => {
+            hostComponent.disabled = true;
+            testFixture.detectChanges();
+            const elem = testFixture.debugElement.query(By.css('a'));
+            elem.triggerEventHandler('keydown', {
+                keyCode: KeyCodes.enter
+            });
+            expect(hostComponent.clicked).toBeFalsy();
+        });
+    });
+});

client/src/app/controls/command-bar/command/command.component.ts

@@ -25,7 +25,7 @@ export class CommandComponent {
     }
 
     onKeyPress(event: KeyboardEvent) {
-        if (event.keyCode === KeyCodes.enter) {
+        if (event.keyCode === KeyCodes.enter && !this.disabled) {
             this.click.next(event);
         }
     }