* limitations under the License.
* ========================LICENSE_END===================================
*/
-import { AfterViewInit, Component, Inject, OnInit, ViewChild } from '@angular/core';
+import { Component, Inject, OnInit, ViewChild } from '@angular/core';
import { MatDialogConfig, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import * as uuid from 'uuid';
import { CreatePolicyInstance, PolicyInstance, PolicyTypeSchema } from '../../interfaces/policy.types';
import { UiService } from '../../services/ui/ui.service';
import { HttpErrorResponse } from '@angular/common/http';
import { FormGroup, FormControl, Validators } from '@angular/forms';
-import { ChangeDetectorRef } from '@angular/core';
import { Ric, Rics } from '../../interfaces/ric';
import { TypedPolicyEditorComponent } from '../typed-policy-editor/typed-policy-editor.component';
templateUrl: './policy-instance-dialog.component.html',
styleUrls: ['./policy-instance-dialog.component.scss']
})
-export class PolicyInstanceDialogComponent implements OnInit, AfterViewInit {
+export class PolicyInstanceDialogComponent implements OnInit {
@ViewChild(TypedPolicyEditorComponent)
policyEditor: TypedPolicyEditorComponent;
instanceForm: FormGroup;
}
constructor(
- private cdr: ChangeDetectorRef,
private dataService: PolicyService,
private errorService: ErrorDialogService,
private notificationService: NotificationService,
}
}
- ngAfterViewInit() {
- this.cdr.detectChanges();
- }
-
get ricSelector() { return this.instanceForm.get('ricSelector'); }
onSubmit() {
-->
-<h4 class="default-cursor" (click)="toggleVisible('form')">
- <mat-icon matTooltip="Properties">{{isVisible.form ? 'expand_less' : 'expand_more'}}</mat-icon>
+<h4 id="propertiesHeading" class="default-cursor" (click)="toggleVisible('form')">
+ <mat-icon id="propertiesIcon" matTooltip="Properties">{{isVisible.form ? 'expand_less' : 'expand_more'}}</mat-icon>
Properties
</h4>
-<div *ngIf="isVisible.form" class="json-schema-form" [@expandSection]="true">
+<div id="propertiesDiv" *ngIf="isVisible.form" class="json-schema-form" [@expandSection]="true">
<div *ngIf="!formActive">{{jsonFormStatusMessage}}</div>
<json-schema-form id="json-schema-form" *ngIf="formActive" [form]="jsonSchemaObject"
(validationErrors)="validationErrors($event)">
</json-schema-form>
</div>
-<h4 [class.text-danger]="!formIsValid && !isVisible.json" [class.default-cursor]="formIsValid || isVisible.json"
+<h4 id="jsonHeading" [class.text-danger]="!formIsValid && !isVisible.json" [class.default-cursor]="formIsValid || isVisible.json"
(click)="toggleVisible('json')">
-<mat-icon matTooltip="Json">{{isVisible.json ? 'expand_less' : 'expand_more'}}</mat-icon>
-Json
+<mat-icon id="jsonIcon" matTooltip="Json">{{isVisible.json ? 'expand_less' : 'expand_more'}}</mat-icon>
+JSON
</h4>
-<div *ngIf="isVisible.json" fxLayout="column" [@expandSection]="true">
+<div id="jsonDiv" *ngIf="isVisible.json" fxLayout="column" [@expandSection]="true">
<div>
<strong *ngIf="formIsValid || prettyValidationErrors" [class.text-muted]="formIsValid"
[class.text-danger]="!formIsValid">
</div>
</div>
-<h4 class="default-cursor" (click)="toggleVisible('schema')">
-<mat-icon matTooltip="Json Schema">{{isVisible.schema ? 'expand_less' : 'expand_more'}}</mat-icon>
-Json Schema
+<h4 id="schemaHeading" class="default-cursor" (click)="toggleVisible('schema')">
+<mat-icon id="schemaIcon" matTooltip="Json Schema">{{isVisible.schema ? 'expand_less' : 'expand_more'}}</mat-icon>
+JSON Schema
</h4>
-<div *ngIf="isVisible.schema" fxLayout="column" [@expandSection]="true">
+<div id="schemaDiv" *ngIf="isVisible.schema" fxLayout="column" [@expandSection]="true">
<strong class="text-muted">Schema</strong>
<pre [class.text__dark]="darkMode">{{schemaAsString}}</pre>
</div>
+// -
+// ========================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 { CUSTOM_ELEMENTS_SCHEMA } from '@angular/compiler';
-import { ChangeDetectorRef } from '@angular/core';
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+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';
import { TypedPolicyEditorComponent } from './typed-policy-editor.component';
describe('TypedPolicyEditorComponent', () => {
- let component: TypedPolicyEditorComponent;
- let fixture: ComponentFixture<TypedPolicyEditorComponent>;
+ let component: TestTypedPolicyEditorComponentHostComponent;
+ let fixture: ComponentFixture<TestTypedPolicyEditorComponentHostComponent>;
- beforeEach(async(() => {
+ beforeEach(async () => {
TestBed.configureTestingModule({
imports: [
+ BrowserModule,
BrowserAnimationsModule,
MatIconModule
],
declarations: [
- TypedPolicyEditorComponent
+ TypedPolicyEditorComponent,
+ TestTypedPolicyEditorComponentHostComponent
],
schemas: [
CUSTOM_ELEMENTS_SCHEMA
- ],
- providers: [
- ChangeDetectorRef
]
})
.compileComponents();
- }));
+ });
beforeEach(() => {
- fixture = TestBed.createComponent(TypedPolicyEditorComponent);
+ fixture = TestBed.createComponent(TestTypedPolicyEditorComponentHostComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
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": { "$schema": "http://json-schema.org/draft-07/schema#", "description": "Type 1 policy type", "additionalProperties": false, "title": "1", "type": "object", "properties": { "A": "string" }, "required": [ "A" ]}';
+ }
});
Code Review / portal / nonrtric-controlpanel.git / commitdiff