feat(editors/substation/l-node-editor): add copy content button

openscd · May 30, 2022 · 463a871 · 463a871
1 parent e52f0ae
commit 463a871
Show file tree

Hide file tree

Showing 4 changed files with 101 additions and 3 deletions.
diff --git a/src/editors/substation/l-node-editor.ts b/src/editors/substation/l-node-editor.ts
@@ -8,7 +8,13 @@ import {
 } from 'lit-element';
 
 import '../../action-icon.js';
-import { identity, newActionEvent, newWizardEvent } from '../../foundation.js';
+import {
+  cloneElement,
+  identity,
+  newActionEvent,
+  newLnInstGenerator,
+  newWizardEvent,
+} from '../../foundation.js';
 import {
   automationLogicalNode,
   controlLogicalNode,
@@ -75,6 +81,27 @@ export class LNodeEditor extends LitElement {
   private get missingIedReference(): boolean {
     return this.element.getAttribute('iedName') === 'None' ?? false;
   }
+  @state()
+  private get isIedRef(): boolean {
+    return this.element.getAttribute('iedName') !== 'None';
+  }
+
+  private cloneLNodeElement(): void {
+    const lnClass = this.element.getAttribute('lnClass');
+    if (!lnClass) return;
+
+    const uniqueLnInst = newLnInstGenerator(this.element.parentElement!)(
+      lnClass
+    );
+    if (!uniqueLnInst) return;
+
+    const newElement = cloneElement(this.element, { lnInst: uniqueLnInst });
+    this.dispatchEvent(
+      newActionEvent({
+        new: { parent: this.element.parentElement!, element: newElement },
+      })
+    );
+  }
 
   private openEditWizard(): void {
     const wizard = wizards['LNode'].edit(this.element);
@@ -111,6 +138,14 @@ export class LNodeEditor extends LitElement {
         icon="delete"
         @click="${() => this.remove()}}"
       ></mwc-fab
-    ></action-icon>`;
+      >${this.isIedRef
+        ? html``
+        : html`<mwc-fab
+            slot="action"
+            mini
+            icon="content_copy"
+            @click=${() => this.cloneLNodeElement()}
+          ></mwc-fab>`}
+    </action-icon>`;
   }
 }
diff --git a/test/integration/editors/substation/l-node-editor-wizarding-editing.test.ts b/test/integration/editors/substation/l-node-editor-wizarding-editing.test.ts
@@ -113,4 +113,56 @@ describe('l-node-editor wizarding editing integration', () => {
       ).to.have.attribute('lnInst', '31');
     });
   });
+
+  describe('has a copy content icon button that', () => {
+    let contentCopyButton: HTMLElement;
+
+    beforeEach(async () => {
+      element!.element = doc.querySelector(
+        'SubFunction[name="mySubFunc2"] > LNode[lnClass="XSWI"]'
+      )!;
+      await parent.updateComplete;
+
+      contentCopyButton = <HTMLElement>(
+        element?.shadowRoot?.querySelector('mwc-fab[icon="content_copy"]')
+      );
+      await parent.updateComplete;
+    });
+
+    it('adds new LNode element', async () => {
+      contentCopyButton.click();
+      await parent.updateComplete;
+
+      expect(
+        doc.querySelectorAll(
+          'SubFunction[name="mySubFunc2"] > LNode[lnClass="XSWI"]'
+        )
+      ).to.have.lengthOf(3);
+    });
+
+    it('makes sure the lnInst is always unique', async () => {
+      contentCopyButton.click();
+      contentCopyButton.click();
+      contentCopyButton.click();
+      await parent.updateComplete;
+
+      expect(
+        doc.querySelectorAll(
+          'SubFunction[name="mySubFunc2"] > LNode[lnClass="XSWI"]'
+        )
+      ).to.have.lengthOf(5);
+
+      const lnInsts = Array.from(
+        doc.querySelectorAll(
+          'SubFunction[name="mySubFunc2"] > LNode[lnClass="XSWI"]'
+        )
+      ).map(lNode => lNode.getAttribute('lnInst')!);
+
+      const duplicates = lnInsts.filter(
+        (item, index) => lnInsts.indexOf(item) !== index
+      );
+
+      expect(duplicates).to.lengthOf(0);
+    });
+  });
 });
diff --git a/test/testfiles/zeroline/functions.scd b/test/testfiles/zeroline/functions.scd
@@ -37,7 +37,12 @@
 						<LNode iedName="None" prefix="DC" lnClass="CSWI" lnInst="1"/>
 						<LNode iedName="None" prefix="DC" lnClass="CILO" lnInst="1"/>
 					</SubFunction>
-					<SubFunction name="mySubFunc2"/>
+					<SubFunction name="mySubFunc2">
+						<LNode iedName="None" prefix="DC" lnClass="XSWI" lnInst="1"/>
+						<LNode iedName="None" prefix="DC" lnClass="CSWI" lnInst="1"/>
+						<LNode iedName="None" prefix="DC" lnClass="CILO" lnInst="1"/>
+						<LNode iedName="None" prefix="DC" lnClass="XSWI" lnInst="3"/>
+					</SubFunction>
 				</Function>
 				<Function name="bay2Func">
 					<LNode iedName="None" prefix="DC" lnClass="XSWI" lnInst="1"/>

diff --git a/test/unit/editors/substation/__snapshots__/l-node-editor.test.snap.js b/test/unit/editors/substation/__snapshots__/l-node-editor.test.snap.js
@@ -45,6 +45,12 @@ snapshots["web component rendering LNode element as instance of a LNodeType only
     slot="action"
   >
   </mwc-fab>
+  <mwc-fab
+    icon="content_copy"
+    mini=""
+    slot="action"
+  >
+  </mwc-fab>
 </action-icon>
 `;
 /* end snapshot web component rendering LNode element as instance of a LNodeType only looks like the latest snapshot */