Merge pull request #133 from com-pas/load_nsdoc_backend

Automatically Load NSDoc Files from SCL Validator Service

Author: dlabordus

src/Logging.ts

@@ -245,8 +245,8 @@ export function Logging<TBase extends LitElementConstructor>(Base: TBase) {
 
       this.undo = this.undo.bind(this);
       this.redo = this.redo.bind(this);
-
       this.onLog = this.onLog.bind(this);
+
       this.addEventListener('log', this.onLog);
       this.addEventListener('issue', this.onIssue);
       this.addEventListener('open-doc', this.onLoadHistoryFromDoc);

src/Setting.ts

@@ -54,6 +54,23 @@ type NsdVersions = {
   'IEC 61850-8-1': NsdVersion;
 }
 
+/** Represents a document to be opened. */
+export interface LoadNsdocDetail {
+  nsdoc: string;
+  filename: string;
+}
+export type LoadNsdocEvent = CustomEvent<LoadNsdocDetail>;
+export function newLoadNsdocEvent(
+  nsdoc: string,
+  filename: string
+): LoadNsdocEvent {
+  return new CustomEvent<LoadNsdocDetail>('load-nsdoc', {
+    bubbles: true,
+    composed: true,
+    detail: { nsdoc, filename },
+  });
+}
+
 /** Mixin that saves [[`Settings`]] to `localStorage`, reflecting them in the
  * `settings` property, setting them through `setSetting(setting, value)`. */
 export type SettingElement = Mixin<typeof Setting>;
@@ -165,64 +182,44 @@ export function Setting<TBase extends LitElementConstructor>(Base: TBase) {
       if (changedProperties.has('settings')) use(this.settings.language);
     }
 
-    private renderFileSelect(): TemplateResult {
-      return html `
-        <input id="nsdoc-file" accept=".nsdoc" type="file" hidden required multiple
-          @change=${(evt: Event) => this.loadNsdocFile(evt)}}>
-        <mwc-button label="${translate('settings.selectFileButton')}"
-                    id="selectFileButton"
-                    @click=${() => {
-                      const input = <HTMLInputElement | null>this.shadowRoot!.querySelector("#nsdoc-file");
-                      input?.click();
-                    }}>
-        </mwc-button>
-      `;
-    }
+    private async onLoadNsdoc(event: LoadNsdocEvent) {
+      const nsdocElement = this.parseToXmlObject(event.detail.nsdoc).querySelector('NSDoc');
 
-    private async loadNsdocFile(evt: Event): Promise<void> {
-      const nsdVersions = await this.nsdVersions();
-      const files = Array.from(
-        (<HTMLInputElement | null>evt.target)?.files ?? []
-      );
-      
-      if (files.length == 0) return;
-      files.forEach(async file => {
-        const text = await file.text();
-        const nsdocElement = this.parseToXmlObject(text).querySelector('NSDoc');
-        const id = nsdocElement?.getAttribute('id');
-        if (!id) {
-          document
+      const id = nsdocElement?.getAttribute('id');
+      if (!id) {
+        document
           .querySelector('open-scd')!
           .dispatchEvent(
-              newLogEvent({ kind: 'error', title: get('settings.invalidFileNoIdFound') })
-            );
-          return;
-        }
-        const nsdVersion = nsdVersions[id as keyof NsdVersions];
-        const nsdocVersion = {
-          version: nsdocElement!.getAttribute('version') ?? '',
-          revision: nsdocElement!.getAttribute('revision') ?? '',
-          release: nsdocElement!.getAttribute('release') ?? ''
-        }
+            newLogEvent({ kind: 'error', title: get('settings.invalidFileNoIdFound', {
+              filename: event.detail.filename
+            }) })
+          );
+        return;
+      }
 
-        if (!this.isEqual(nsdVersion, nsdocVersion)) {
-          document
+      const nsdVersions = await this.nsdVersions();
+      const nsdVersion = nsdVersions[id as keyof NsdVersions];
+      const nsdocVersion = {
+        version: nsdocElement!.getAttribute('version') ?? '',
+        revision: nsdocElement!.getAttribute('revision') ?? '',
+        release: nsdocElement!.getAttribute('release') ?? ''
+      }
+
+      if (!this.isEqual(nsdVersion, nsdocVersion)) {
+        document
           .querySelector('open-scd')!
           .dispatchEvent(
-              newLogEvent({ kind: 'error', title: get('settings.invalidNsdocVersion', {
+            newLogEvent({ kind: 'error', title: get('settings.invalidNsdocVersion', {
                 id: id,
+                filename: event.detail.filename,
                 nsdVersion: `${nsdVersion.version}${nsdVersion.revision}${nsdVersion.release}`,
                 nsdocVersion: `${nsdocVersion.version}${nsdocVersion.revision}${nsdocVersion.release}`
               }) })
-            );
-          return;
-        }
-  
-        this.setSetting(id as keyof Settings, text);
-      })
+          );
+        return;
+      }
 
-      this.nsdocFileUI.value = '';
-      this.requestUpdate();
+      this.setSetting(id as keyof Settings, event.detail.nsdoc);
     }
 
     /**
@@ -245,7 +242,7 @@ export function Setting<TBase extends LitElementConstructor>(Base: TBase) {
       let nsdVersion: string | undefined | null;
       let nsdRevision: string | undefined | null;
       let nsdRelease: string | undefined | null;
-      
+
       if (nsdSetting) {
         const nsdoc = this.parseToXmlObject(nsdSetting)!.querySelector('NSDoc');
         nsdVersion = nsdoc?.getAttribute('version');
@@ -273,6 +270,8 @@ export function Setting<TBase extends LitElementConstructor>(Base: TBase) {
 
       registerTranslateConfig({ loader, empty: key => key });
       use(this.settings.language);
+
+      (<any>this).addEventListener('load-nsdoc', this.onLoadNsdoc);
     }
 
     render(): TemplateResult {
@@ -321,7 +320,6 @@ export function Setting<TBase extends LitElementConstructor>(Base: TBase) {
           <wizard-divider></wizard-divider>
           <section>
             <h3>${translate('settings.loadNsdTranslations')}</h3>
-            ${this.renderFileSelect()}
           </section>
           <mwc-list id="nsdocList">
             ${this.renderNsdocItem('IEC 61850-7-2')}

src/compas-services/CompasValidatorService.ts

@@ -10,8 +10,8 @@ export function CompasSclValidatorService() {
 
   return {
     validateSCL(type: string, doc: Document): Promise<Document> {
-      const saaUrl = getCompasSettings().sclValidatorServiceUrl + '/validate/v1/' + type;
-      return fetch(saaUrl, {
+      const svsUrl = getCompasSettings().sclValidatorServiceUrl + '/validate/v1/' + type;
+      return fetch(svsUrl, {
         method: 'POST',
         headers: {
           'Content-Type': 'application/xml'
@@ -24,5 +24,18 @@ export function CompasSclValidatorService() {
         .then(handleResponse)
         .then(parseXml);
     },
+
+    listNsdocFiles(): Promise<Document> {
+      const svsUrl = getCompasSettings().sclValidatorServiceUrl + '/nsdoc/v1';
+      return fetch(svsUrl).catch(handleError)
+        .then(handleResponse)
+        .then(parseXml);
+    },
+
+    getNsdocFile(id: string): Promise<string> {
+      const svsUrl = getCompasSettings().sclValidatorServiceUrl + '/nsdoc/v1/' + id;
+      return fetch(svsUrl).catch(handleError)
+        .then(handleResponse);
+    },
   }
 }

src/compas/CompasNsdoc.ts

@@ -0,0 +1,55 @@
+import {newLoadNsdocEvent} from "../Setting.js";
+import {dispatchEventOnOpenScd} from "./foundation.js";
+
+import {createLogEvent} from "../compas-services/foundation.js";
+import {CompasSclValidatorService} from "../compas-services/CompasValidatorService.js";
+
+/**
+ * Load a single entry. Use the nsdocId to look in the Local Storage, if already loaded,
+ * and if the checksum is the same.
+ * If one of them isn't the case use the ID to retrieve the content of the NSDoc File and
+ * fire the #newLoadNsdocEvent to add the content to the Local Storage.
+ *
+ * @param id       - A unique id use to retrieve the content of NSDoc File from the SCL Validator Service.
+ * @param nsdocId  - The NSDoc ID to be used in the Local Storage.
+ * @param filename - The name of the file, just for logging.
+ * @param checksum - The checksum of the NSDoc File in the SCL Validator Service.
+ */
+async function processNsdocFile(id: string, nsdocId: string, filename: string, checksum: string): Promise<void> {
+  const checksumKey = nsdocId + '.checksum';
+  const checksumStored = localStorage.getItem(checksumKey);
+  if (localStorage.getItem(nsdocId) === null || checksumStored === null || checksumStored !== checksum) {
+    console.info(`Loading NSDoc File '${nsdocId}' with ID '${id}'.`);
+    await CompasSclValidatorService().getNsdocFile(id)
+      .then(nsdocContent => {
+        dispatchEventOnOpenScd(newLoadNsdocEvent(nsdocContent, filename));
+        localStorage.setItem(checksumKey, checksum);
+      })
+      .catch(reason => {
+        createLogEvent(reason);
+      });
+  } else {
+    console.debug(`Loading NSDoc File '${nsdocId}' skipped, already loaded.`);
+  }
+}
+
+/**
+ * Call backend to get the list of available NSDoc Files on the SCL Validator Service.
+ * Load each item found using the function #processNsdocFile.
+ */
+export async function loadNsdocFiles(): Promise<void> {
+  await CompasSclValidatorService().listNsdocFiles()
+    .then(response => {
+      Array.from(response.querySelectorAll("NsdocFile") ?? [])
+        .forEach(element => {
+          const id = element.querySelector('Id')!.textContent ?? '';
+          const nsdocId = element.querySelector('NsdocId')!.textContent ?? '';
+          const filename = element.querySelector('Filename')!.textContent ?? '';
+          const checksum = element.querySelector('Checksum')!.textContent ?? '';
+          processNsdocFile(id, nsdocId, filename, checksum);
+        });
+    })
+    .catch(reason => {
+      createLogEvent(reason);
+    });
+}

src/menu/CompasSettings.ts

@@ -5,6 +5,7 @@ import {newWizardEvent, Wizard, WizardInput} from '../foundation.js';
 
 import {CompasSettingsElement} from "../compas/CompasSettings.js";
 import {retrieveUserInfo} from "../compas/CompasSession.js";
+import {loadNsdocFiles} from "../compas/CompasNsdoc.js";
 
 import "../compas/CompasSettings.js";
 
@@ -42,4 +43,6 @@ export function compasSettingWizard(): Wizard {
 
 // When the plugin is loaded we will also start retrieving the User Information and prepare the Timeout Panels.
 retrieveUserInfo();
+// And we will start loading the Nsdoc Files from the Compas Backend Service.
+loadNsdocFiles();
 

src/translations/de.ts

@@ -70,10 +70,9 @@ export const de: Translations = {
     showieds: 'Zeige IEDs im Substation-Editor',
     selectFileButton: 'Datei auswählen',
     loadNsdTranslations: 'NSDoc-Dateien hochladen',
-    invalidFileNoIdFound:
-      "Ungültiges NSDoc; kein 'id'-Attribut in der Datei gefunden",
+    invalidFileNoIdFound: "Ungültiges NSDoc ({{ filename }}); kein 'id'-Attribut in der Datei gefunden",
     invalidNsdocVersion:
-      'Die Version {{ id }} NSD ({{ nsdVersion }}) passt nicht zu der geladenen NSDoc ({{ nsdocVersion }})',
+      'Die Version {{ id }} NSD ({{ nsdVersion }}) passt nicht zu der geladenen NSDoc ({{ filename }}, {{ nsdocVersion }})',
   },
   menu: {
     new: 'Neues projekt',

src/translations/en.ts

@@ -67,10 +67,10 @@ export const en = {
     mode: 'Pro mode',
     showieds: 'Show IEDs in substation editor',
     selectFileButton: 'Select file',
-    loadNsdTranslations: 'Uploading NSDoc files',
-    invalidFileNoIdFound: "Invalid NSDoc; no 'id' attribute found in file",
+    loadNsdTranslations: 'Uploaded NSDoc files',
+    invalidFileNoIdFound: "Invalid NSDoc ({{ filename }}); no 'id' attribute found in file",
     invalidNsdocVersion:
-      'The version of {{ id }} NSD ({{ nsdVersion }}) does not correlate with the version of the corresponding NSDoc ({{ nsdocVersion }})',
+      'The version of {{ id }} NSD ({{ nsdVersion }}) does not correlate with the version of the corresponding NSDoc ({{ filename }}, {{ nsdocVersion }})',
   },
   menu: {
     new: 'New project',

test/integration/Setting.test.ts

@@ -0,0 +1,84 @@
+import { html, fixture, expect } from '@open-wc/testing';
+
+import '../../src/open-scd.js';
+
+import { OpenSCD } from '../../src/open-scd.js';
+import { newLoadNsdocEvent } from "../../src/Setting.js";
+
+describe('Setting', () => {
+  let element: OpenSCD;
+
+  beforeEach(async () => {
+    localStorage.clear();
+
+    element = await fixture(html`
+      <open-scd></open-scd>
+
+      <link href="public/google/fonts/roboto-v27.css" rel="stylesheet" />
+      <link href="public/google/fonts/roboto-mono-v13.css" rel="stylesheet" />
+      <link href="public/google/icons/material-icons-outlined.css" rel="stylesheet" />
+    `);
+  });
+
+  it('opens the log on log menu entry click', async () => {
+    await (<HTMLElement>(
+      element.shadowRoot!.querySelector('mwc-list-item[iconid="history"]')!
+    )).click();
+    expect(element.logUI).to.have.property('open', true);
+  });
+
+  it('upload .nsdoc file using event and looks like latest snapshot', async () => {
+    element.settingsUI.show();
+    await element.settingsUI.updateComplete;
+
+    const nsdocFile = await fetch('/test/testfiles/nsdoc/IEC_61850-7-2.nsdoc')
+      .then(response => response.text())
+
+    element.dispatchEvent(
+      newLoadNsdocEvent(nsdocFile, 'IEC_61850-7-2.nsdoc')
+    );
+
+    await element.requestUpdate();
+    await element.updateComplete;
+
+    expect(localStorage.getItem('IEC 61850-7-2')).to.eql(nsdocFile);
+    expect(element).shadowDom.to.equalSnapshot();
+  });
+
+  it('upload invalid .nsdoc file using event and log event fired', async () => {
+    element.settingsUI.show();
+    await element.settingsUI.updateComplete;
+
+    const nsdocFile = await fetch('/test/testfiles/nsdoc/invalid.nsdoc')
+      .then(response => response.text())
+
+    element.dispatchEvent(
+      newLoadNsdocEvent(nsdocFile, 'invalid.nsdoc')
+    );
+
+    await element.requestUpdate();
+    await element.updateComplete;
+
+    expect(element.history.length).to.be.equal(1);
+    expect(element.history[0].title).to.be.equal('Invalid NSDoc (invalid.nsdoc); no \'id\' attribute found in file');
+  });
+
+  it('upload .nsdoc file with wrong version using event and log event fired', async () => {
+    element.settingsUI.show();
+    await element.settingsUI.updateComplete;
+
+    const nsdocFile = await fetch('/test/testfiles/nsdoc/wrong-version.nsdoc')
+      .then(response => response.text())
+
+    element.dispatchEvent(
+      newLoadNsdocEvent(nsdocFile, 'wrong-version.nsdoc')
+    );
+
+    await element.requestUpdate();
+    await element.updateComplete;
+
+    expect(element.history.length).to.be.equal(1);
+    expect(element.history[0].title).to.be.equal('The version of IEC 61850-7-3 NSD (2007B3) does not correlate ' +
+      'with the version of the corresponding NSDoc (wrong-version.nsdoc, 2007B4)');
+  });
+}).timeout(4000);