Skip to content

Commit

Permalink
feat(editors/substation): remove button to function type editors (ope…
Browse files Browse the repository at this point in the history 
…nscd#761)

* feat(editors/substation/function-editor): add remove button

* feat(editors/substation/sub-function-editor): add remove button

* feat(editors/substation/eq-function-editor): add remove button

* feat(editors/substation/eq-sub-function-editor): add remove button
  • Loading branch information
@JakobVogelsang
JakobVogelsang authored May 23, 2022
1 parent 4cbbf1b commit ce9dea1
Show file tree
Hide file tree
Showing 12 changed files with 345 additions and 82 deletions.
18 changes: 18 additions & 0 deletions src/editors/substation/eq-function-editor.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,7 @@ import '../../action-pane.js';
import './eq-sub-function-editor.js';
import {
getChildElementsByTagName,
newActionEvent,
newWizardEvent,
SCLTag,
tags,
Expand Down Expand Up @@ -53,6 +54,18 @@ export class EqFunctionEditor extends LitElement {
@query('mwc-menu') addMenu!: Menu;
@query('mwc-icon-button[icon="playlist_add"]') addButton!: IconButton;

remove(): void {
if (this.element.parentElement)
this.dispatchEvent(
newActionEvent({
old: {
parent: this.element.parentElement,
element: this.element,
},
})
);
}

private openCreateWizard(tagName: string): void {
const wizard = wizards[<SCLTag>tagName].create(this.element!);

Expand Down Expand Up @@ -103,6 +116,11 @@ export class EqFunctionEditor extends LitElement {
icon="functions"
secondary
highlighted
><abbr slot="action" title="${translate('remove')}">
<mwc-icon-button
icon="delete"
@click=${() => this.remove()}
></mwc-icon-button> </abbr
><abbr
slot="action"
style="position:relative;"
Expand Down
18 changes: 18 additions & 0 deletions src/editors/substation/eq-sub-function-editor.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,7 @@ import { Menu } from '@material/mwc-menu';
import '../../action-pane.js';
import {
getChildElementsByTagName,
newActionEvent,
newWizardEvent,
SCLTag,
tags,
Expand Down Expand Up @@ -52,6 +53,18 @@ export class EqSubFunctionEditor extends LitElement {
@query('mwc-menu') addMenu!: Menu;
@query('mwc-icon-button[icon="playlist_add"]') addButton!: IconButton;

remove(): void {
if (this.element.parentElement)
this.dispatchEvent(
newActionEvent({
old: {
parent: this.element.parentElement,
element: this.element,
},
})
);
}

private openCreateWizard(tagName: string): void {
const wizard = wizards[<SCLTag>tagName].create(this.element!);

Expand Down Expand Up @@ -98,6 +111,11 @@ export class EqSubFunctionEditor extends LitElement {

render(): TemplateResult {
return html`<action-pane label="${this.header}" icon="functions" secondary
><abbr slot="action" title="${translate('remove')}">
<mwc-icon-button
icon="delete"
@click=${() => this.remove()}
></mwc-icon-button> </abbr
><abbr
slot="action"
style="position:relative;"
Expand Down
18 changes: 18 additions & 0 deletions src/editors/substation/function-editor.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,7 @@ import '../../action-pane.js';
import './sub-function-editor.js';
import {
getChildElementsByTagName,
newActionEvent,
newWizardEvent,
SCLTag,
tags,
Expand Down Expand Up @@ -49,6 +50,18 @@ export class FunctionEditor extends LitElement {
@query('mwc-menu') addMenu!: Menu;
@query('mwc-icon-button[icon="playlist_add"]') addButton!: IconButton;

remove(): void {
if (this.element.parentElement)
this.dispatchEvent(
newActionEvent({
old: {
parent: this.element.parentElement,
element: this.element,
},
})
);
}

private openCreateWizard(tagName: string): void {
const wizard = wizards[<SCLTag>tagName].create(this.element!);

Expand Down Expand Up @@ -96,6 +109,11 @@ export class FunctionEditor extends LitElement {
icon="functions"
secondary
highlighted
><abbr slot="action" title="${translate('remove')}">
<mwc-icon-button
icon="delete"
@click=${() => this.remove()}
></mwc-icon-button> </abbr
><abbr
slot="action"
style="position:relative;"
Expand Down
18 changes: 18 additions & 0 deletions src/editors/substation/sub-function-editor.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,7 @@ import '../../action-pane.js';
import './sub-function-editor.js';
import {
getChildElementsByTagName,
newActionEvent,
newWizardEvent,
SCLTag,
tags,
Expand Down Expand Up @@ -53,6 +54,18 @@ export class SubFunctionEditor extends LitElement {
@query('mwc-menu') addMenu!: Menu;
@query('mwc-icon-button[icon="playlist_add"]') addButton!: IconButton;

remove(): void {
if (this.element.parentElement)
this.dispatchEvent(
newActionEvent({
old: {
parent: this.element.parentElement,
element: this.element,
},
})
);
}

private openCreateWizard(tagName: string): void {
const wizard = wizards[<SCLTag>tagName].create(this.element!);

Expand Down Expand Up @@ -96,6 +109,11 @@ export class SubFunctionEditor extends LitElement {

render(): TemplateResult {
return html`<action-pane label="${this.header}" icon="functions" secondary
><abbr slot="action" title="${translate('remove')}">
<mwc-icon-button
icon="delete"
@click=${() => this.remove()}
></mwc-icon-button> </abbr
><abbr
slot="action"
style="position:relative;"
Expand Down
71 changes: 50 additions & 21 deletions test/integration/editors/substation/eq-function-wizarding-editing.test.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,32 +8,34 @@ import { EqFunctionEditor } from '../../../../src/editors/substation/eq-function
import { WizardTextField } from '../../../../src/wizard-textfield.js';

describe('eq-function-editor wizarding editing integration', () => {
describe('open create wizard for element EqSubFunction', () => {
let doc: XMLDocument;
let parent: MockWizardEditor;
let element: EqFunctionEditor | null;
let doc: XMLDocument;
let parent: MockWizardEditor;
let element: EqFunctionEditor | null;

beforeEach(async () => {
doc = await fetch('/test/testfiles/zeroline/functions.scd')
.then(response => response.text())
.then(str => new DOMParser().parseFromString(str, 'application/xml'));
parent = <MockWizardEditor>(
await fixture(
html`<mock-wizard-editor
><eq-function-editor
.element=${doc.querySelector(
'ConductingEquipment[name="QA1"] > EqFunction'
)}
></eq-function-editor
></mock-wizard-editor>`
)
);

element = parent.querySelector('eq-function-editor');
});

describe('open create wizard for element EqSubFunction', () => {
let nameField: WizardTextField;
let primaryAction: HTMLElement;

beforeEach(async () => {
doc = await fetch('/test/testfiles/zeroline/functions.scd')
.then(response => response.text())
.then(str => new DOMParser().parseFromString(str, 'application/xml'));
parent = <MockWizardEditor>(
await fixture(
html`<mock-wizard-editor
><eq-function-editor
.element=${doc.querySelector(
'ConductingEquipment[name="QA1"] > EqFunction'
)}
></eq-function-editor
></mock-wizard-editor>`
)
);

element = parent.querySelector('eq-function-editor');

(<HTMLElement>(
element?.shadowRoot?.querySelector(
'mwc-list-item[value="EqSubFunction"]'
Expand Down Expand Up @@ -88,4 +90,31 @@ describe('eq-function-editor wizarding editing integration', () => {
).to.exist;
});
});

describe('has a delete icon button that', () => {
let deleteButton: HTMLElement;

beforeEach(async () => {
deleteButton = <HTMLElement>(
element?.shadowRoot?.querySelector('mwc-icon-button[icon="delete"]')
);
await parent.updateComplete;
});

it('removes the attached EqFunction element from the document', async () => {
expect(
doc.querySelector(
'ConductingEquipment[name="QA1"] EqSubFunction[name="myEqSubFunc"]'
)
).to.exist;

await deleteButton.click();

expect(
doc.querySelector(
'ConductingEquipment[name="QA1"] EqSubFunction[name="myEqSubFunc"]'
)
).to.not.exist;
});
});
});
71 changes: 50 additions & 21 deletions test/integration/editors/substation/eq-sub-function-editor-wizarding-editing.test.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,32 +8,34 @@ import { EqSubFunctionEditor } from '../../../../src/editors/substation/eq-sub-f
import { WizardTextField } from '../../../../src/wizard-textfield.js';

describe('eq-sub-function-editor wizarding editing integration', () => {
describe('open create wizard for element EqSubFunction', () => {
let doc: XMLDocument;
let parent: MockWizardEditor;
let element: EqSubFunctionEditor | null;
let doc: XMLDocument;
let parent: MockWizardEditor;
let element: EqSubFunctionEditor | null;

beforeEach(async () => {
doc = await fetch('/test/testfiles/zeroline/functions.scd')
.then(response => response.text())
.then(str => new DOMParser().parseFromString(str, 'application/xml'));
parent = <MockWizardEditor>(
await fixture(
html`<mock-wizard-editor
><eq-sub-function-editor
.element=${doc.querySelector(
'ConductingEquipment[name="QA1"] EqSubFunction'
)}
></eq-sub-function-editor
></mock-wizard-editor>`
)
);

element = parent.querySelector('eq-sub-function-editor');
});

describe('open create wizard for element EqSubFunction', () => {
let nameField: WizardTextField;
let primaryAction: HTMLElement;

beforeEach(async () => {
doc = await fetch('/test/testfiles/zeroline/functions.scd')
.then(response => response.text())
.then(str => new DOMParser().parseFromString(str, 'application/xml'));
parent = <MockWizardEditor>(
await fixture(
html`<mock-wizard-editor
><eq-sub-function-editor
.element=${doc.querySelector(
'ConductingEquipment[name="QA1"] EqSubFunction'
)}
></eq-sub-function-editor
></mock-wizard-editor>`
)
);

element = parent.querySelector('eq-sub-function-editor');

(<HTMLElement>(
element?.shadowRoot?.querySelector(
'mwc-list-item[value="EqSubFunction"]'
Expand Down Expand Up @@ -88,4 +90,31 @@ describe('eq-sub-function-editor wizarding editing integration', () => {
).to.exist;
});
});

describe('has a delete icon button that', () => {
let deleteButton: HTMLElement;

beforeEach(async () => {
deleteButton = <HTMLElement>(
element?.shadowRoot?.querySelector('mwc-icon-button[icon="delete"]')
);
await parent.updateComplete;
});

it('removes the attached Function element from the document', async () => {
expect(
doc.querySelector(
'ConductingEquipment[name="QA1"] EqSubFunction[name="myEqSubSubFunction"]'
)
).to.exist;

await deleteButton.click();

expect(
doc.querySelector(
'ConductingEquipment[name="QA1"] EqSubFunction[name="myEqSubSubFunction"]'
)
).to.not.exist;
});
});
});
Loading

0 comments on commit ce9dea1

Please sign in to comment.