Merge pull request #69 from com-pas/handle-saveto

Improve Check if Create or Update needs to be done

Author: Rob Tjalma

__snapshots__/compas-save-to.md

@@ -1,5 +1,22 @@
 # `compas-save-to`
 
+## `still determining if document exists in CoMPAS`
+
+####   `looks like the latest snapshot`
+
+```html
+<mwc-list>
+  <mwc-list-item
+    aria-disabled="false"
+    mwc-list-item=""
+    tabindex="0"
+  >
+    [compas.loading]
+  </mwc-list-item>
+</mwc-list>
+
+```
+
 ## `new document in compas`
 
 ####   `looks like the latest snapshot`

src/compas-editors/CompasVersions.ts

@@ -17,21 +17,20 @@ export default class CompasVersionsPlugin extends LitElement {
   @property()
   scls!: Element[];
 
-  firstUpdated() {
+  firstUpdated(): void {
     if (!this.docId) {
       this.scls = [];
     } else {
       this.fetchData()
     }
   }
 
-  fetchData() {
+  fetchData(): void {
     const type = getTypeFromDocName(this.docName);
     CompasSclDataService().listVersions(type, this.docId)
       .then(xmlResponse => {
         this.scls = Array.from(xmlResponse.querySelectorAll('Item') ?? [])
-      })
-      .catch(createLogEvent);
+      });
   }
 
   confirmRestoreCompas(version: string): void {

src/compas-services/foundation.ts

@@ -3,14 +3,22 @@ import {get} from "lit-translate";
 import {OpenSCD} from "../open-scd.js";
 import {newLogEvent} from "../foundation.js";
 
+export const NOT_FOUND_ERROR = 'NotFoundError';
+export const APPLICATION_ERROR = 'ApplicationError';
+export const SERVER_ERROR = 'ServerError';
+
+export function getOpenScdElement(): OpenSCD {
+  return <OpenSCD>document.querySelector('open-scd');
+}
+
 export function handleResponse(response: Response): Promise<string> {
   if (!response.ok) {
-    let type = 'ApplicationError';
+    let type = APPLICATION_ERROR;
     if (response.status === 404) {
-      type = 'NotFoundError';
+      type = NOT_FOUND_ERROR;
     } else if (response.status >= 500)
     {
-      type = 'ServerError';
+      type = SERVER_ERROR;
     }
     return Promise.reject({type: type, status: response.status, message: response.statusText});
   }
@@ -22,7 +30,7 @@ export function parseXml(textContent: string): Promise<Document> {
 }
 
 export function handleError(error: Error): Promise<never> {
-  return Promise.reject({type: 'ServerError', message: error.message});
+  return Promise.reject({type: SERVER_ERROR, message: error.message});
 }
 
 export function createLogEvent(reason: any): void {
@@ -31,8 +39,7 @@ export function createLogEvent(reason: any): void {
     message += " (" + reason.status + ")";
   }
 
-  const openScd = <OpenSCD>document.querySelector('open-scd');
-  openScd.dispatchEvent(
+  getOpenScdElement().dispatchEvent(
     newLogEvent({
       kind: 'error',
       title: get('compas.error.server'),

src/compas/CompasSaveTo.ts

@@ -8,7 +8,7 @@ import {newLogEvent, newPendingStateEvent, newWizardEvent, Wizard, WizardInput}
 import {CompasChangeSetRadiogroup} from "./CompasChangeSet.js";
 import {CompasScltypeRadiogroup} from "./CompasScltypeRadiogroup.js";
 import {CompasSclDataService} from "../compas-services/CompasSclDataService.js";
-import {createLogEvent} from "../compas-services/foundation.js";
+import {createLogEvent, NOT_FOUND_ERROR} from "../compas-services/foundation.js";
 import {getOpenScdElement, getTypeFromDocName, stripExtensionFromName, updateDocumentInOpenSCD} from "./foundation.js";
 import './CompasChangeSet.js';
 import './CompasScltypeRadiogroup.js';
@@ -20,6 +20,30 @@ export class CompasSaveTo extends LitElement {
   @property({type: String})
   docId!: string;
 
+  @property({type: Boolean})
+  existInCompas?: boolean;
+
+  firstUpdated(): void {
+    this.checkExistInCompas();
+  }
+
+  checkExistInCompas(): void {
+    if (this.docId) {
+      const docType = getTypeFromDocName(this.docName);
+      // Use the versions call to check if any exist, because then the document also exists
+      // And it safes bandwidth not to retrieve the whole document.
+      CompasSclDataService().listVersions(docType, this.docId)
+        .then(() => this.existInCompas = true)
+        .catch(reason => {
+          if (reason.type && reason.type === NOT_FOUND_ERROR) {
+            this.existInCompas = false;
+          }
+        });
+    } else {
+      this.existInCompas = false;
+    }
+  }
+
   getNameField() : TextFieldBase {
     return <TextFieldBase>this.shadowRoot!.querySelector('mwc-textfield[id="name"]');
   }
@@ -39,7 +63,7 @@ export class CompasSaveTo extends LitElement {
   }
 
   valid(): boolean {
-    if (!this.docId) {
+    if (!this.existInCompas) {
       return this.getNameField().checkValidity()
         && this.getSclTypeRadioGroup().valid();
     }
@@ -108,7 +132,7 @@ export class CompasSaveTo extends LitElement {
   }
 
   async saveToCompas(wizard: Element, docId: string, docName: string, doc: XMLDocument): Promise<void> {
-    if (!docId) {
+    if (!this.existInCompas) {
       await this.addSclToCompas(wizard, doc);
     } else {
       await this.updateSclInCompas(wizard, docId, docName, doc);
@@ -126,7 +150,14 @@ export class CompasSaveTo extends LitElement {
   }
 
   render(): TemplateResult {
-    if (!this.docId) {
+    if (this.existInCompas === undefined) {
+      return html `
+        <mwc-list>
+          <mwc-list-item>${translate("compas.loading")}</mwc-list-item>
+        </mwc-list>`
+    }
+
+    if (!this.existInCompas) {
       return html`
         <mwc-textfield dialogInitialFocus id="name" label="${translate('scl.name')}"
                        value="${this.docName}" required>
@@ -137,8 +168,7 @@ export class CompasSaveTo extends LitElement {
         ${this.renderCommentTextField()}
       `;
     }
-
-    return html `
+    return html`
       <compas-changeset-radiogroup></compas-changeset-radiogroup>
 
       ${this.renderCommentTextField()}

src/compas/CompasScl.ts

@@ -17,19 +17,18 @@ export class CompasScl extends LitElement {
   @property()
   scls!: Element[];
 
-  firstUpdated() {
+  firstUpdated(): void {
     this.fetchData();
   }
 
-  fetchData() {
+  fetchData(): void {
     CompasSclDataService().listScls(this.type)
       .then(xmlResponse => {
         this.scls = Array.from(xmlResponse.querySelectorAll('Item') ?? [])
-      })
-      .catch(createLogEvent)
+      });
   }
 
-  openScl(id?: string) {
+  openScl(id?: string): void {
     getOpenScdElement().dispatchEvent(newPendingStateEvent(this.getSclDocument(id)));
   }
 

src/compas/CompasScltypeList.ts

@@ -5,22 +5,20 @@ import {SingleSelectedEvent} from "@material/mwc-list/mwc-list-foundation";
 import {newWizardEvent, Wizard, WizardActor} from '../foundation.js';
 
 import {CompasSclDataService, SDS_NAMESPACE} from "../compas-services/CompasSclDataService.js";
-import {createLogEvent} from "../compas-services/foundation.js";
 import {listSclsWizard} from "./CompasScl.js";
 
 @customElement('compas-scltype-list')
 export class CompasScltypeList extends LitElement {
   @property()
   sclTypes!: Element[];
 
-  firstUpdated() {
+  firstUpdated(): void {
     this.fetchData();
   }
 
-  fetchData() {
+  fetchData(): void {
     CompasSclDataService().listSclTypesAndOrder()
-      .then(types => this.sclTypes = types)
-      .catch(createLogEvent);
+      .then(types => this.sclTypes = types);
   }
 
   listScls(type: string): void {

src/compas/CompasScltypeRadiogroup.ts

@@ -3,7 +3,6 @@ import {ListItemBase} from "@material/mwc-list/mwc-list-item-base";
 import {translate} from "lit-translate";
 
 import {CompasSclDataService, SDS_NAMESPACE} from "../compas-services/CompasSclDataService.js";
-import {createLogEvent} from "../compas-services/foundation.js";
 
 @customElement('compas-scltype-radiogroup')
 export class CompasScltypeRadiogroup extends LitElement {
@@ -13,14 +12,13 @@ export class CompasScltypeRadiogroup extends LitElement {
   @property({type: Document})
   sclTypes!:Element[];
 
-  firstUpdated() {
+  firstUpdated(): void {
     this.fetchData();
   }
 
-  fetchData() {
+  fetchData(): void {
     CompasSclDataService().listSclTypesAndOrder()
-      .then(types => this.sclTypes = types)
-      .catch(createLogEvent);
+      .then(types => this.sclTypes = types);
   }
 
   private getSelectedListItem() : ListItemBase | null {

test/unit/compas/CompasSaveTo.test.ts

@@ -1,17 +1,45 @@
-import {expect, fixture, html} from '@open-wc/testing';
+import {expect, fixtureSync, html, waitUntil} from '@open-wc/testing';
+import sinon from "sinon";
 
 import "../../../src/compas/CompasSaveTo.js";
 import {CompasSaveTo} from "../../../src/compas/CompasSaveTo.js";
 
 describe('compas-save-to', () => {
+  let element: CompasSaveTo;
+  const docName = 'station123.scd';
+  const docId = '6a45ae97-5605-44f8-b4e6-25305bc6c036';
+
+  describe('still determining if document exists in CoMPAS', () => {
+    beforeEach(async () => {
+      element = fixtureSync(
+        html`<compas-save-to .docName="${docName}" .docId="${docId}"></compas-save-to>`
+      );
+
+      sinon.stub(element, 'checkExistInCompas').callsFake(() => {
+        // Do nothing so that it seems like loading from compas.
+      });
+
+      await element;
+    });
+
+    it('looks like the latest snapshot', () => {
+      expect(element).shadowDom
+        .to.equalSnapshot();
+    });
+  });
+
   describe('new document in compas', () => {
-    let element: CompasSaveTo;
-    const docName = 'station123.scd';
     beforeEach(async () => {
-      element = await fixture(
-          html`
-            <compas-save-to .docName="${docName}"></compas-save-to>`
+      element = fixtureSync(
+          html`<compas-save-to .docName="${docName}"></compas-save-to>`
       );
+
+      sinon.stub(element, 'checkExistInCompas').callsFake(() => {
+        element.existInCompas = false;
+      });
+
+      await element;
+      await waitUntil(() => element.existInCompas !== undefined);
     });
 
     it('looks like the latest snapshot', () => {
@@ -21,21 +49,27 @@ describe('compas-save-to', () => {
   });
 
   describe('existing document in compas', () => {
-    let element: CompasSaveTo;
-    const docName = 'station123.scd';
-    const docId = '6a45ae97-5605-44f8-b4e6-25305bc6c036';
     beforeEach(async () => {
-      element = <CompasSaveTo>(
-        await fixture(
-          html`
-            <compas-save-to .docName="${docName}" .docId="${docId}"></compas-save-to>`
-        )
+      element = fixtureSync(
+        html`<compas-save-to .docName="${docName}" .docId="${docId}"></compas-save-to>`
       );
+
+      sinon.stub(element, 'checkExistInCompas').callsFake(() => {
+        element.existInCompas = true;
+      });
+
+      await element;
+      await waitUntil(() => element.existInCompas !== undefined);
+
     });
 
     it('looks like the latest snapshot', () => {
       expect(element).shadowDom
         .to.equalSnapshot();
     });
   })
+
+  afterEach(() => {
+    sinon.restore();
+  });
 });