From ae1655c6f996196b2811385c7ecb985d698f080a Mon Sep 17 00:00:00 2001 From: Orfeas Kourkakis Date: Mon, 21 Nov 2022 11:48:12 +0200 Subject: [PATCH] KWA: Use new Editor component (Monaco) (#2023) * kwa(front): Add new Editor component Import new Editor component from Kubeflow Common Library and replace all instances of previous Ace Editor. Signed-off-by: Orfeas Kourkakis * Update COMMIT file to a more recent one in Kubeflow Signed-off-by: Orfeas Kourkakis Signed-off-by: Orfeas Kourkakis --- pkg/new-ui/v1beta1/frontend/COMMIT | 2 +- pkg/new-ui/v1beta1/frontend/angular.json | 16 +++++++----- pkg/new-ui/v1beta1/frontend/karma.conf.js | 11 ++++++++ pkg/new-ui/v1beta1/frontend/package-lock.json | 26 +++++-------------- pkg/new-ui/v1beta1/frontend/package.json | 2 +- pkg/new-ui/v1beta1/frontend/proxy.conf.json | 5 ++++ .../metrics-collector.component.html | 12 ++++----- .../metrics-collector.component.scss | 4 --- .../metrics-collector.component.spec.ts | 5 ++-- .../metrics-collector.module.ts | 5 ++-- .../trial-template.component.html | 10 +++---- .../trial-template.component.scss | 4 --- .../trial-template.component.spec.ts | 5 ++-- .../trial-template/trial-template.module.ts | 5 ++-- .../yaml-modal/yaml-modal.component.html | 8 +++++- .../yaml-modal/yaml-modal.component.scss | 4 --- .../yaml-modal/yaml-modal.component.spec.ts | 5 ++-- .../yaml-modal/yaml-modal.module.ts | 5 ++-- .../experiment-details.component.html | 8 +++--- .../yaml/experiment-yaml.component.html | 10 +++---- .../yaml/experiment-yaml.component.scss | 4 --- .../yaml/experiment-yaml.component.spec.ts | 4 +-- .../yaml/experiment-yaml.module.ts | 4 +-- .../experiments/experiments.component.spec.ts | 3 +++ 24 files changed, 80 insertions(+), 87 deletions(-) diff --git a/pkg/new-ui/v1beta1/frontend/COMMIT b/pkg/new-ui/v1beta1/frontend/COMMIT index 36d9df523bf..045159cc561 100644 --- a/pkg/new-ui/v1beta1/frontend/COMMIT +++ b/pkg/new-ui/v1beta1/frontend/COMMIT @@ -1 +1 @@ -c4ca7a9 \ No newline at end of file +1cca7b81 \ No newline at end of file diff --git a/pkg/new-ui/v1beta1/frontend/angular.json b/pkg/new-ui/v1beta1/frontend/angular.json index 92c738ab300..21e0efd4e8e 100644 --- a/pkg/new-ui/v1beta1/frontend/angular.json +++ b/pkg/new-ui/v1beta1/frontend/angular.json @@ -23,13 +23,17 @@ "main": "src/main.ts", "polyfills": "src/polyfills.ts", "tsConfig": "tsconfig.app.json", - "assets": ["src/favicon.ico", "src/assets"], - "styles": ["src/styles.scss", "src/assets/css/d3.parcoords.css"], - "scripts": [ - "node_modules/ace-builds/src-min/ace.js", - "node_modules/ace-builds/src-min/mode-yaml.js", - "node_modules/ace-builds/src-min/theme-xcode.js" + "assets": [ + "src/favicon.ico", + "src/assets", + { + "glob": "**/*", + "input": "node_modules/monaco-editor", + "output": "assets/monaco-editor" + } ], + "styles": ["src/styles.scss", "src/assets/css/d3.parcoords.css"], + "scripts": [], "vendorChunk": true, "extractLicenses": false, "buildOptimizer": false, diff --git a/pkg/new-ui/v1beta1/frontend/karma.conf.js b/pkg/new-ui/v1beta1/frontend/karma.conf.js index d26663c10d4..2e0afde0181 100644 --- a/pkg/new-ui/v1beta1/frontend/karma.conf.js +++ b/pkg/new-ui/v1beta1/frontend/karma.conf.js @@ -12,6 +12,17 @@ module.exports = function (config) { require('karma-coverage-istanbul-reporter'), require('@angular-devkit/build-angular/plugins/karma') ], + files: [ + { + pattern: 'node_modules/monaco-editor/**', + watched: false, + included: false, + served: true, + }, + ], + proxies: { + '/static/assets/monaco-editor/': '/base/node_modules/monaco-editor/', + }, client: { clearContext: false // leave Jasmine Spec Runner output visible in browser }, diff --git a/pkg/new-ui/v1beta1/frontend/package-lock.json b/pkg/new-ui/v1beta1/frontend/package-lock.json index 27466669f2f..be90ba8cf8a 100644 --- a/pkg/new-ui/v1beta1/frontend/package-lock.json +++ b/pkg/new-ui/v1beta1/frontend/package-lock.json @@ -2470,11 +2470,6 @@ "negotiator": "0.6.2" } }, - "ace-builds": { - "version": "1.4.12", - "resolved": "https://registry.npmjs.org/ace-builds/-/ace-builds-1.4.12.tgz", - "integrity": "sha512-G+chJctFPiiLGvs3+/Mly3apXTcfgE45dT5yp12BcWZ1kUs+gm0qd3/fv4gsz6fVag4mM0moHVpjHDIgph6Psg==" - }, "acorn": { "version": "8.5.0", "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.5.0.tgz", @@ -2616,7 +2611,7 @@ "ansi-regex": { "version": "2.1.1", "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz", - "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8=", + "integrity": "sha512-TIGnTpdo+E3+pCyAluZvtED5p5wCqLdezCyhPZzKPcxvFplEt4i+W7OONCKgeZFT3+y5NZZfOOS/Bdcanm1MYA==", "dev": true }, "ansi-styles": { @@ -3089,11 +3084,6 @@ "integrity": "sha1-aN/1++YMUes3cl6p4+0xDcwed24=", "dev": true }, - "brace": { - "version": "0.11.1", - "resolved": "https://registry.npmjs.org/brace/-/brace-0.11.1.tgz", - "integrity": "sha1-SJb8ydVE7vRfS7dmDbMg07N5/lg=" - }, "brace-expansion": { "version": "1.1.11", "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz", @@ -7758,6 +7748,11 @@ "minimist": "^1.2.5" } }, + "monaco-editor": { + "version": "0.33.0", + "resolved": "https://registry.npmjs.org/monaco-editor/-/monaco-editor-0.33.0.tgz", + "integrity": "sha512-VcRWPSLIUEgQJQIE0pVT8FcGBIgFoxz7jtqctE+IiCxWugD0DwgyQBcZBhdSrdMC84eumoqMZsGl2GTreOzwqw==" + }, "ms": { "version": "2.1.2", "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz", @@ -7859,15 +7854,6 @@ "integrity": "sha512-Yd3UES5mWCSqR+qNT93S3UoYUkqAZ9lLg8a7g9rimsWmYGK8cVToA4/sF3RrshdyV3sAGMXVUmpMYOw+dLpOuw==", "dev": true }, - "ng2-ace-editor": { - "version": "0.3.9", - "resolved": "https://registry.npmjs.org/ng2-ace-editor/-/ng2-ace-editor-0.3.9.tgz", - "integrity": "sha512-e8Q4YCirlL/OEiekewmzupG+zV3prYsiYmQnRzQzd0wNgsPjOLOdb0it7cCbzFfIXKGyIIHKTW5584WxPr2LnQ==", - "requires": { - "ace-builds": "^1.4.2", - "brace": "^0.11.1" - } - }, "ngx-echarts": { "version": "8.0.1", "resolved": "https://registry.npmjs.org/ngx-echarts/-/ngx-echarts-8.0.1.tgz", diff --git a/pkg/new-ui/v1beta1/frontend/package.json b/pkg/new-ui/v1beta1/frontend/package.json index 5c38e393b22..8e9081c4593 100644 --- a/pkg/new-ui/v1beta1/frontend/package.json +++ b/pkg/new-ui/v1beta1/frontend/package.json @@ -39,7 +39,7 @@ "js-yaml": "^4.0.0", "lodash-es": "4.17.21", "material-icons": "^0.7.7", - "ng2-ace-editor": "^0.3.9", + "monaco-editor": "^0.33.0", "ngx-echarts": "^8.0.1", "ngx-json-viewer": "^2.4.0", "rxjs": "~6.6.7", diff --git a/pkg/new-ui/v1beta1/frontend/proxy.conf.json b/pkg/new-ui/v1beta1/frontend/proxy.conf.json index 269fd1580a3..0abc995aabe 100644 --- a/pkg/new-ui/v1beta1/frontend/proxy.conf.json +++ b/pkg/new-ui/v1beta1/frontend/proxy.conf.json @@ -4,5 +4,10 @@ "secure": false, "logLevel": "debug", "changeOrigin": true + }, + "/static": { + "target": "http://localhost:4200", + "pathRewrite": { "^/static": "" }, + "secure": false } } diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/metrics-collector/metrics-collector.component.html b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/metrics-collector/metrics-collector.component.html index 0217a3ebfa4..06a90f6b1b6 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/metrics-collector/metrics-collector.component.html +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/metrics-collector/metrics-collector.component.html @@ -68,13 +68,13 @@ -
+ [language]="'yaml'" + [readOnly]="false" + [width]="375" + [height]="300" + > diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/metrics-collector/metrics-collector.component.scss b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/metrics-collector/metrics-collector.component.scss index e5c4a2c9962..e69de29bb2d 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/metrics-collector/metrics-collector.component.scss +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/metrics-collector/metrics-collector.component.scss @@ -1,4 +0,0 @@ -.ace-editor { - width: 375px; - height: 300px; -} 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 d9a6117bf1f..45f22e3ce4d 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,9 +1,8 @@ import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; import { FormControl, FormGroup } from '@angular/forms'; import { CommonModule } from '@angular/common'; -import { FormModule } from 'kubeflow'; +import { EditorModule, FormModule } from 'kubeflow'; import { ListKeyValueModule } from 'src/app/shared/list-key-value/list-key-value.module'; -import { AceEditorModule } from 'ng2-ace-editor'; import { FormMetricsCollectorComponent } from './metrics-collector.component'; import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; @@ -20,7 +19,7 @@ describe('FormMetricsCollectorComponent', () => { BrowserAnimationsModule, FormModule, ListKeyValueModule, - AceEditorModule, + EditorModule, ], declarations: [FormMetricsCollectorComponent], }).compileComponents(); diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/metrics-collector/metrics-collector.module.ts b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/metrics-collector/metrics-collector.module.ts index 75a0edf26f7..172e73a2cf5 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/metrics-collector/metrics-collector.module.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/metrics-collector/metrics-collector.module.ts @@ -1,13 +1,12 @@ import { NgModule } from '@angular/core'; import { CommonModule } from '@angular/common'; import { FormMetricsCollectorComponent } from './metrics-collector.component'; -import { FormModule } from 'kubeflow'; +import { FormModule, EditorModule } from 'kubeflow'; import { ListKeyValueModule } from 'src/app/shared/list-key-value/list-key-value.module'; -import { AceEditorModule } from 'ng2-ace-editor'; @NgModule({ declarations: [FormMetricsCollectorComponent], - imports: [CommonModule, FormModule, ListKeyValueModule, AceEditorModule], + imports: [CommonModule, FormModule, ListKeyValueModule, EditorModule], exports: [FormMetricsCollectorComponent], }) export class FormMetricsCollectorModule {} diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/trial-template/trial-template.component.html b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/trial-template/trial-template.component.html index 02e3ca1943b..1737b1e2dbf 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/trial-template/trial-template.component.html +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/trial-template/trial-template.component.html @@ -84,14 +84,14 @@ -
+ [width]="375" + [height]="350" + > diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/trial-template/trial-template.component.scss b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/trial-template/trial-template.component.scss index fe6dd14ffbb..8b7106efb76 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/trial-template/trial-template.component.scss +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/trial-template/trial-template.component.scss @@ -5,7 +5,3 @@ .margin-top { margin-top: 12px; } - -[ace-editor] { - height: 350px; -} 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 9b0d5f263d7..c70fdfe5431 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 @@ -5,9 +5,8 @@ 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 { EditorModule, FormModule, PopoverModule } from 'kubeflow'; import { ListKeyValueModule } from 'src/app/shared/list-key-value/list-key-value.module'; -import { AceEditorModule } from 'ng2-ace-editor'; import { FormTrialTemplateComponent } from './trial-template.component'; import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; @@ -25,8 +24,8 @@ describe('FormTrialTemplateComponent', () => { FormModule, ListKeyValueModule, MatDividerModule, - AceEditorModule, PopoverModule, + EditorModule, ], declarations: [FormTrialTemplateComponent], providers: [ diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/trial-template/trial-template.module.ts b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/trial-template/trial-template.module.ts index 2e57afff157..f1011d13ece 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/trial-template/trial-template.module.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/trial-template/trial-template.module.ts @@ -3,9 +3,8 @@ import { CommonModule } from '@angular/common'; import { MatDividerModule } from '@angular/material/divider'; import { FormTrialTemplateComponent } from './trial-template.component'; -import { FormModule, PopoverModule } from 'kubeflow'; +import { FormModule, PopoverModule, EditorModule } from 'kubeflow'; import { ListKeyValueModule } from 'src/app/shared/list-key-value/list-key-value.module'; -import { AceEditorModule } from 'ng2-ace-editor'; import { TrialParameterComponent } from './trial-parameter/trial-parameter.component'; @NgModule({ @@ -15,8 +14,8 @@ import { TrialParameterComponent } from './trial-parameter/trial-parameter.compo FormModule, ListKeyValueModule, MatDividerModule, - AceEditorModule, PopoverModule, + EditorModule, ], exports: [FormTrialTemplateComponent], }) diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/yaml-modal/yaml-modal.component.html b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/yaml-modal/yaml-modal.component.html index a7e2ab2e0f9..c38e6cf5424 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/yaml-modal/yaml-modal.component.html +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/yaml-modal/yaml-modal.component.html @@ -1,7 +1,13 @@

Edit YAML

-
+
diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/yaml-modal/yaml-modal.component.scss b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/yaml-modal/yaml-modal.component.scss index 50034b9fb8a..e69de29bb2d 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/yaml-modal/yaml-modal.component.scss +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/yaml-modal/yaml-modal.component.scss @@ -1,4 +0,0 @@ -[ace-editor] { - height: 350px; - width: 700px; -} 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 92298fcb495..721e0f49073 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 @@ -2,8 +2,7 @@ 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 { EditorModule, FormModule } from 'kubeflow'; import { YamlModalComponent } from './yaml-modal.component'; @@ -14,7 +13,7 @@ describe('YamlModalComponent', () => { beforeEach( waitForAsync(() => { TestBed.configureTestingModule({ - imports: [CommonModule, MatDialogModule, FormModule, AceEditorModule], + imports: [CommonModule, MatDialogModule, FormModule, EditorModule], declarations: [YamlModalComponent], providers: [ { provide: MatDialogRef, useValue: {} }, diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/yaml-modal/yaml-modal.module.ts b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/yaml-modal/yaml-modal.module.ts index 4a25ccb4ffd..20dee52e004 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/yaml-modal/yaml-modal.module.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-creation/yaml-modal/yaml-modal.module.ts @@ -2,11 +2,10 @@ import { NgModule } from '@angular/core'; import { CommonModule } from '@angular/common'; import { YamlModalComponent } from './yaml-modal.component'; import { MatDialogModule } from '@angular/material/dialog'; -import { FormModule } from 'kubeflow'; -import { AceEditorModule } from 'ng2-ace-editor'; +import { FormModule, EditorModule } from 'kubeflow'; @NgModule({ declarations: [YamlModalComponent], - imports: [CommonModule, MatDialogModule, FormModule, AceEditorModule], + imports: [CommonModule, MatDialogModule, FormModule, EditorModule], }) export class YamlModalModule {} diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/experiment-details.component.html b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/experiment-details.component.html index 722ad0e1b93..c180312c45d 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/experiment-details.component.html +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/experiment-details.component.html @@ -61,9 +61,11 @@ > - + + +
diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/yaml/experiment-yaml.component.html b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/yaml/experiment-yaml.component.html index e519c802a48..03e719bbd4a 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/yaml/experiment-yaml.component.html +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/yaml/experiment-yaml.component.html @@ -1,8 +1,6 @@ -
+ [height]="500" +> diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/yaml/experiment-yaml.component.scss b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/yaml/experiment-yaml.component.scss index fd58b5f6d2c..b2ed3b0dddd 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/yaml/experiment-yaml.component.scss +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/yaml/experiment-yaml.component.scss @@ -2,7 +2,3 @@ display: block; overflow: auto; } - -[ace-editor] { - width: 100%; -} 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 aa6e3784b49..2ac7c9f0c08 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,9 +1,9 @@ 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'; +import { EditorModule } from 'kubeflow'; describe('ExperimentYamlComponent', () => { let component: ExperimentYamlComponent; @@ -12,7 +12,7 @@ describe('ExperimentYamlComponent', () => { beforeEach( waitForAsync(() => { TestBed.configureTestingModule({ - imports: [CommonModule, BrowserAnimationsModule, AceEditorModule], + imports: [CommonModule, BrowserAnimationsModule, EditorModule], declarations: [ExperimentYamlComponent], }).compileComponents(); }), diff --git a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/yaml/experiment-yaml.module.ts b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/yaml/experiment-yaml.module.ts index 261af14377f..33699c52247 100644 --- a/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/yaml/experiment-yaml.module.ts +++ b/pkg/new-ui/v1beta1/frontend/src/app/pages/experiment-details/yaml/experiment-yaml.module.ts @@ -2,11 +2,11 @@ import { NgModule } from '@angular/core'; import { CommonModule } from '@angular/common'; import { ExperimentYamlComponent } from './experiment-yaml.component'; -import { AceEditorModule } from 'ng2-ace-editor'; +import { EditorModule } from 'kubeflow'; @NgModule({ declarations: [ExperimentYamlComponent], - imports: [CommonModule, AceEditorModule], + imports: [CommonModule, EditorModule], exports: [ExperimentYamlComponent], }) export class ExperimentYamlModule {} 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 c16cc531f59..edc707247ae 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 @@ -11,6 +11,7 @@ import { KubeflowModule, } from 'kubeflow'; import { KWABackendService } from 'src/app/services/backend.service'; +import { RouterTestingModule } from '@angular/router/testing'; let KWABackendServiceStub: Partial; let NamespaceServiceStub: Partial; @@ -22,6 +23,7 @@ KWABackendServiceStub = { NamespaceServiceStub = { getSelectedNamespace: () => of(), + getSelectedNamespace2: () => of(), }; describe('ExperimentsComponent', () => { @@ -36,6 +38,7 @@ describe('ExperimentsComponent', () => { ReactiveFormsModule, MatSnackBarModule, KubeflowModule, + RouterTestingModule, ], declarations: [ExperimentsComponent], providers: [