X-Git-Url: https://gerrit.o-ran-sc.org/r/gitweb?a=blobdiff_plain;ds=sidebyside;f=webapp-frontend%2Fsrc%2Fapp%2Fpolicy%2Ftyped-policy-editor%2Ftyped-policy-editor.component.spec.ts;h=fc4a16631651f04f33170218ce365ddd7f2c4dc0;hb=042a087cf3eea5e6f941ee9add6e1c50cb106e91;hp=9f58af2d43744252e13a5b0b95105bb1f14373f2;hpb=b3f060ed6175d6dab20e16f51cb96a8ed02a6fc2;p=portal%2Fnonrtric-controlpanel.git

diff --git a/webapp-frontend/src/app/policy/typed-policy-editor/typed-policy-editor.component.spec.ts b/webapp-frontend/src/app/policy/typed-policy-editor/typed-policy-editor.component.spec.ts
index 9f58af2..fc4a166 100644
--- a/webapp-frontend/src/app/policy/typed-policy-editor/typed-policy-editor.component.spec.ts
+++ b/webapp-frontend/src/app/policy/typed-policy-editor/typed-policy-editor.component.spec.ts
@@ -1,41 +1,174 @@
-import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/compiler';
-import { ChangeDetectorRef } from '@angular/core';
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
-import { MatIconModule } from '@angular/material/icon';
-import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
+// -
+//   ========================LICENSE_START=================================
+//   O-RAN-SC
+//   %%
+//   Copyright (C) 2021: Nordix Foundation
+//   %%
+//   Licensed under the Apache License, Version 2.0 (the "License");
+//   you may not use this file except in compliance with the License.
+//   You may obtain a copy of the License at
+//
+//        http://www.apache.org/licenses/LICENSE-2.0
+//
+//   Unless required by applicable law or agreed to in writing, software
+//   distributed under the License is distributed on an "AS IS" BASIS,
+//   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+//   See the License for the specific language governing permissions and
+//   limitations under the License.
+//   ========================LICENSE_END===================================
+//
 
-import { TypedPolicyEditorComponent } from './typed-policy-editor.component';
+import { CUSTOM_ELEMENTS_SCHEMA } from "@angular/compiler";
+import { Component } from "@angular/core";
+import { ComponentFixture, TestBed } from "@angular/core/testing";
+import { MatIconModule } from "@angular/material/icon";
+import { BrowserModule } from "@angular/platform-browser";
+import { BrowserAnimationsModule } from "@angular/platform-browser/animations";
 
