From 6de74e9c5e9c7e56efaf4d8ef1a4b4397a659cc3 Mon Sep 17 00:00:00 2001 From: Elena Zioga Date: Tue, 25 Oct 2022 13:07:30 +0300 Subject: [PATCH] UI: Fix unit tests (#1977) * Fix Katib unit tests. Signed-off-by: Elena Zioga Signed-off-by: Elena Zioga --- pkg/new-ui/v1beta1/frontend/angular.json | 3 +- pkg/new-ui/v1beta1/frontend/package-lock.json | 6 +- pkg/new-ui/v1beta1/frontend/package.json | 2 +- .../frontend/src/app/app.component.spec.ts | 12 +- .../v1beta1/frontend/src/app/app.module.ts | 2 - .../src/app/models/trial.k8s.model.ts | 2 +- .../algorithm/algorithm.component.spec.ts | 36 ++++- .../setting/setting.component.spec.ts | 32 ++++- .../early-stopping.component.spec.ts | 16 +++ .../experiment-creation.component.spec.ts | 133 ++++++++++++++++++ .../hyper-parameters.component.spec.ts | 24 +++- .../metadata/metadata.component.spec.ts | 36 ++++- .../metrics-collector.component.spec.ts | 35 ++++- .../nas-graph/nas-graph.component.spec.ts | 36 ++++- .../nas-operations.component.spec.ts | 26 +++- .../operation/operation.component.spec.ts | 20 +++ .../objective/objective.component.spec.ts | 44 +++++- .../trial-parameter.component.spec.ts | 21 +++ .../trial-template.component.spec.ts | 49 ++++++- .../trial-thresholds.component.spec.ts | 31 +++- .../yaml-modal/yaml-modal.component.spec.ts | 10 ++ .../experiment-details-tab.component.spec.ts | 11 ++ .../experiment-details.component.spec.ts | 71 ++++++++++ .../experiment-overview.component.spec.ts | 11 ++ .../metrics/metrics.component.spec.ts | 3 + .../trial-modal-overview.component.spec.ts | 43 ++++++ .../trial-modal/trial-modal.component.spec.ts | 44 ++++++ .../trial-modal/trial-modal.module.ts | 1 + .../trials-table.component.spec.ts | 23 ++- .../trials-table/trials-table.module.ts | 2 + .../yaml/experiment-yaml.component.spec.ts | 4 + .../experiments/experiments.component.spec.ts | 35 +++++ ...experiment-optimal-trial.component.spec.ts | 9 ++ .../src/app/services/backend.service.spec.ts | 20 ++- .../list-input/list-input.component.spec.ts | 5 + .../list-key-value.component.spec.ts | 7 + .../add-modal/add-modal.component.spec.ts | 48 ++++++- .../parameter/parameter.component.spec.ts | 25 ++++ .../params-list/params-list.component.spec.ts | 23 +++ pkg/new-ui/v1beta1/frontend/tsconfig.json | 3 +- 40 files changed, 875 insertions(+), 89 deletions(-) diff --git a/pkg/new-ui/v1beta1/frontend/angular.json b/pkg/new-ui/v1beta1/frontend/angular.json index 0188d225cb7..92c738ab300 100644 --- a/pkg/new-ui/v1beta1/frontend/angular.json +++ b/pkg/new-ui/v1beta1/frontend/angular.json @@ -94,7 +94,8 @@ "karmaConfig": "karma.conf.js", "assets": ["src/favicon.ico", "src/assets"], "styles": ["src/styles.scss"], - "scripts": [] + "scripts": [], + "preserveSymlinks": true } }, "lint": { diff --git a/pkg/new-ui/v1beta1/frontend/package-lock.json b/pkg/new-ui/v1beta1/frontend/package-lock.json index 2e89a2b4cbb..35d385052d4 100644 --- a/pkg/new-ui/v1beta1/frontend/package-lock.json +++ b/pkg/new-ui/v1beta1/frontend/package-lock.json @@ -7512,9 +7512,9 @@ } }, "material-icons": { - "version": "0.3.1", - "resolved": "https://registry.npmjs.org/material-icons/-/material-icons-0.3.1.tgz", - "integrity": "sha512-5Hbj76A6xDPcDZEbM4oxTknhWuMwGWnAHVLLPCEq9eVlcHb0fn4koU9ZeyMy1wjARtDEPAHfd5ZdL2Re5hf0zQ==" + "version": "0.7.7", + "resolved": "https://registry.npmjs.org/material-icons/-/material-icons-0.7.7.tgz", + "integrity": "sha512-WzHzL+/QlcCRbF2aCElgv6r0ViRateatEQP/UOA502PitZNFF2BJIcGpzvJmMPShktkhhrLAFx+elDN7DcjXVQ==" }, "mdn-data": { "version": "2.0.14", diff --git a/pkg/new-ui/v1beta1/frontend/package.json b/pkg/new-ui/v1beta1/frontend/package.json index 955f0270f43..67e3ac4b6ce 100644 --- a/pkg/new-ui/v1beta1/frontend/package.json +++ b/pkg/new-ui/v1beta1/frontend/package.json @@ -37,7 +37,7 @@ "echarts-stat": "^1.2.0", "js-yaml": "^4.0.0", "lodash-es": "4.17.11", - "material-icons": "^0.3.1", + "material-icons": "^0.7.7", "ng2-ace-editor": "^0.3.9", "ngx-echarts": "^8.0.1", "ngx-json-viewer": "^2.4.0", diff --git a/pkg/new-ui/v1beta1/frontend/src/app/app.component.spec.ts b/pkg/new-ui/v1beta1/frontend/src/app/app.component.spec.ts index 07de74fa209..d1e29f14a69 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/app.component.spec.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/app.component.spec.ts @@ -1,10 +1,13 @@ import { TestBed, waitForAsync } from '@angular/core/testing'; import { AppComponent } from './app.component'; +import { BrowserModule } from '@angular/platform-browser'; +import { AppRoutingModule } from './app-routing.module'; describe('AppComponent', () => { beforeEach( waitForAsync(() => { TestBed.configureTestingModule({ + imports: [BrowserModule, AppRoutingModule], declarations: [AppComponent], }).compileComponents(); }), @@ -21,13 +24,4 @@ describe('AppComponent', () => { const app = fixture.debugElement.componentInstance; expect(app.title).toEqual('frontend'); }); - - it('should render title', () => { - const fixture = TestBed.createComponent(AppComponent); - fixture.detectChanges(); - const compiled = fixture.debugElement.nativeElement; - expect(compiled.querySelector('.content span').textContent).toContain( - 'frontend app is running!', - ); - }); }); diff --git a/pkg/new-ui/v1beta1/frontend/src/app/app.module.ts b/pkg/new-ui/v1beta1/frontend/src/app/app.module.ts index 844f5ca524d..98af0db9cbd 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/app.module.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/app.module.ts @@ -8,7 +8,6 @@ import { AppComponent } from './app.component'; import { ExperimentsModule } from './pages/experiments/experiments.module'; import { ExperimentDetailsModule } from './pages/experiment-details/experiment-details.module'; import { ExperimentCreationModule } from './pages/experiment-creation/experiment-creation.module'; -import { TrialModalModule } from './pages/experiment-details/trials-table/trial-modal/trial-modal.module'; @NgModule({ declarations: [AppComponent], @@ -20,7 +19,6 @@ import { TrialModalModule } from './pages/experiment-details/trials-table/trial- ExperimentDetailsModule, ReactiveFormsModule, ExperimentCreationModule, - TrialModalModule, ], providers: [], bootstrap: [AppComponent], diff --git a/pkg/new-ui/v1beta1/frontend/src/app/models/trial.k8s.model.ts b/pkg/new-ui/v1beta1/frontend/src/app/models/trial.k8s.model.ts index 9bdf59ae753..0c3f82bb351 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/models/trial.k8s.model.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/models/trial.k8s.model.ts @@ -76,7 +76,7 @@ interface TrialStatus { interface TrialStatusCondition { type: string; - status: boolean; + status: string; reason: string; message: string; lastUpdateTime: string; diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/algorithm/algorithm.component.spec.ts b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/algorithm/algorithm.component.spec.ts index 77d0da02cb3..1f1f96cf992 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/algorithm/algorithm.component.spec.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/algorithm/algorithm.component.spec.ts @@ -1,22 +1,46 @@ +import { CommonModule } from '@angular/common'; import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; +import { FormArray, FormControl, FormGroup } from '@angular/forms'; +import { MatFormFieldModule } from '@angular/material/form-field'; +import { MatInputModule } from '@angular/material/input'; +import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; +import { MatSelectModule } from '@angular/material/select'; +import { MatRadioModule } from '@angular/material/radio'; +import { FormModule } from 'kubeflow'; -import { AlgorithmComponent } from './algorithm.component'; +import { FormAlgorithmComponent } from './algorithm.component'; +import { FormAlgorithmModule } from './algorithm.module'; -describe('AlgorithmComponent', () => { - let component: AlgorithmComponent; - let fixture: ComponentFixture; +describe('FormAlgorithmComponent', () => { + let component: FormAlgorithmComponent; + let fixture: ComponentFixture; beforeEach( waitForAsync(() => { TestBed.configureTestingModule({ - declarations: [AlgorithmComponent], + imports: [ + CommonModule, + BrowserAnimationsModule, + MatFormFieldModule, + MatInputModule, + MatSelectModule, + MatRadioModule, + FormModule, + FormAlgorithmModule, + ], + declarations: [FormAlgorithmComponent], }).compileComponents(); }), ); beforeEach(() => { - fixture = TestBed.createComponent(AlgorithmComponent); + fixture = TestBed.createComponent(FormAlgorithmComponent); component = fixture.componentInstance; + component.algorithmForm = new FormGroup({ + algorithmSettings: new FormArray([]), + algorithm: new FormControl('tpe'), + type: new FormControl(), + }); fixture.detectChanges(); }); diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/algorithm/setting/setting.component.spec.ts b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/algorithm/setting/setting.component.spec.ts index da275d709d3..8fc34e41627 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/algorithm/setting/setting.component.spec.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/algorithm/setting/setting.component.spec.ts @@ -1,22 +1,42 @@ import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; +import { FormControl, FormGroup, ReactiveFormsModule } from '@angular/forms'; -import { SettingComponent } from './setting.component'; +import { FormAlgorithmSettingComponent } from './setting.component'; +import { CommonModule } from '@angular/common'; +import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; +import { MatFormFieldModule } from '@angular/material/form-field'; +import { MatInputModule } from '@angular/material/input'; +import { MatSelectModule } from '@angular/material/select'; -describe('SettingComponent', () => { - let component: SettingComponent; - let fixture: ComponentFixture; +describe('FormAlgorithmSettingComponent', () => { + let component: FormAlgorithmSettingComponent; + let fixture: ComponentFixture; beforeEach( waitForAsync(() => { TestBed.configureTestingModule({ - declarations: [SettingComponent], + imports: [ + CommonModule, + BrowserAnimationsModule, + MatFormFieldModule, + MatInputModule, + MatSelectModule, + ReactiveFormsModule, + ], + declarations: [FormAlgorithmSettingComponent], }).compileComponents(); }), ); beforeEach(() => { - fixture = TestBed.createComponent(SettingComponent); + fixture = TestBed.createComponent(FormAlgorithmSettingComponent); component = fixture.componentInstance; + component.setting = new FormGroup({ + value: new FormControl(), + name: new FormControl(), + type: new FormControl(), + values: new FormControl([]), + }); fixture.detectChanges(); }); diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/early-stopping/early-stopping.component.spec.ts b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/early-stopping/early-stopping.component.spec.ts index a10cbb687a7..e841b542ca2 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/early-stopping/early-stopping.component.spec.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/early-stopping/early-stopping.component.spec.ts @@ -1,4 +1,10 @@ +import { CommonModule } from '@angular/common'; import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; +import { FormControl, FormGroup } from '@angular/forms'; +import { MatFormFieldModule } from '@angular/material/form-field'; +import { MatInputModule } from '@angular/material/input'; +import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; +import { FormModule } from 'kubeflow'; import { EarlyStoppingComponent } from './early-stopping.component'; @@ -9,6 +15,13 @@ describe('EarlyStoppingComponent', () => { beforeEach( waitForAsync(() => { TestBed.configureTestingModule({ + imports: [ + CommonModule, + BrowserAnimationsModule, + MatFormFieldModule, + MatInputModule, + FormModule, + ], declarations: [EarlyStoppingComponent], }).compileComponents(); }), @@ -17,6 +30,9 @@ describe('EarlyStoppingComponent', () => { beforeEach(() => { fixture = TestBed.createComponent(EarlyStoppingComponent); component = fixture.componentInstance; + component.formGroup = new FormGroup({ + algorithmName: new FormControl(), + }); fixture.detectChanges(); }); diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/experiment-creation.component.spec.ts b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/experiment-creation.component.spec.ts index f72797c9c23..85c2b100598 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/experiment-creation.component.spec.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/experiment-creation.component.spec.ts @@ -1,6 +1,109 @@ import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; +import { MatDialog } from '@angular/material/dialog'; +import { Router } from '@angular/router'; +import { KWABackendService } from 'src/app/services/backend.service'; +import { ExperimentFormService } from 'src/app/services/experiment-form.service'; +import { + NamespaceService, + SnackBarService, + TitleActionsToolbarModule, + FormModule, +} from 'kubeflow'; import { ExperimentCreationComponent } from './experiment-creation.component'; +import { FormArray, FormControl, FormGroup } from '@angular/forms'; +import { CommonModule } from '@angular/common'; +import { MatIconModule } from '@angular/material/icon'; +import { MatStepperModule } from '@angular/material/stepper'; +import { FormMetadataModule } from './metadata/metadata.module'; +import { FormTrialThresholdsModule } from './trial-thresholds/trial-thresholds.module'; +import { FormObjectiveModule } from './objective/objective.module'; +import { FormAlgorithmModule } from './algorithm/algorithm.module'; +import { FormHyperParametersModule } from './hyper-parameters/hyper-parameters.module'; +import { FormNasGraphModule } from './nas-graph/nas-graph.module'; +import { FormNasOperationsModule } from './nas-operations/nas-operations.module'; +import { FormMetricsCollectorModule } from './metrics-collector/metrics-collector.module'; +import { FormTrialTemplateModule } from './trial-template/trial-template.module'; +import { YamlModalModule } from './yaml-modal/yaml-modal.module'; +import { FormEarlyStoppingModule } from './early-stopping/early-stopping.module'; +import { of } from 'rxjs'; +import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; + +let ExperimentFormServiceStub: Partial; +let KWABackendServiceStub: Partial; +let NamespaceServiceStub: Partial; + +ExperimentFormServiceStub = { + createMetadataForm: () => + new FormGroup({ + name: new FormControl(), + namespace: new FormControl(), + }), + createTrialThresholdForm: () => + new FormGroup({ + parallelTrialCount: new FormControl(), + maxTrialCount: new FormControl(), + maxFailedTrialCount: new FormControl(), + resumePolicy: new FormControl(), + }), + createObjectiveForm: () => + new FormGroup({ + strategiesArray: new FormArray([]), + type: new FormControl(), + metricName: new FormControl(), + goal: new FormControl(), + setStrategies: new FormControl(), + additionalMetricNames: new FormControl([]), + metricStrategy: new FormControl('test'), + metricStrategies: new FormArray([]), + }), + createAlgorithmObjectiveForm: () => + new FormGroup({ + type: new FormControl(), + algorithmSettings: new FormArray([]), + algorithm: new FormControl('tpe'), + }), + createEarlyStoppingForm: () => new FormGroup({}), + createHyperParametersForm: () => new FormArray([]), + createNasGraphForm: () => + new FormGroup({ + layers: new FormControl(), + inputSizes: new FormControl([]), + outputSizes: new FormControl([]), + }), + createNasOperationsForm: () => new FormArray([]), + createMetricsForm: () => + new FormGroup({ + kind: new FormControl(), + metricsFile: new FormControl(), + tfDir: new FormControl(), + port: new FormControl(), + path: new FormControl(), + scheme: new FormControl(), + host: new FormControl(), + }), + createTrialTemplateForm: () => + new FormGroup({ + trialParameters: new FormArray([]), + podLabels: new FormControl(), + containerName: new FormControl(), + successCond: new FormControl(), + failureCond: new FormControl(), + retain: new FormControl(), + type: new FormControl(), + cmNamespace: new FormControl(), + cmName: new FormControl(), + cmTrialPath: new FormControl(), + }), +}; + +KWABackendServiceStub = { + getTrialTemplates: () => of({ Data: [] }), +}; + +NamespaceServiceStub = { + getSelectedNamespace: () => of(), +}; describe('ExperimentCreationComponent', () => { let component: ExperimentCreationComponent; @@ -9,7 +112,37 @@ describe('ExperimentCreationComponent', () => { beforeEach( waitForAsync(() => { TestBed.configureTestingModule({ + imports: [ + CommonModule, + BrowserAnimationsModule, + MatIconModule, + MatStepperModule, + FormModule, + TitleActionsToolbarModule, + FormMetadataModule, + FormTrialThresholdsModule, + FormObjectiveModule, + FormAlgorithmModule, + FormEarlyStoppingModule, + FormHyperParametersModule, + FormNasGraphModule, + FormNasOperationsModule, + FormMetricsCollectorModule, + FormTrialTemplateModule, + YamlModalModule, + ], declarations: [ExperimentCreationComponent], + providers: [ + { + provide: ExperimentFormService, + useValue: ExperimentFormServiceStub, + }, + { provide: Router, useValue: {} }, + { provide: MatDialog, useValue: {} }, + { provide: KWABackendService, useValue: KWABackendServiceStub }, + { provide: NamespaceService, useValue: NamespaceServiceStub }, + { provide: SnackBarService, useValue: {} }, + ], }).compileComponents(); }), ); diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/hyper-parameters/hyper-parameters.component.spec.ts b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/hyper-parameters/hyper-parameters.component.spec.ts index 193aa7552ca..ef2b52d4961 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/hyper-parameters/hyper-parameters.component.spec.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/hyper-parameters/hyper-parameters.component.spec.ts @@ -1,22 +1,34 @@ +import { CommonModule } from '@angular/common'; import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; +import { FormArray, FormControl } from '@angular/forms'; +import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; +import { FormModule } from 'kubeflow'; +import { ParamsListModule } from 'src/app/shared/params-list/params-list.module'; -import { HyperParametersComponent } from './hyper-parameters.component'; +import { FormHyperParametersComponent } from './hyper-parameters.component'; -describe('HyperParametersComponent', () => { - let component: HyperParametersComponent; - let fixture: ComponentFixture; +describe('FormHyperParametersComponent', () => { + let component: FormHyperParametersComponent; + let fixture: ComponentFixture; beforeEach( waitForAsync(() => { TestBed.configureTestingModule({ - declarations: [HyperParametersComponent], + imports: [ + CommonModule, + ParamsListModule, + FormModule, + BrowserAnimationsModule, + ], + declarations: [FormHyperParametersComponent], }).compileComponents(); }), ); beforeEach(() => { - fixture = TestBed.createComponent(HyperParametersComponent); + fixture = TestBed.createComponent(FormHyperParametersComponent); component = fixture.componentInstance; + component.hyperParamsArray = new FormArray([]); fixture.detectChanges(); }); diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/metadata/metadata.component.spec.ts b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/metadata/metadata.component.spec.ts index be8e7f7f3fa..1fb995d006b 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/metadata/metadata.component.spec.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/metadata/metadata.component.spec.ts @@ -1,22 +1,46 @@ import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; +import { of } from 'rxjs'; +import { NamespaceService, FormModule } from 'kubeflow'; -import { MetadataComponent } from './metadata.component'; +import { FormMetadataComponent } from './metadata.component'; +import { FormControl, FormGroup } from '@angular/forms'; +import { CommonModule } from '@angular/common'; +import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; +import { MatFormFieldModule } from '@angular/material/form-field'; +import { MatInputModule } from '@angular/material/input'; -describe('MetadataComponent', () => { - let component: MetadataComponent; - let fixture: ComponentFixture; +describe('FormMetadataComponent', () => { + let component: FormMetadataComponent; + let fixture: ComponentFixture; beforeEach( waitForAsync(() => { TestBed.configureTestingModule({ - declarations: [MetadataComponent], + imports: [ + CommonModule, + FormModule, + BrowserAnimationsModule, + MatFormFieldModule, + MatInputModule, + ], + declarations: [FormMetadataComponent], + providers: [ + { + provide: NamespaceService, + useValue: { getSelectedNamespace: () => of('') }, + }, + ], }).compileComponents(); }), ); beforeEach(() => { - fixture = TestBed.createComponent(MetadataComponent); + fixture = TestBed.createComponent(FormMetadataComponent); component = fixture.componentInstance; + component.metadataForm = new FormGroup({ + name: new FormControl(), + namespace: new FormControl(), + }); fixture.detectChanges(); }); diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/metrics-collector/metrics-collector.component.spec.ts b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/metrics-collector/metrics-collector.component.spec.ts index 083607950bb..d9a6117bf1f 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/metrics-collector/metrics-collector.component.spec.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/metrics-collector/metrics-collector.component.spec.ts @@ -1,22 +1,45 @@ import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; +import { FormControl, FormGroup } from '@angular/forms'; +import { CommonModule } from '@angular/common'; +import { FormModule } from 'kubeflow'; +import { ListKeyValueModule } from 'src/app/shared/list-key-value/list-key-value.module'; +import { AceEditorModule } from 'ng2-ace-editor'; -import { MetricsCollectorComponent } from './metrics-collector.component'; +import { FormMetricsCollectorComponent } from './metrics-collector.component'; +import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; -describe('MetricsCollectorComponent', () => { - let component: MetricsCollectorComponent; - let fixture: ComponentFixture; +describe('FormMetricsCollectorComponent', () => { + let component: FormMetricsCollectorComponent; + let fixture: ComponentFixture; beforeEach( waitForAsync(() => { TestBed.configureTestingModule({ - declarations: [MetricsCollectorComponent], + imports: [ + CommonModule, + BrowserAnimationsModule, + FormModule, + ListKeyValueModule, + AceEditorModule, + ], + declarations: [FormMetricsCollectorComponent], }).compileComponents(); }), ); beforeEach(() => { - fixture = TestBed.createComponent(MetricsCollectorComponent); + fixture = TestBed.createComponent(FormMetricsCollectorComponent); component = fixture.componentInstance; + component.formGroup = new FormGroup({ + kind: new FormControl(), + metricsFile: new FormControl(), + tfDir: new FormControl(), + port: new FormControl(), + path: new FormControl(), + scheme: new FormControl(), + host: new FormControl(), + prometheus: new FormControl(), + }); fixture.detectChanges(); }); diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/nas-graph/nas-graph.component.spec.ts b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/nas-graph/nas-graph.component.spec.ts index 9b9a6f1cedc..1f3aeaa4ed2 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/nas-graph/nas-graph.component.spec.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/nas-graph/nas-graph.component.spec.ts @@ -1,22 +1,46 @@ +import { CommonModule } from '@angular/common'; import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; +import { FormControl, FormGroup } from '@angular/forms'; +import { MatFormFieldModule } from '@angular/material/form-field'; +import { MatInputModule } from '@angular/material/input'; +import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; +import { MatDividerModule } from '@angular/material/divider'; +import { MatIconModule } from '@angular/material/icon'; +import { ListInputModule } from 'src/app/shared/list-input/list-input.module'; +import { FormModule } from 'kubeflow'; -import { NasGraphComponent } from './nas-graph.component'; +import { FormNasGraphComponent } from './nas-graph.component'; -describe('NasGraphComponent', () => { - let component: NasGraphComponent; - let fixture: ComponentFixture; +describe('FormNasGraphComponent', () => { + let component: FormNasGraphComponent; + let fixture: ComponentFixture; beforeEach( waitForAsync(() => { TestBed.configureTestingModule({ - declarations: [NasGraphComponent], + imports: [ + CommonModule, + BrowserAnimationsModule, + MatFormFieldModule, + MatInputModule, + MatDividerModule, + MatIconModule, + ListInputModule, + FormModule, + ], + declarations: [FormNasGraphComponent], }).compileComponents(); }), ); beforeEach(() => { - fixture = TestBed.createComponent(NasGraphComponent); + fixture = TestBed.createComponent(FormNasGraphComponent); component = fixture.componentInstance; + component.formGroup = new FormGroup({ + layers: new FormControl(), + inputSizes: new FormControl([]), + outputSizes: new FormControl([]), + }); fixture.detectChanges(); }); diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/nas-operations/nas-operations.component.spec.ts b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/nas-operations/nas-operations.component.spec.ts index 2dd2b5bb426..ee27b665208 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/nas-operations/nas-operations.component.spec.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/nas-operations/nas-operations.component.spec.ts @@ -1,22 +1,36 @@ +import { CommonModule } from '@angular/common'; import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; +import { FormArray } from '@angular/forms'; +import { MatIconModule } from '@angular/material/icon'; +import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; +import { FormModule } from 'kubeflow'; -import { NasOperationsComponent } from './nas-operations.component'; +import { FormNasOperationsComponent } from './nas-operations.component'; +import { FormNasOperationsModule } from './nas-operations.module'; -describe('NasOperationsComponent', () => { - let component: NasOperationsComponent; - let fixture: ComponentFixture; +describe('FormNasOperationsComponent', () => { + let component: FormNasOperationsComponent; + let fixture: ComponentFixture; beforeEach( waitForAsync(() => { TestBed.configureTestingModule({ - declarations: [NasOperationsComponent], + imports: [ + CommonModule, + BrowserAnimationsModule, + MatIconModule, + FormModule, + FormNasOperationsModule, + ], + declarations: [FormNasOperationsComponent], }).compileComponents(); }), ); beforeEach(() => { - fixture = TestBed.createComponent(NasOperationsComponent); + fixture = TestBed.createComponent(FormNasOperationsComponent); component = fixture.componentInstance; + component.formArray = new FormArray([]); fixture.detectChanges(); }); diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/nas-operations/operation/operation.component.spec.ts b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/nas-operations/operation/operation.component.spec.ts index f1fe308486d..50ce644a38c 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/nas-operations/operation/operation.component.spec.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/nas-operations/operation/operation.component.spec.ts @@ -1,6 +1,13 @@ import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; +import { CommonModule } from '@angular/common'; +import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; +import { MatFormFieldModule } from '@angular/material/form-field'; +import { MatInputModule } from '@angular/material/input'; import { OperationComponent } from './operation.component'; +import { ParamsListModule } from 'src/app/shared/params-list/params-list.module'; +import { FormControl, FormGroup, ReactiveFormsModule } from '@angular/forms'; +import { MatIconModule } from '@angular/material/icon'; describe('OperationComponent', () => { let component: OperationComponent; @@ -9,6 +16,15 @@ describe('OperationComponent', () => { beforeEach( waitForAsync(() => { TestBed.configureTestingModule({ + imports: [ + CommonModule, + BrowserAnimationsModule, + MatFormFieldModule, + MatInputModule, + ParamsListModule, + MatIconModule, + ReactiveFormsModule, + ], declarations: [OperationComponent], }).compileComponents(); }), @@ -17,6 +33,10 @@ describe('OperationComponent', () => { beforeEach(() => { fixture = TestBed.createComponent(OperationComponent); component = fixture.componentInstance; + component.formGroup = new FormGroup({ + operationType: new FormControl(), + parameters: new FormControl(), + }); fixture.detectChanges(); }); diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/objective/objective.component.spec.ts b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/objective/objective.component.spec.ts index 47ecae32bad..be530cb6049 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/objective/objective.component.spec.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/objective/objective.component.spec.ts @@ -1,22 +1,54 @@ import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; +import { FormArray, FormControl, FormGroup } from '@angular/forms'; +import { MatDialog } from '@angular/material/dialog'; +import { CommonModule } from '@angular/common'; +import { FormModule } from 'kubeflow'; +import { MatIconModule } from '@angular/material/icon'; +import { ListInputModule } from 'src/app/shared/list-input/list-input.module'; +import { MatDividerModule } from '@angular/material/divider'; +import { MatCheckboxModule } from '@angular/material/checkbox'; -import { ObjectiveComponent } from './objective.component'; +import { FormObjectiveComponent } from './objective.component'; +import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; -describe('ObjectiveComponent', () => { - let component: ObjectiveComponent; - let fixture: ComponentFixture; +describe('FormObjectiveComponent', () => { + let component: FormObjectiveComponent; + let fixture: ComponentFixture; beforeEach( waitForAsync(() => { TestBed.configureTestingModule({ - declarations: [ObjectiveComponent], + imports: [ + CommonModule, + BrowserAnimationsModule, + FormModule, + MatIconModule, + ListInputModule, + MatDividerModule, + MatCheckboxModule, + ], + declarations: [FormObjectiveComponent], + providers: [{ provide: MatDialog, useValue: {} }], }).compileComponents(); }), ); beforeEach(() => { - fixture = TestBed.createComponent(ObjectiveComponent); + fixture = TestBed.createComponent(FormObjectiveComponent); component = fixture.componentInstance; + let array: FormGroup[] = []; + array.push(new FormGroup({})); + let formArray = new FormArray(array); + component.objectiveForm = new FormGroup({ + strategiesArray: formArray, + type: new FormControl(), + metricName: new FormControl(), + goal: new FormControl(), + setStrategies: new FormControl(), + additionalMetricNames: new FormControl([]), + metricStrategy: new FormControl(), + metricStrategies: new FormArray([]), + }); fixture.detectChanges(); }); diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/trial-template/trial-parameter/trial-parameter.component.spec.ts b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/trial-template/trial-parameter/trial-parameter.component.spec.ts index 337688f66d5..bb35a571580 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/trial-template/trial-parameter/trial-parameter.component.spec.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/trial-template/trial-parameter/trial-parameter.component.spec.ts @@ -1,4 +1,11 @@ +import { CommonModule } from '@angular/common'; import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; +import { FormControl, FormGroup, ReactiveFormsModule } from '@angular/forms'; +import { MatFormFieldModule } from '@angular/material/form-field'; +import { MatIconModule } from '@angular/material/icon'; +import { MatInputModule } from '@angular/material/input'; +import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; +import { PopoverModule } from 'kubeflow'; import { TrialParameterComponent } from './trial-parameter.component'; @@ -9,6 +16,15 @@ describe('TrialParameterComponent', () => { beforeEach( waitForAsync(() => { TestBed.configureTestingModule({ + imports: [ + CommonModule, + BrowserAnimationsModule, + MatFormFieldModule, + MatInputModule, + MatIconModule, + PopoverModule, + ReactiveFormsModule, + ], declarations: [TrialParameterComponent], }).compileComponents(); }), @@ -17,6 +33,11 @@ describe('TrialParameterComponent', () => { beforeEach(() => { fixture = TestBed.createComponent(TrialParameterComponent); component = fixture.componentInstance; + component.formGroup = new FormGroup({ + name: new FormControl(), + reference: new FormControl(), + description: new FormControl(), + }); fixture.detectChanges(); }); diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/trial-template/trial-template.component.spec.ts b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/trial-template/trial-template.component.spec.ts index 782dab572c5..9b0d5f263d7 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/trial-template/trial-template.component.spec.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/trial-template/trial-template.component.spec.ts @@ -1,22 +1,59 @@ import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; +import { FormArray, FormControl, FormGroup } from '@angular/forms'; +import { of } from 'rxjs'; +import { KWABackendService } from 'src/app/services/backend.service'; +import { NgModule } from '@angular/core'; +import { CommonModule } from '@angular/common'; +import { MatDividerModule } from '@angular/material/divider'; +import { FormModule, PopoverModule } from 'kubeflow'; +import { ListKeyValueModule } from 'src/app/shared/list-key-value/list-key-value.module'; +import { AceEditorModule } from 'ng2-ace-editor'; -import { TrialTemplateComponent } from './trial-template.component'; +import { FormTrialTemplateComponent } from './trial-template.component'; +import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; -describe('TrialTemplateComponent', () => { - let component: TrialTemplateComponent; - let fixture: ComponentFixture; +describe('FormTrialTemplateComponent', () => { + let component: FormTrialTemplateComponent; + let fixture: ComponentFixture; beforeEach( waitForAsync(() => { TestBed.configureTestingModule({ - declarations: [TrialTemplateComponent], + imports: [ + CommonModule, + BrowserAnimationsModule, + FormModule, + ListKeyValueModule, + MatDividerModule, + AceEditorModule, + PopoverModule, + ], + declarations: [FormTrialTemplateComponent], + providers: [ + { + provide: KWABackendService, + useValue: { getTrialTemplates: () => of() }, + }, + ], }).compileComponents(); }), ); beforeEach(() => { - fixture = TestBed.createComponent(TrialTemplateComponent); + fixture = TestBed.createComponent(FormTrialTemplateComponent); component = fixture.componentInstance; + component.formGroup = new FormGroup({ + trialParameters: new FormArray([]), + podLabels: new FormControl(), + containerName: new FormControl(), + successCond: new FormControl(), + failureCond: new FormControl(), + retain: new FormControl(), + type: new FormControl(), + cmNamespace: new FormControl(), + cmName: new FormControl(), + cmTrialPath: new FormControl(), + }); fixture.detectChanges(); }); diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/trial-thresholds/trial-thresholds.component.spec.ts b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/trial-thresholds/trial-thresholds.component.spec.ts index c01602cacab..fd8d9948313 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/trial-thresholds/trial-thresholds.component.spec.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/trial-thresholds/trial-thresholds.component.spec.ts @@ -1,22 +1,43 @@ import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; +import { CommonModule } from '@angular/common'; +import { FormModule } from 'kubeflow'; +import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; +import { MatFormFieldModule } from '@angular/material/form-field'; +import { MatInputModule } from '@angular/material/input'; +import { MatSelectModule } from '@angular/material/select'; -import { TrialThresholdsComponent } from './trial-thresholds.component'; +import { FormTrialThresholdsComponent } from './trial-thresholds.component'; +import { FormControl, FormGroup } from '@angular/forms'; describe('TrialThresholdsComponent', () => { - let component: TrialThresholdsComponent; - let fixture: ComponentFixture; + let component: FormTrialThresholdsComponent; + let fixture: ComponentFixture; beforeEach( waitForAsync(() => { TestBed.configureTestingModule({ - declarations: [TrialThresholdsComponent], + imports: [ + CommonModule, + BrowserAnimationsModule, + MatFormFieldModule, + MatInputModule, + MatSelectModule, + FormModule, + ], + declarations: [FormTrialThresholdsComponent], }).compileComponents(); }), ); beforeEach(() => { - fixture = TestBed.createComponent(TrialThresholdsComponent); + fixture = TestBed.createComponent(FormTrialThresholdsComponent); component = fixture.componentInstance; + component.formGroup = new FormGroup({ + parallelTrialCount: new FormControl(), + maxTrialCount: new FormControl(), + maxFailedTrialCount: new FormControl(), + resumePolicy: new FormControl(), + }); fixture.detectChanges(); }); diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/yaml-modal/yaml-modal.component.spec.ts b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/yaml-modal/yaml-modal.component.spec.ts index c9450688373..92298fcb495 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/yaml-modal/yaml-modal.component.spec.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/yaml-modal/yaml-modal.component.spec.ts @@ -1,4 +1,9 @@ +import { CommonModule } from '@angular/common'; import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; +import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog'; +import { MatDialogModule } from '@angular/material/dialog'; +import { FormModule } from 'kubeflow'; +import { AceEditorModule } from 'ng2-ace-editor'; import { YamlModalComponent } from './yaml-modal.component'; @@ -9,7 +14,12 @@ describe('YamlModalComponent', () => { beforeEach( waitForAsync(() => { TestBed.configureTestingModule({ + imports: [CommonModule, MatDialogModule, FormModule, AceEditorModule], declarations: [YamlModalComponent], + providers: [ + { provide: MatDialogRef, useValue: {} }, + { provide: MAT_DIALOG_DATA, useValue: {} }, + ], }).compileComponents(); }), ); diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/details/experiment-details-tab.component.spec.ts b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/details/experiment-details-tab.component.spec.ts index 5882797bb53..e1d85464be6 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/details/experiment-details-tab.component.spec.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/details/experiment-details-tab.component.spec.ts @@ -1,6 +1,10 @@ import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; +import { CommonModule } from '@angular/common'; +import { DetailsListModule, HeadingSubheadingRowModule } from 'kubeflow'; +import { MatSnackBarModule } from '@angular/material/snack-bar'; import { ExperimentDetailsTabComponent } from './experiment-details-tab.component'; +import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; describe('ExperimentDetailsTabComponent', () => { let component: ExperimentDetailsTabComponent; @@ -9,6 +13,13 @@ describe('ExperimentDetailsTabComponent', () => { beforeEach( waitForAsync(() => { TestBed.configureTestingModule({ + imports: [ + CommonModule, + DetailsListModule, + HeadingSubheadingRowModule, + MatSnackBarModule, + BrowserAnimationsModule, + ], declarations: [ExperimentDetailsTabComponent], }).compileComponents(); }), diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/experiment-details.component.spec.ts b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/experiment-details.component.spec.ts index 999356ffa3e..c3d3ffaeaf1 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/experiment-details.component.spec.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/experiment-details.component.spec.ts @@ -1,15 +1,86 @@ import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; +import { ActivatedRoute, Router } from '@angular/router'; +import { KWABackendService } from 'src/app/services/backend.service'; import { ExperimentDetailsComponent } from './experiment-details.component'; +import { of } from 'rxjs'; +import { CommonModule } from '@angular/common'; +import { MatButtonModule } from '@angular/material/button'; +import { MatIconModule } from '@angular/material/icon'; +import { MatTabsModule } from '@angular/material/tabs'; +import { MatProgressSpinnerModule } from '@angular/material/progress-spinner'; +import { + ConfirmDialogService, + NamespaceService, + TitleActionsToolbarModule, + LoadingSpinnerModule, + PanelModule, +} from 'kubeflow'; +import { TrialsTableModule } from './trials-table/trials-table.module'; +import { ExperimentOverviewModule } from './overview/experiment-overview.module'; +import { ExperimentDetailsTabModule } from './details/experiment-details-tab.module'; +import { ExperimentYamlModule } from './yaml/experiment-yaml.module'; +import { TrialsGraphEchartsModule } from './trials-graph-echarts/trials-graph-echarts.module'; +import { ReactiveFormsModule } from '@angular/forms'; +import { MatSnackBarModule } from '@angular/material/snack-bar'; + +let KWABackendServiceStub: Partial; +let NamespaceServiceStub: Partial; + +KWABackendServiceStub = { + getExperimentTrialsInfo: () => of([]), + getExperiment: () => of(), + deleteExperiment: () => of(), +}; + +NamespaceServiceStub = { + getSelectedNamespace: () => of(), +}; describe('ExperimentDetailsComponent', () => { let component: ExperimentDetailsComponent; let fixture: ComponentFixture; + let activatedRouteSpy; beforeEach( waitForAsync(() => { + activatedRouteSpy = { + snapshot: { + params: { + experimentName: '', + }, + queryParams: { + tab: '', + }, + }, + }; TestBed.configureTestingModule({ + imports: [ + CommonModule, + TrialsTableModule, + MatButtonModule, + MatTabsModule, + MatIconModule, + LoadingSpinnerModule, + PanelModule, + ExperimentOverviewModule, + ExperimentDetailsTabModule, + MatProgressSpinnerModule, + ExperimentYamlModule, + TitleActionsToolbarModule, + TrialsGraphEchartsModule, + ReactiveFormsModule, + MatSnackBarModule, + TitleActionsToolbarModule, + ], declarations: [ExperimentDetailsComponent], + providers: [ + { provide: ActivatedRoute, useValue: activatedRouteSpy }, + { provide: Router, useValue: {} }, + { provide: KWABackendService, useValue: KWABackendServiceStub }, + { provide: ConfirmDialogService, useValue: {} }, + { provide: NamespaceService, useValue: NamespaceServiceStub }, + ], }).compileComponents(); }), ); diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/overview/experiment-overview.component.spec.ts b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/overview/experiment-overview.component.spec.ts index a2fbbf69b7e..3876cae9024 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/overview/experiment-overview.component.spec.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/overview/experiment-overview.component.spec.ts @@ -1,6 +1,10 @@ import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; +import { CommonModule } from '@angular/common'; +import { ConditionsTableModule, DetailsListModule } from 'kubeflow'; +import { MatSnackBarModule } from '@angular/material/snack-bar'; import { ExperimentOverviewComponent } from './experiment-overview.component'; +import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; describe('ExperimentOverviewComponent', () => { let component: ExperimentOverviewComponent; @@ -9,6 +13,13 @@ describe('ExperimentOverviewComponent', () => { beforeEach( waitForAsync(() => { TestBed.configureTestingModule({ + imports: [ + CommonModule, + ConditionsTableModule, + DetailsListModule, + MatSnackBarModule, + BrowserAnimationsModule, + ], declarations: [ExperimentOverviewComponent], }).compileComponents(); }), diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/trials-table/trial-modal/overview/metrics/metrics.component.spec.ts b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/trials-table/trial-modal/overview/metrics/metrics.component.spec.ts index 1b5184c1ffd..bb499c93dd3 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/trials-table/trial-modal/overview/metrics/metrics.component.spec.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/trials-table/trial-modal/overview/metrics/metrics.component.spec.ts @@ -1,4 +1,6 @@ import { async, ComponentFixture, TestBed } from '@angular/core/testing'; +import { MatSnackBarModule } from '@angular/material/snack-bar'; +import { ConditionsTableModule, DetailsListModule } from 'kubeflow'; import { TrialModalMetricsComponent } from './metrics.component'; @@ -9,6 +11,7 @@ describe('TrialModalMetricsComponent', () => { beforeEach(async(() => { TestBed.configureTestingModule({ declarations: [TrialModalMetricsComponent], + imports: [ConditionsTableModule, DetailsListModule, MatSnackBarModule], }).compileComponents(); })); diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/trials-table/trial-modal/overview/trial-modal-overview.component.spec.ts b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/trials-table/trial-modal/overview/trial-modal-overview.component.spec.ts index 48ff1b349fb..a0fc77e1397 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/trials-table/trial-modal/overview/trial-modal-overview.component.spec.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/trials-table/trial-modal/overview/trial-modal-overview.component.spec.ts @@ -1,4 +1,12 @@ +import { CommonModule } from '@angular/common'; import { async, ComponentFixture, TestBed } from '@angular/core/testing'; +import { MatSnackBarModule } from '@angular/material/snack-bar'; +import { + ConditionsTableModule, + DetailsListModule, + HeadingSubheadingRowModule, +} from 'kubeflow'; +import { TrialModalMetricsModule } from './metrics/metrics.component.module'; import { TrialModalOverviewComponent } from './trial-modal-overview.component'; @@ -9,12 +17,47 @@ describe('TrialModalOverviewComponent', () => { beforeEach(async(() => { TestBed.configureTestingModule({ declarations: [TrialModalOverviewComponent], + imports: [ + CommonModule, + ConditionsTableModule, + DetailsListModule, + HeadingSubheadingRowModule, + TrialModalMetricsModule, + MatSnackBarModule, + ], }).compileComponents(); })); beforeEach(() => { fixture = TestBed.createComponent(TrialModalOverviewComponent); component = fixture.componentInstance; + component.trial = { + status: { + startTime: '2022-06-01T09:58:23Z', + completionTime: '2022-06-01T10:07:45Z', + conditions: [ + { + type: 'Created', + status: 'True', + reason: 'TrialCreated', + message: 'Trial is created', + lastUpdateTime: '2022-06-01T09:58:23Z', + lastTransitionTime: '2022-06-01T09:58:23Z', + }, + ], + observation: { + metrics: [ + { + name: 'Validation-accuracy', + latest: '0.113854', + min: '0.113854', + max: '0.113854', + }, + ], + }, + }, + }; + fixture.detectChanges(); }); diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/trials-table/trial-modal/trial-modal.component.spec.ts b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/trials-table/trial-modal/trial-modal.component.spec.ts index 28db9af37a8..59f4dd1ce1b 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/trials-table/trial-modal/trial-modal.component.spec.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/trials-table/trial-modal/trial-modal.component.spec.ts @@ -1,15 +1,59 @@ +import { HttpClientModule } from '@angular/common/http'; import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; +import { ReactiveFormsModule } from '@angular/forms'; +import { MatSnackBarModule } from '@angular/material/snack-bar'; +import { MatProgressSpinnerModule } from '@angular/material/progress-spinner'; import { TrialModalComponent } from './trial-modal.component'; +import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; +import { KWABackendService } from 'src/app/services/backend.service'; +import { of } from 'rxjs'; +import { ActivatedRoute, Router } from '@angular/router'; +import { NamespaceService, TitleActionsToolbarModule } from 'kubeflow'; + +let KWABackendServiceStub: Partial; +let NamespaceServiceStub: Partial; + +KWABackendServiceStub = { + getTrial: () => of([]), + getTrialInfo: () => of(), +}; + +NamespaceServiceStub = { + getSelectedNamespace: () => of(), +}; describe('TrialModalComponent', () => { let component: TrialModalComponent; let fixture: ComponentFixture; + let activatedRouteSpy; beforeEach( waitForAsync(() => { + activatedRouteSpy = { + snapshot: { + params: { + trialName: '', + experimentName: '', + }, + }, + }; TestBed.configureTestingModule({ + imports: [ + HttpClientModule, + ReactiveFormsModule, + MatSnackBarModule, + MatProgressSpinnerModule, + BrowserAnimationsModule, + TitleActionsToolbarModule, + ], declarations: [TrialModalComponent], + providers: [ + { provide: ActivatedRoute, useValue: activatedRouteSpy }, + { provide: Router, useValue: {} }, + { provide: KWABackendService, useValue: KWABackendServiceStub }, + { provide: NamespaceService, useValue: NamespaceServiceStub }, + ], }).compileComponents(); }), ); diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/trials-table/trial-modal/trial-modal.module.ts b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/trials-table/trial-modal/trial-modal.module.ts index 0b9eae68c81..5c50cf9cce7 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/trials-table/trial-modal/trial-modal.module.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/trials-table/trial-modal/trial-modal.module.ts @@ -31,6 +31,7 @@ import { TitleActionsToolbarModule, LoadingSpinnerModule, PanelModule, + TitleActionsToolbarModule, ], exports: [TrialModalComponent], }) diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/trials-table/trials-table.component.spec.ts b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/trials-table/trials-table.component.spec.ts index 19ffdd7f863..d9a460d0e44 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/trials-table/trials-table.component.spec.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/trials-table/trials-table.component.spec.ts @@ -1,6 +1,15 @@ import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; - +import { CommonModule } from '@angular/common'; +import { MatTableModule } from '@angular/material/table'; +import { MatIconModule } from '@angular/material/icon'; +import { MatDialogModule } from '@angular/material/dialog'; +import { NgxChartsModule } from '@swimlane/ngx-charts'; +import { MatProgressSpinnerModule } from '@angular/material/progress-spinner'; +import { RouterTestingModule } from '@angular/router/testing'; +import { MatTooltipModule } from '@angular/material/tooltip'; +import { MatButtonModule } from '@angular/material/button'; import { TrialsTableComponent } from './trials-table.component'; +import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; describe('TrialsTableComponent', () => { let component: TrialsTableComponent; @@ -9,6 +18,18 @@ describe('TrialsTableComponent', () => { beforeEach( waitForAsync(() => { TestBed.configureTestingModule({ + imports: [ + CommonModule, + MatTableModule, + MatProgressSpinnerModule, + MatDialogModule, + MatIconModule, + NgxChartsModule, + MatTooltipModule, + MatButtonModule, + RouterTestingModule, + BrowserAnimationsModule, + ], declarations: [TrialsTableComponent], }).compileComponents(); }), diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/trials-table/trials-table.module.ts b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/trials-table/trials-table.module.ts index e83e0f07045..19d3d7fc379 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/trials-table/trials-table.module.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/trials-table/trials-table.module.ts @@ -9,6 +9,7 @@ import { MatProgressSpinnerModule } from '@angular/material/progress-spinner'; import { TrialsTableComponent } from './trials-table.component'; import { MatTooltipModule } from '@angular/material/tooltip'; import { TrialModalComponent } from './trial-modal/trial-modal.component'; +import { TrialModalModule } from './trial-modal/trial-modal.module'; @NgModule({ declarations: [TrialsTableComponent], @@ -20,6 +21,7 @@ import { TrialModalComponent } from './trial-modal/trial-modal.component'; MatIconModule, NgxChartsModule, MatTooltipModule, + TrialModalModule, ], entryComponents: [TrialModalComponent], exports: [TrialsTableComponent], diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/yaml/experiment-yaml.component.spec.ts b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/yaml/experiment-yaml.component.spec.ts index e7c88884d02..aa6e3784b49 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/yaml/experiment-yaml.component.spec.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/yaml/experiment-yaml.component.spec.ts @@ -1,4 +1,7 @@ import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; +import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; +import { CommonModule } from '@angular/common'; +import { AceEditorModule } from 'ng2-ace-editor'; import { ExperimentYamlComponent } from './experiment-yaml.component'; @@ -9,6 +12,7 @@ describe('ExperimentYamlComponent', () => { beforeEach( waitForAsync(() => { TestBed.configureTestingModule({ + imports: [CommonModule, BrowserAnimationsModule, AceEditorModule], declarations: [ExperimentYamlComponent], }).compileComponents(); }), diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiments/experiments.component.spec.ts b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiments/experiments.component.spec.ts index 7a087d8d7f0..c16cc531f59 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiments/experiments.component.spec.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiments/experiments.component.spec.ts @@ -1,5 +1,28 @@ import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; import { ExperimentsComponent } from './experiments.component'; +import { HttpClientTestingModule } from '@angular/common/http/testing'; +import { ReactiveFormsModule } from '@angular/forms'; +import { MatSnackBarModule } from '@angular/material/snack-bar'; +import { Router } from '@angular/router'; +import { of } from 'rxjs'; +import { + ConfirmDialogService, + NamespaceService, + KubeflowModule, +} from 'kubeflow'; +import { KWABackendService } from 'src/app/services/backend.service'; + +let KWABackendServiceStub: Partial; +let NamespaceServiceStub: Partial; + +KWABackendServiceStub = { + getExperiments: () => of(), + deleteExperiment: () => of(), +}; + +NamespaceServiceStub = { + getSelectedNamespace: () => of(), +}; describe('ExperimentsComponent', () => { let component: ExperimentsComponent; @@ -8,7 +31,19 @@ describe('ExperimentsComponent', () => { beforeEach( waitForAsync(() => { TestBed.configureTestingModule({ + imports: [ + HttpClientTestingModule, + ReactiveFormsModule, + MatSnackBarModule, + KubeflowModule, + ], declarations: [ExperimentsComponent], + providers: [ + { provide: Router, useValue: {} }, + { provide: KWABackendService, useValue: KWABackendServiceStub }, + { provide: ConfirmDialogService, useValue: {} }, + { provide: NamespaceService, useValue: NamespaceServiceStub }, + ], }).compileComponents(); }), ); diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiments/optimal-trial/experiment-optimal-trial.component.spec.ts b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiments/optimal-trial/experiment-optimal-trial.component.spec.ts index b9b063abee2..e4a4dd07f54 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiments/optimal-trial/experiment-optimal-trial.component.spec.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiments/optimal-trial/experiment-optimal-trial.component.spec.ts @@ -1,4 +1,7 @@ import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; +import { MatDividerModule } from '@angular/material/divider'; +import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; +import { DetailsListModule, PopoverModule } from 'kubeflow'; import { ExperimentOptimalTrialComponent } from './experiment-optimal-trial.component'; @@ -9,6 +12,12 @@ describe('ExperimentOptimalTrialComponent', () => { beforeEach( waitForAsync(() => { TestBed.configureTestingModule({ + imports: [ + BrowserAnimationsModule, + PopoverModule, + DetailsListModule, + MatDividerModule, + ], declarations: [ExperimentOptimalTrialComponent], }).compileComponents(); }), diff --git a/pkg/new-ui/v1beta1/frontend/src/app/services/backend.service.spec.ts b/pkg/new-ui/v1beta1/frontend/src/app/services/backend.service.spec.ts index 88e92b0a44e..d0c38867cde 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/services/backend.service.spec.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/services/backend.service.spec.ts @@ -1,12 +1,22 @@ import { TestBed } from '@angular/core/testing'; +import { HttpClientTestingModule } from '@angular/common/http/testing'; +import { KWABackendService } from './backend.service'; +import { ReactiveFormsModule } from '@angular/forms'; +import { MatSnackBarModule } from '@angular/material/snack-bar'; -import { BackendService } from './backend.service'; - -describe('BackendService', () => { - beforeEach(() => TestBed.configureTestingModule({})); +describe('KWABackendService', () => { + beforeEach(() => + TestBed.configureTestingModule({ + imports: [ + HttpClientTestingModule, + ReactiveFormsModule, + MatSnackBarModule, + ], + }), + ); it('should be created', () => { - const service: BackendService = TestBed.inject(BackendService); + const service: KWABackendService = TestBed.inject(KWABackendService); expect(service).toBeTruthy(); }); }); diff --git a/pkg/new-ui/v1beta1/frontend/src/app/shared/list-input/list-input.component.spec.ts b/pkg/new-ui/v1beta1/frontend/src/app/shared/list-input/list-input.component.spec.ts index b4d8dc506ae..73a3046e234 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/shared/list-input/list-input.component.spec.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/shared/list-input/list-input.component.spec.ts @@ -1,4 +1,7 @@ import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; +import { FormArray } from '@angular/forms'; +import { MatIconModule } from '@angular/material/icon'; +import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; import { ListInputComponent } from './list-input.component'; @@ -9,6 +12,7 @@ describe('ListInputComponent', () => { beforeEach( waitForAsync(() => { TestBed.configureTestingModule({ + imports: [BrowserAnimationsModule, MatIconModule], declarations: [ListInputComponent], }).compileComponents(); }), @@ -17,6 +21,7 @@ describe('ListInputComponent', () => { beforeEach(() => { fixture = TestBed.createComponent(ListInputComponent); component = fixture.componentInstance; + component.formArray = new FormArray([]); fixture.detectChanges(); }); diff --git a/pkg/new-ui/v1beta1/frontend/src/app/shared/list-key-value/list-key-value.component.spec.ts b/pkg/new-ui/v1beta1/frontend/src/app/shared/list-key-value/list-key-value.component.spec.ts index ecf9a1ac4d6..941baa1d80d 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/shared/list-key-value/list-key-value.component.spec.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/shared/list-key-value/list-key-value.component.spec.ts @@ -1,4 +1,9 @@ import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; +import { FormArray } from '@angular/forms'; +import { CommonModule } from '@angular/common'; +import { MatIconModule } from '@angular/material/icon'; + +import { FormModule } from 'kubeflow'; import { ListKeyValueComponent } from './list-key-value.component'; @@ -9,6 +14,7 @@ describe('ListKeyValueComponent', () => { beforeEach( waitForAsync(() => { TestBed.configureTestingModule({ + imports: [CommonModule, FormModule, MatIconModule], declarations: [ListKeyValueComponent], }).compileComponents(); }), @@ -17,6 +23,7 @@ describe('ListKeyValueComponent', () => { beforeEach(() => { fixture = TestBed.createComponent(ListKeyValueComponent); component = fixture.componentInstance; + component.formArray = new FormArray([]); fixture.detectChanges(); }); diff --git a/pkg/new-ui/v1beta1/frontend/src/app/shared/params-list/add-modal/add-modal.component.spec.ts b/pkg/new-ui/v1beta1/frontend/src/app/shared/params-list/add-modal/add-modal.component.spec.ts index d77e9a988b9..7d7ed0e86d0 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/shared/params-list/add-modal/add-modal.component.spec.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/shared/params-list/add-modal/add-modal.component.spec.ts @@ -1,21 +1,57 @@ import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; +import { CommonModule } from '@angular/common'; +import { MatIconModule } from '@angular/material/icon'; +import { MatDividerModule } from '@angular/material/divider'; +import { MatRadioModule } from '@angular/material/radio'; +import { MatSlideToggleModule } from '@angular/material/slide-toggle'; -import { AddModalComponent } from './add-modal.component'; +import { FormModule, PopoverModule, DetailsListModule } from 'kubeflow'; +import { AddParamModalComponent } from './add-modal.component'; +import { + MatDialogModule, + MatDialogRef, + MAT_DIALOG_DATA, +} from '@angular/material/dialog'; +import { FormControl, FormGroup } from '@angular/forms'; +import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; -describe('AddModalComponent', () => { - let component: AddModalComponent; - let fixture: ComponentFixture; +describe('AddParamModalComponent', () => { + let component: AddParamModalComponent; + let fixture: ComponentFixture; beforeEach( waitForAsync(() => { TestBed.configureTestingModule({ - declarations: [AddModalComponent], + imports: [ + CommonModule, + FormModule, + MatIconModule, + MatDividerModule, + MatRadioModule, + PopoverModule, + DetailsListModule, + MatSlideToggleModule, + MatDialogModule, + BrowserAnimationsModule, + ], + declarations: [AddParamModalComponent], + providers: [ + { + provide: MAT_DIALOG_DATA, + useValue: new FormGroup({ + name: new FormControl(), + parameterType: new FormControl('int'), + feasibleSpace: new FormControl({ min: '1', max: '64', step: '' }), + }), + }, + { provide: MatDialogRef, useValue: {} }, + ], }).compileComponents(); }), ); beforeEach(() => { - fixture = TestBed.createComponent(AddModalComponent); + fixture = TestBed.createComponent(AddParamModalComponent); component = fixture.componentInstance; fixture.detectChanges(); }); diff --git a/pkg/new-ui/v1beta1/frontend/src/app/shared/params-list/parameter/parameter.component.spec.ts b/pkg/new-ui/v1beta1/frontend/src/app/shared/params-list/parameter/parameter.component.spec.ts index 4b56172bed1..44398e79230 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/shared/params-list/parameter/parameter.component.spec.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/shared/params-list/parameter/parameter.component.spec.ts @@ -1,4 +1,13 @@ import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; +import { FormControl, FormGroup } from '@angular/forms'; +import { + MatDialogModule, + MatDialogRef, + MAT_DIALOG_DATA, +} from '@angular/material/dialog'; +import { MatIconModule } from '@angular/material/icon'; +import { DetailsListModule, PopoverModule } from 'kubeflow'; +import { MatTooltipModule } from '@angular/material/tooltip'; import { ParameterComponent } from './parameter.component'; @@ -9,7 +18,18 @@ describe('ParameterComponent', () => { beforeEach( waitForAsync(() => { TestBed.configureTestingModule({ + imports: [ + MatDialogModule, + MatIconModule, + PopoverModule, + MatTooltipModule, + DetailsListModule, + ], declarations: [ParameterComponent], + providers: [ + { provide: MAT_DIALOG_DATA, useValue: {} }, + { provide: MatDialogRef, useValue: {} }, + ], }).compileComponents(); }), ); @@ -17,6 +37,11 @@ describe('ParameterComponent', () => { beforeEach(() => { fixture = TestBed.createComponent(ParameterComponent); component = fixture.componentInstance; + component.paramFormGroup = new FormGroup({ + name: new FormControl(), + parameterType: new FormControl(), + feasibleSpace: new FormControl({ min: 0, max: 10, step: '' }), + }); fixture.detectChanges(); }); diff --git a/pkg/new-ui/v1beta1/frontend/src/app/shared/params-list/params-list.component.spec.ts b/pkg/new-ui/v1beta1/frontend/src/app/shared/params-list/params-list.component.spec.ts index 00984ccb5ba..2286a3069c7 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/shared/params-list/params-list.component.spec.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/shared/params-list/params-list.component.spec.ts @@ -1,6 +1,16 @@ import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; +import { CommonModule } from '@angular/common'; + +import { MatIconModule } from '@angular/material/icon'; +import { MatDividerModule } from '@angular/material/divider'; +import { MatRadioModule } from '@angular/material/radio'; +import { MatSlideToggleModule } from '@angular/material/slide-toggle'; + +import { FormModule, PopoverModule, DetailsListModule } from 'kubeflow'; +import { ListInputModule } from '../list-input/list-input.module'; import { ParamsListComponent } from './params-list.component'; +import { FormArray, FormControl, ReactiveFormsModule } from '@angular/forms'; describe('ParamsListComponent', () => { let component: ParamsListComponent; @@ -9,6 +19,18 @@ describe('ParamsListComponent', () => { beforeEach( waitForAsync(() => { TestBed.configureTestingModule({ + imports: [ + CommonModule, + FormModule, + MatIconModule, + MatDividerModule, + MatRadioModule, + PopoverModule, + DetailsListModule, + MatSlideToggleModule, + ListInputModule, + ReactiveFormsModule, + ], declarations: [ParamsListComponent], }).compileComponents(); }), @@ -17,6 +39,7 @@ describe('ParamsListComponent', () => { beforeEach(() => { fixture = TestBed.createComponent(ParamsListComponent); component = fixture.componentInstance; + component.paramsArray = new FormArray([]); fixture.detectChanges(); }); diff --git a/pkg/new-ui/v1beta1/frontend/tsconfig.json b/pkg/new-ui/v1beta1/frontend/tsconfig.json index 39197f280d2..933752bffbf 100644 --- a/pkg/new-ui/v1beta1/frontend/tsconfig.json +++ b/pkg/new-ui/v1beta1/frontend/tsconfig.json @@ -15,7 +15,8 @@ "paths": { "@app/environment": ["src/environments/environment"] }, - "lib": ["es2018", "dom"] + "lib": ["es2018", "dom"], + "allowSyntheticDefaultImports": true }, "angularCompilerOptions": { "fullTemplateTypeCheck": true,