Merge pull request #203 from com-pas/edit-element-from-diagnostic

Dennis Labordus · web-flow · commit d714f45b7e10 · 2022-10-20T15:23:54.000+02:00
Processed XPath Expression returned from CoMPAS Validation Service.
diff --git a/src/Logging.ts b/src/Logging.ts
@@ -32,9 +32,13 @@ import {
   LogEvent,
   Mixin,
   newActionEvent,
+  newWizardEvent,
+  SCLTag,
 } from './foundation.js';
 import { getFilterIcon, iconColors } from './icons/icons.js';
 import { Plugin } from './Plugging.js';
+import { wizards } from './wizards/wizard-library.js';
+import { nothing } from 'lit-html';
 
 const icons = {
   info: 'info',
@@ -235,13 +239,38 @@ export function Logging<TBase extends LitElementConstructor>(Base: TBase) {
         </mwc-list-item>`;
     }
 
+    private openEditWizard(element: Element | undefined): void {
+      if (element) {
+        const wizard = wizards[<SCLTag>element.tagName]?.edit(element);
+        if (wizard) this.dispatchEvent(newWizardEvent(wizard));
+      }
+    }
+
+    private hasEditWizard(element: Element | undefined): boolean {
+      if (element) {
+        return !!wizards[<SCLTag>element.tagName]?.edit(element);
+      }
+      return false;
+    }
+
     private renderIssueEntry(issue: IssueDetail): TemplateResult {
-      return html` <abbr title="${issue.title + '\n' + issue.message}"
-        ><mwc-list-item ?twoline=${!!issue.message}>
-          <span> ${issue.title}</span>
+      return html` <abbr title="${issue.title + '\n' + issue.message}">
+        <mwc-list-item
+          ?twoline=${!!issue.message}
+          ?hasMeta=${this.hasEditWizard(issue.element)}
+        >
+          <span>${issue.title}</span>
           <span slot="secondary">${issue.message}</span>
-        </mwc-list-item></abbr
-      >`;
+          ${this.hasEditWizard(issue.element)
+            ? html` <span slot="meta">
+                <mwc-icon-button
+                  icon="edit"
+                  @click=${() => this.openEditWizard(issue.element)}
+                ></mwc-icon-button>
+              </span>`
+            : nothing}
+        </mwc-list-item>
+      </abbr>`;
     }
 
     renderValidatorsIssues(issues: IssueDetail[]): TemplateResult[] {
@@ -329,6 +358,10 @@ export function Logging<TBase extends LitElementConstructor>(Base: TBase) {
             top: 14px;
             right: 14px;
           }
+
+          #diagnostic mwc-list-item {
+            --mdc-list-item-meta-size: 48px;
+          }
         </style>
         <mwc-dialog id="log" heading="${translate('log.name')}">
           ${this.renderFilterButtons()}
diff --git a/src/foundation.ts b/src/foundation.ts
@@ -401,6 +401,7 @@ export function newLogEvent(
 
 export interface IssueDetail extends LogDetailBase {
   validatorId: string;
+  element?: Element;
 }
 export type IssueEvent = CustomEvent<IssueDetail>;
 export function newIssueEvent(
diff --git a/src/validators/CompasValidateSchema.ts b/src/validators/CompasValidateSchema.ts
@@ -69,6 +69,7 @@ export default class CompasValidateSchema extends LitElement {
             validatorId: this.pluginId,
             title: this.createTitle(validationError),
             message: this.createMessage(validationError),
+            element: this.getElement(validationError),
           })
         );
       });
@@ -92,15 +93,92 @@ export default class CompasValidateSchema extends LitElement {
     const columnNumber = validationError
       .getElementsByTagNameNS(SVS_NAMESPACE, 'ColumnNumber')!
       .item(0)?.textContent;
+    const xpath = validationError
+      .getElementsByTagNameNS(SVS_NAMESPACE, 'XPath')!
+      .item(0)?.textContent;
 
     const messageParts: string[] = [];
     if (ruleName) messageParts.push(`Rule: ${ruleName}`);
     if (lineNumber) messageParts.push(`Line: ${lineNumber}`);
     if (columnNumber) messageParts.push(`Column: ${columnNumber}`);
+    if (xpath) messageParts.push(`XPath: ${xpath}`);
 
     if (messageParts.length == 0) {
       return undefined;
     }
     return messageParts.join(', ');
   }
+
+  private getElement(validationError: Element): Element | undefined {
+    const xpath = validationError
+      .getElementsByTagNameNS(SVS_NAMESPACE, 'XPath')!
+      .item(0)?.textContent;
+
+    if (xpath) {
+      const fixedXPath = this.rewriteXPathForDefaultNamespace(xpath);
+      const nsResolver = this.doc.createNSResolver(this.doc.documentElement);
+      const result = this.doc.evaluate(
+        fixedXPath,
+        this.doc,
+        this.createResolver(nsResolver),
+        XPathResult.FIRST_ORDERED_NODE_TYPE,
+        null
+      );
+      if (result.singleNodeValue) {
+        return <Element>result.singleNodeValue;
+      }
+    }
+    return undefined;
+  }
+
+
+  /**
+   * For XPath to work correctly the default namespace of SCL needs to have a prefix to work.
+   * The function evaluate expects HTML to be the default namespace.
+   *
+   * See https://developer.mozilla.org/en-US/docs/Web/XPath/Introduction_to_using_XPath_in_JavaScript
+   * for more information on how XPath is working with evalaute and why this fix is needed.
+   *
+   * @param xpath - The XPath to rewrite to use a prefix 'scl' for the SCL Namespace.
+   */
+  private rewriteXPathForDefaultNamespace(xpath: string): string {
+      return (
+        '/' +
+        xpath
+          .split('/')
+          .filter(part => !!part)
+          .map(part => {
+            if (part && part.indexOf(':') < 0) {
+              return 'scl:' + part;
+            }
+            return part;
+          })
+          .join('/')
+      );
+  }
+
+  /**
+   * Create a XPath Namespace Resolver to handle the default and other custom namespaces.
+   *
+   * @param nsResolver - The automatically created namespace resolver.
+   */
+  private createResolver(nsResolver: any): XPathNSResolver {
+    return {
+      lookupNamespaceURI(prefix: string | null): string | null {
+        // Handle the fix default namespace.
+        if (prefix === 'scl') {
+          return 'http://www.iec.ch/61850/2003/SCL';
+        }
+        // Use the automatically created resolver for other prefixes.
+        // The resolver can be used in two different ways.
+        if (typeof nsResolver === 'function') {
+          return nsResolver(prefix);
+        }
+        if (typeof nsResolver.lookupNamespaceURI === 'function') {
+          return nsResolver.lookupNamespaceURI(prefix);
+        }
+        return null;
+      },
+    };
+  }
 }
diff --git a/test/testfiles/validators/CompasValidation.scd b/test/testfiles/validators/CompasValidation.scd
@@ -0,0 +1,21 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<SCL version="2007" revision="B" release="4"
+     xmlns="http://www.iec.ch/61850/2003/SCL"
+     xmlns:compas="https://www.lfenergy.org/compas/extension/v1">
+  <Private type="compas_scl">
+    <compas:SclName>existing</compas:SclName>
+  </Private>
+	<Header id="TrainingIEC61850" version="1" revision="143" toolID="IEC 61850 System Configurator, Version: V5.90 " nameStructure="IEDName">
+		<Text>TrainingIEC61850</Text>
+		<History>
+			<Hitem version="1" revision="143" when="Wednesday, September 25, 2019 9:11:36 AM" who="Licenced User: OMICRON electronics GmbH JakVog00 Machine: JAKVOG00LW01 User: JakVog00" what="Station is upgraded from IEC 61850 System Configurator, Version: V5.80 HF1 to V5.90 ." why="IEC 61850 System Configurator Automatic Startup: Insert Comment" />
+		</History>
+	</Header>
+	<Substation name="AA1" desc="Substation">
+		<VoltageLevel name="J1" desc="Voltage Level">
+			<Voltage unit="V" multiplier="k">20</Voltage>
+			<Bay name="Bay1" desc="Bay1">
+			</Bay>
+		</VoltageLevel>
+	</Substation>
+</SCL>
diff --git a/test/unit/Logging.test.ts b/test/unit/Logging.test.ts
@@ -278,5 +278,43 @@ describe('LoggingElement', () => {
         expect(issue.title).to.equal('test run 3');
       });
     });
+
+    describe('with a CoMPAS issue coming in - CoMPAS validator', () => {
+      let substation: Element;
+      beforeEach(async () => {
+        const doc = await fetch('/test/testfiles/valid2007B4.scd')
+          .then(response => response.text())
+          .then(str => new DOMParser().parseFromString(str, 'application/xml'));
+        substation = doc.querySelector('Substation')!;
+
+        element.dispatchEvent(
+          newIssueEvent({
+            validatorId: '/src/validators/CompasValidateSchema.js',
+            title: 'CoMPAS Run',
+            element: substation
+          })
+        );
+      });
+
+      it('in parallel saves the issues of the CoMPAS validator', () => {
+        expect(element.diagnoses.get('/src/validators/CompasValidateSchema.js')).to
+          .exist;
+        expect(
+          element.diagnoses.get('/src/validators/CompasValidateSchema.js')!.length
+        ).to.equal(1);
+        const issue = element.diagnoses.get(
+          '/src/validators/CompasValidateSchema.js'
+        )![0];
+        expect(issue.title).to.equal('CoMPAS Run');
+        expect(issue.element).to.equal(substation);
+      });
+
+      it('diagnostic dialog looks like the latest snapshot', async () => {
+        await element.issueUI.querySelector('mwc-button')!.click();
+        await element.updateComplete;
+
+        await expect(element.diagnosticUI).to.equalSnapshot();
+      });
+    });
   });
 });
diff --git a/test/unit/__snapshots__/Logging.test.snap.js b/test/unit/__snapshots__/Logging.test.snap.js
@@ -0,0 +1,83 @@
+/* @web/test-runner snapshot v1 */
+export const snapshots = {};
+
+snapshots["LoggingElement with an issue incoming with a CoMPAS issue coming in - CoMPAS validator diagnostic dialog looks like the latest snapshot"] = 
+`<mwc-dialog
+  heading="[diag.name]"
+  id="diagnostic"
+  open=""
+>
+  <filtered-list
+    id="content"
+    wrapfocus=""
+  >
+    <mwc-list-item
+      aria-disabled="false"
+      noninteractive=""
+      tabindex="-1"
+    >
+      /src/validators/ValidateSchema.js
+    </mwc-list-item>
+    <li
+      divider=""
+      padded=""
+      role="separator"
+    >
+    </li>
+    <abbr title="test run 1
+undefined">
+      <mwc-list-item
+        aria-disabled="false"
+        mwc-list-item=""
+        tabindex="-1"
+      >
+        <span>
+          test run 1
+        </span>
+        <span slot="secondary">
+        </span>
+      </mwc-list-item>
+    </abbr>
+    <mwc-list-item
+      aria-disabled="false"
+      noninteractive=""
+      tabindex="-1"
+    >
+      /src/validators/CompasValidateSchema.js
+    </mwc-list-item>
+    <li
+      divider=""
+      padded=""
+      role="separator"
+    >
+    </li>
+    <abbr title="CoMPAS Run
+undefined">
+      <mwc-list-item
+        aria-disabled="false"
+        hasmeta=""
+        mwc-list-item=""
+        tabindex="-1"
+      >
+        <span>
+          CoMPAS Run
+        </span>
+        <span slot="secondary">
+        </span>
+        <span slot="meta">
+          <mwc-icon-button icon="edit">
+          </mwc-icon-button>
+        </span>
+      </mwc-list-item>
+    </abbr>
+  </filtered-list>
+  <mwc-button
+    dialogaction="close"
+    slot="primaryAction"
+  >
+    [close]
+  </mwc-button>
+</mwc-dialog>
+`;
+/* end snapshot LoggingElement with an issue incoming with a CoMPAS issue coming in - CoMPAS validator diagnostic dialog looks like the latest snapshot */
+
diff --git a/test/unit/validators/CompasValidateSchema.test.ts b/test/unit/validators/CompasValidateSchema.test.ts

Original file line number	Diff line number	Diff line change
`@@ -401,6 +401,7 @@ export function newLogEvent(`
`401`	`401`
`402`	`402`	`export interface IssueDetail extends LogDetailBase {`
`403`	`403`	`validatorId: string;`
	`404`	`+ element?: Element;`
`404`	`405`	`}`
`405`	`406`	`export type IssueEvent = CustomEvent<IssueDetail>;`
`406`	`407`	`export function newIssueEvent(`