-describe('TypedPolicyEditorComponent', () => {
-  let component: TypedPolicyEditorComponent;
-  let fixture: ComponentFixture<TypedPolicyEditorComponent>;
+import { TypedPolicyEditorComponent } from "./typed-policy-editor.component";
 
-  beforeEach(async(() => {
+describe("TypedPolicyEditorComponent", () => {
+  let component: TestTypedPolicyEditorComponentHostComponent;
+  let fixture: ComponentFixture<TestTypedPolicyEditorComponentHostComponent>;
+
+  beforeEach(async () => {
     TestBed.configureTestingModule({
-      imports: [
-        BrowserAnimationsModule,
-        MatIconModule
-      ],
+      imports: [BrowserModule, BrowserAnimationsModule, MatIconModule],
       declarations: [
-        TypedPolicyEditorComponent
-      ],
-      schemas: [
-        CUSTOM_ELEMENTS_SCHEMA
+        TypedPolicyEditorComponent,
+        TestTypedPolicyEditorComponentHostComponent,
       ],
-      providers: [
-        ChangeDetectorRef
-      ]
-    })
-    .compileComponents();
-  }));
+      schemas: [CUSTOM_ELEMENTS_SCHEMA],
+    }).compileComponents();
+  });
 
   beforeEach(() => {
-    fixture = TestBed.createComponent(TypedPolicyEditorComponent);
+    fixture = TestBed.createComponent(
+      TestTypedPolicyEditorComponentHostComponent
+    );
     component = fixture.componentInstance;
     fixture.detectChanges();
   });
 
-  it('should create', () => {
+  it("should create", () => {
     expect(component).toBeTruthy();
   });
+
+  it("should have JSON form visible and JSON and JSON Schema not visible", () => {
+    let propertiesHeading = fixture.debugElement.nativeElement.querySelector(
+      "#propertiesHeading"
+    );
+    expect(propertiesHeading).toBeTruthy();
+    expect(propertiesHeading.innerText).toContain("Properties");
+    let propertiesIcon = fixture.debugElement.nativeElement.querySelector(
+      "#propertiesIcon"
+    );
+    expect(propertiesIcon).toBeTruthy();
+    expect(propertiesIcon.innerText).toEqual("expand_less");
+    let jsonForm = fixture.debugElement.nativeElement.querySelector(
+      "json-schema-form"
+    );
+    expect(jsonForm).toBeTruthy();
+
+    let jsonHeading = fixture.debugElement.nativeElement.querySelector(
+      "#jsonHeading"
+    );
+    expect(jsonHeading).toBeTruthy();
+    expect(jsonHeading.innerText).toContain("JSON");
+    let jsonIcon = fixture.debugElement.nativeElement.querySelector(
+      "#jsonIcon"
+    );
+    expect(jsonIcon).toBeTruthy();
+    expect(jsonIcon.innerText).toEqual("expand_more");
+    let jsonDiv = fixture.debugElement.nativeElement.querySelector("#jsonDiv");
+    expect(jsonDiv).toBeFalsy();
+
+    let schemaHeading = fixture.debugElement.nativeElement.querySelector(
+      "#schemaHeading"
+    );
+    expect(schemaHeading).toBeTruthy();
+    expect(schemaHeading.innerText).toContain("JSON Schema");
+    let schemaIcon = fixture.debugElement.nativeElement.querySelector(
+      "#schemaIcon"
+    );
+    expect(schemaIcon).toBeTruthy();
+    expect(schemaIcon.innerText).toEqual("expand_more");
+    let schemaDiv = fixture.debugElement.nativeElement.querySelector(
+      "#schemaDiv"
+    );
+    expect(schemaDiv).toBeFalsy();
+  });
+
+  it("should hide JSON form", () => {
+    let propertiesHeading = fixture.debugElement.nativeElement.querySelector(
+      "#propertiesHeading"
+    );
+    expect(propertiesHeading).toBeTruthy();
+    propertiesHeading.click();
+    fixture.detectChanges();
+
+    let propertiesIcon = fixture.debugElement.nativeElement.querySelector(
+      "#propertiesIcon"
+    );
+    expect(propertiesIcon).toBeTruthy();
+    expect(propertiesIcon.innerText).toEqual("expand_more");
+    let propertiesDiv = fixture.debugElement.nativeElement.querySelector(
+      "propertiesDiv"
+    );
+    expect(propertiesDiv).toBeFalsy();
+  });
+
+  it("should show JSON with text for dark mode", () => {
+    let jsonHeading = fixture.debugElement.nativeElement.querySelector(
+      "#jsonHeading"
+    );
+    expect(jsonHeading).toBeTruthy();
+    jsonHeading.click();
+    fixture.detectChanges();
+
+    let jsonIcon = fixture.debugElement.nativeElement.querySelector(
+      "#jsonIcon"
+    );
+    expect(jsonIcon).toBeTruthy();
+    expect(jsonIcon.innerText).toEqual("expand_less");
+    let jsonDiv = fixture.debugElement.nativeElement.querySelector("#jsonDiv");
+    expect(jsonDiv).toBeTruthy();
+    let jsonText = jsonDiv.querySelector("pre");
+    expect(jsonText.classList).toContain("text__dark");
+  });
+
+  it("should show JSON Schema with text for dark mode", () => {
+    let schemaHeading = fixture.debugElement.nativeElement.querySelector(
+      "#schemaHeading"
+    );
+    expect(schemaHeading).toBeTruthy();
+    schemaHeading.click();
+    fixture.detectChanges();
+
+    let schemaIcon = fixture.debugElement.nativeElement.querySelector(
+      "#schemaIcon"
+    );
+    expect(schemaIcon).toBeTruthy();
+    expect(schemaIcon.innerText).toEqual("expand_less");
+    let schemaDiv = fixture.debugElement.nativeElement.querySelector(
+      "#schemaDiv"
+    );
+    expect(schemaDiv).toBeTruthy();
+    let jsonSchemaText = schemaDiv.querySelector("pre");
+    expect(jsonSchemaText.classList).toContain("text__dark");
+  });
+
+  @Component({
+    selector: `typed-policy-editor-host-component`,
+    template: `<nrcp-typed-policy-editor
+      [jsonObject]="policyJson"
+      [jsonSchemaObject]="jsonSchemaObject"
+      [darkMode]="true"
+    ></nrcp-typed-policy-editor>`,
+  })
+  class TestTypedPolicyEditorComponentHostComponent {
+    policyJson: string = '{"A":"A"}';
+    jsonSchemaObject: string =
+      'policy_schema": { "description": "Type 1 policy type", "title": "1", "type": "object", "properties": { "A": "string" }, "required": [ "A" ]}';
+  }
 });