diff --git a/static/js/directives/ui/linear-workflow/linear-workflow-section.component.html b/static/js/directives/ui/linear-workflow/linear-workflow-section.component.html index 0a6560404..90c0245ba 100644 --- a/static/js/directives/ui/linear-workflow/linear-workflow-section.component.html +++ b/static/js/directives/ui/linear-workflow/linear-workflow-section.component.html @@ -1,7 +1,7 @@
-
+
diff --git a/static/js/directives/ui/linear-workflow/linear-workflow-section.component.spec.ts b/static/js/directives/ui/linear-workflow/linear-workflow-section.component.spec.ts index 11f514f5b..d41ecf194 100644 --- a/static/js/directives/ui/linear-workflow/linear-workflow-section.component.spec.ts +++ b/static/js/directives/ui/linear-workflow/linear-workflow-section.component.spec.ts @@ -22,4 +22,61 @@ describe("LinearWorkflowSectionComponent", () => { expect(addSectionSpy.calls.argsFor(0)[0]).toBe(component); }); }); + + describe("$onChanges", () => { + var onSectionInvalidSpy: Spy; + var changesObj: ng.IOnChangesObject; + + beforeEach(() => { + onSectionInvalidSpy = spyOn(parentMock, "onSectionInvalid").and.returnValue(null); + changesObj = { + sectionValid: { + currentValue: true, + previousValue: false, + isFirstChange: () => false, + }, + }; + }); + + it("does nothing if 'sectionValid' input not changed", () => { + component.$onChanges({}); + + expect(onSectionInvalidSpy).not.toHaveBeenCalled(); + }); + + it("does nothing if 'sectionValid' input is true", () => { + component.$onChanges(changesObj); + + expect(onSectionInvalidSpy).not.toHaveBeenCalled(); + }); + + it("calls parent method to inform that section is invalid if 'sectionValid' input changed to false", () => { + changesObj['sectionValid'].currentValue = false; + component.$onChanges(changesObj); + + expect(onSectionInvalidSpy.calls.argsFor(0)[0]).toEqual(component.sectionId); + }); + }); + + describe("onSubmitSection", () => { + var onNextSectionSpy: Spy; + + beforeEach(() => { + onNextSectionSpy = spyOn(parentMock, "onNextSection").and.returnValue(null); + }); + + it("does nothing if section is invalid", () => { + component.sectionValid = false; + component.onSubmitSection(); + + expect(onNextSectionSpy).not.toHaveBeenCalled(); + }); + + it("calls parent method to go to next section if section is valid", () => { + component.sectionValid = true; + component.onSubmitSection(); + + expect(onNextSectionSpy).toHaveBeenCalled(); + }); + }); }); diff --git a/static/js/directives/ui/linear-workflow/linear-workflow-section.component.ts b/static/js/directives/ui/linear-workflow/linear-workflow-section.component.ts index 6a8c6f144..81e2c04ba 100644 --- a/static/js/directives/ui/linear-workflow/linear-workflow-section.component.ts +++ b/static/js/directives/ui/linear-workflow/linear-workflow-section.component.ts @@ -10,7 +10,7 @@ import { LinearWorkflowComponent } from './linear-workflow.component'; templateUrl: '/static/js/directives/ui/linear-workflow/linear-workflow-section.component.html', transclude: true, require: { - parent: '^linearWorkflow' + parent: '^^linearWorkflow' } }) export class LinearWorkflowSectionComponent implements ng.IComponentController { @@ -22,11 +22,19 @@ export class LinearWorkflowSectionComponent implements ng.IComponentController { public isCurrentSection: boolean = false; public parent: LinearWorkflowComponent; - constructor() { - - } - public $onInit(): void { this.parent.addSection(this); } + + public $onChanges(changes: ng.IOnChangesObject): void { + if (changes['sectionValid'] !== undefined && !changes['sectionValid'].currentValue) { + this.parent.onSectionInvalid(this.sectionId); + } + } + + public onSubmitSection(): void { + if (this.sectionValid) { + this.parent.onNextSection(); + } + } } diff --git a/static/js/directives/ui/linear-workflow/linear-workflow.component.html b/static/js/directives/ui/linear-workflow/linear-workflow.component.html index 4aa3e2150..bbb0d3868 100644 --- a/static/js/directives/ui/linear-workflow/linear-workflow.component.html +++ b/static/js/directives/ui/linear-workflow/linear-workflow.component.html @@ -8,15 +8,15 @@ diff --git a/static/js/directives/ui/linear-workflow/linear-workflow.component.spec.ts b/static/js/directives/ui/linear-workflow/linear-workflow.component.spec.ts index 34ddedb62..855fd9197 100644 --- a/static/js/directives/ui/linear-workflow/linear-workflow.component.spec.ts +++ b/static/js/directives/ui/linear-workflow/linear-workflow.component.spec.ts @@ -1,5 +1,6 @@ import { LinearWorkflowComponent, SectionInfo } from './linear-workflow.component'; import { LinearWorkflowSectionComponent } from './linear-workflow-section.component'; +import Spy = jasmine.Spy; describe("LinearWorkflowComponent", () => { @@ -10,10 +11,103 @@ describe("LinearWorkflowComponent", () => { }); describe("addSection", () => { + var newSection: LinearWorkflowSectionComponent; + beforeEach(() => { + newSection = new LinearWorkflowSectionComponent; + }); + + it("does not set 'sectionVisible' or 'isCurrentSection' of given section if not the first section added", () => { + component.addSection(new LinearWorkflowSectionComponent); + component.addSection(newSection); + + expect(newSection.sectionVisible).toBe(false); + expect(newSection.isCurrentSection).toBe(false); + }); + + it("sets 'sectionVisible' of given section to true if it is the first section added", () => { + component.addSection(newSection); + + expect(newSection.sectionVisible).toBe(true); + }); + + it("sets 'isCurrentSection' of given section to true if it is the first section added", () => { + component.addSection(newSection); + + expect(newSection.isCurrentSection).toBe(true); + }); }); describe("onNextSection", () => { + var currentSection: LinearWorkflowSectionComponent; + beforeEach(() => { + component.onWorkflowComplete = jasmine.createSpy("onWorkflowComplete").and.returnValue(null); + currentSection = new LinearWorkflowSectionComponent; + currentSection.sectionValid = true; + component.addSection(currentSection); + }); + + it("does not complete workflow or change current section if current section is invalid", () => { + currentSection.sectionValid = false; + component.onNextSection(); + + expect(component.onWorkflowComplete).not.toHaveBeenCalled(); + expect(currentSection.isCurrentSection).toBe(true); + }); + + it("calls workflow completed output callback if current section is the last section and is valid", () => { + component.onNextSection(); + + expect(component.onWorkflowComplete).toHaveBeenCalled(); + }); + + it("sets the current section to the next section if there are remaining sections and current section valid", () => { + var nextSection: LinearWorkflowSectionComponent = new LinearWorkflowSectionComponent(); + component.addSection(nextSection); + component.onNextSection(); + + expect(currentSection.isCurrentSection).toBe(false); + expect(nextSection.isCurrentSection).toBe(true); + expect(nextSection.sectionVisible).toBe(true); + }); + }); + + describe("onSectionInvalid", () => { + var invalidSection: LinearWorkflowSectionComponent; + var sections: LinearWorkflowSectionComponent[]; + + beforeEach(() => { + invalidSection = new LinearWorkflowSectionComponent(); + invalidSection.sectionId = "Git Repository"; + invalidSection.sectionValid = false; + component.addSection(invalidSection); + + sections = [ + new LinearWorkflowSectionComponent(), + new LinearWorkflowSectionComponent(), + new LinearWorkflowSectionComponent(), + ]; + sections.forEach((section) => { + section.sectionVisible = true; + section.isCurrentSection = true; + component.addSection(section); + }); + }); + + it("sets the section with the given id to be the current section", () => { + component.onSectionInvalid(invalidSection.sectionId); + + expect(invalidSection.isCurrentSection).toBe(true); + }); + + it("hides all sections after the section with the given id", () => { + component.onSectionInvalid(invalidSection.sectionId); + + sections.forEach((section) => { + expect(section.sectionVisible).toBe(false); + expect(section.isCurrentSection).toBe(false); + }); + }); }); }); diff --git a/static/js/directives/ui/linear-workflow/linear-workflow.component.ts b/static/js/directives/ui/linear-workflow/linear-workflow.component.ts index bba8cd9b6..69e43dc20 100644 --- a/static/js/directives/ui/linear-workflow/linear-workflow.component.ts +++ b/static/js/directives/ui/linear-workflow/linear-workflow.component.ts @@ -18,15 +18,6 @@ export class LinearWorkflowComponent implements ng.IComponentController { private sections: SectionInfo[] = []; private currentSection: SectionInfo; - - constructor() { - - } - - public $onInit(): void { - - } - public addSection(component: LinearWorkflowSectionComponent): void { this.sections.push({ index: this.sections.length, @@ -34,20 +25,34 @@ export class LinearWorkflowComponent implements ng.IComponentController { }); if (this.sections.length == 1) { - this.sections[0].component.sectionVisible = true; this.currentSection = this.sections[0]; + this.currentSection.component.sectionVisible = true; + this.currentSection.component.isCurrentSection = true; } } public onNextSection(): void { - if (this.currentSection.component.sectionValid) { - if (this.currentSection.index + 1 >= this.sections.length) { - this.onWorkflowComplete({}); - } - else { - this.currentSection = this.sections[this.currentSection.index]; - } + if (this.currentSection.component.sectionValid && this.currentSection.index + 1 >= this.sections.length) { + this.onWorkflowComplete({}); } + else if (this.currentSection.component.sectionValid && this.currentSection.index + 1 < this.sections.length) { + this.currentSection.component.isCurrentSection = false; + this.currentSection = this.sections[this.currentSection.index + 1]; + this.currentSection.component.sectionVisible = true; + this.currentSection.component.isCurrentSection = true; + } + } + + public onSectionInvalid(sectionId: string): void { + var invalidSection = this.sections.filter(section => section.component.sectionId == sectionId)[0]; + invalidSection.component.isCurrentSection = true; + this.currentSection = invalidSection; + this.sections.forEach((section) => { + if (section.index > invalidSection.index) { + section.component.sectionVisible = false; + section.component.isCurrentSection = false; + } + }); } } diff --git a/static/js/directives/ui/manage-trigger-custom-git/manage-trigger-custom-git.component.html b/static/js/directives/ui/manage-trigger-custom-git/manage-trigger-custom-git.component.html index a82102122..d75adcb07 100644 --- a/static/js/directives/ui/manage-trigger-custom-git/manage-trigger-custom-git.component.html +++ b/static/js/directives/ui/manage-trigger-custom-git/manage-trigger-custom-git.component.html @@ -4,11 +4,10 @@ done-title="Create Trigger" workflow-complete="$ctrl.activateTrigger({'config': $ctrl.config})"> - + section-valid="$ctrl.config.build_source !== undefined">

Enter repository

@@ -25,8 +24,7 @@ - @@ -45,53 +43,3 @@
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/test/data/test.db b/test/data/test.db index 415776f78..cfce4f869 100644 Binary files a/test/data/test.db and b/test/data/test.db differ