Pull request #241: fix(Editor) when websocket session cannot be found…

… anymore, import after export gives an error - IIC-1202

Merge in WS/iink-ts from IIC-1202 to master

* commit '8950dae563e9271d6bd7be5829f1f77986d019be':
  fix(Editor) when websocket session cannot be found anymore, import after export gives an error - IIC-1202

src/Editor.ts

@@ -201,20 +201,19 @@ export class Editor
   {
     this.#messageContainer = document.createElement("div")
     this.#messageContainer.classList.add("message-container")
+    this.#messageContainer.style.display = "none"
 
     this.#messageOverlay = document.createElement("div")
     this.#messageOverlay.classList.add("message-overlay")
-    this.#messageOverlay.style.display = "none"
     this.#messageContainer.appendChild(this.#messageOverlay)
 
     this.#messageModal = document.createElement("div")
     this.#messageModal.classList.add("message-modal")
 
     const closeBtn = document.createElement("button")
     closeBtn.classList.add("ms-button", "close")
-    closeBtn.addEventListener("pointerup", this.closeMessageModal.bind(this))
+    closeBtn.addEventListener("pointerup", () => this.closeMessageModal())
     this.#messageModal.appendChild(closeBtn)
-    this.#messageModal.style.display = "none"
 
     this.#messageText = document.createElement("p")
     this.#messageModal.appendChild(this.#messageText)
@@ -345,8 +344,7 @@ export class Editor
 
   async closeMessageModal(): Promise<void>
   {
-    this.#messageModal.style.display = "none"
-    this.#messageOverlay.style.display = "none"
+    this.#messageContainer.style.display = "none"
     this.#messageText.innerText = ""
     if (this.#messageModal.classList.contains("error-msg")) {
       this.#messageModal.classList.remove("error-msg")
@@ -359,16 +357,15 @@ export class Editor
   {
     this.#messageModal.classList.add("error-msg")
     this.#messageModal.classList.remove("info-msg")
-    this.#messageModal.style.display = "initial"
-    this.#messageOverlay.style.display = "initial"
+    this.#messageContainer.style.display = "block"
     this.#messageText.innerText = typeof err === "string" ? err : err.message
   }
 
   showNotif(notif: { message: string, timeout?: number })
   {
-    this.#messageModal.style.display = "initial"
     this.#messageModal.classList.add("info-msg")
     this.#messageModal.classList.remove("error-msg")
+    this.#messageContainer.style.display = "block"
     this.#messageText.innerText = notif.message
     setTimeout(() =>
     {

src/behaviors/OIBehaviors.ts

@@ -1306,6 +1306,8 @@ export class OIBehaviors implements IBehaviors
     this.renderer.destroy()
     this.menu.destroy()
     this.recognizer.destroy()
+    this.model.clear()
+    this.history.clear()
     return Promise.resolve()
   }
 }

src/history/OIHistoryManager.ts

@@ -193,4 +193,10 @@ export class OIHistoryManager implements IHistoryManager
     this.#logger.debug("redo", nextStackItem)
     return nextStackItem
   }
+
+  clear(): void
+  {
+    this.context = getInitialUndoRedoContext()
+    this.stack = []
+  }
 }

src/iink.css

@@ -65,7 +65,6 @@
   box-shadow: 0 1px 1px 0 rgba(0, 0, 0, .16);
 }
 
-
 .ms-editor.draw {
     cursor: url('data:image/svg+xml,<svg width="24px" height="24px" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M14.3632 5.65156L15.8431 4.17157C16.6242 3.39052 17.8905 3.39052 18.6716 4.17157L20.0858 5.58579C20.8668 6.36683 20.8668 7.63316 20.0858 8.41421L18.6058 9.8942M14.3632 5.65156L4.74749 15.2672C4.41542 15.5993 4.21079 16.0376 4.16947 16.5054L3.92738 19.2459C3.87261 19.8659 4.39148 20.3848 5.0115 20.33L7.75191 20.0879C8.21972 20.0466 8.65806 19.8419 8.99013 19.5099L18.6058 9.8942M14.3632 5.65156L18.6058 9.8942" stroke="%23000000" fill="white" stroke-width="1" stroke-linecap="round" stroke-linejoin="round" ></path></svg>') 5 20, pointer;
 }
@@ -109,8 +108,8 @@
     user-select: none;
 }
 .ms-editor .ms-layer-infos > * {
-    pointer-events: all;
     cursor: auto;
+    pointer-events: all;
     user-select: none;
 }
 /** loader **/
@@ -165,7 +164,6 @@
     position: absolute;
     width: 100%;
     height: 100%;
-    pointer-events: none;
 }
 .ms-editor .message-overlay {
     z-index: 99;

src/recognizer/OIRecognizer.ts

@@ -323,7 +323,7 @@ export class OIRecognizer
 
     if (this.currentErrorCode === "no.activity") {
       this.rejectDeferredPending(message)
-      this.internalEvent.emitNotif({ message: RecognizerError.NO_ACTIVITY, timeout: Infinity})
+      this.internalEvent.emitNotif({ message: RecognizerError.NO_ACTIVITY, timeout: Infinity })
     }
     else {
       switch (this.currentErrorCode) {
@@ -433,7 +433,7 @@ export class OIRecognizer
       this.socket.send(JSON.stringify(message))
       return Promise.resolve()
     }
-    else {
+    else if (this.currentErrorCode !== "restore.session.not.found") {
       if (this.socket.readyState != this.socket.CONNECTING && this.serverConfiguration.websocket.autoReconnect) {
         this.reconnectionCount++
         await this.initialized?.promise

test/unit/Editor.test.ts

@@ -209,13 +209,14 @@ describe("Editor.ts", () =>
       wrapperHTML.style.width = "100px"
       const editor = new Editor(wrapperHTML, DefaultBehaviorsOptions)
       editor.behaviors.init = jest.fn(() => Promise.reject(new Error("pouet")))
-      const messageElement = wrapperHTML.querySelector(".message-modal") as HTMLElement
+      const messageContainer = wrapperHTML.querySelector(".message-container") as HTMLElement
+      const messageElement = messageContainer.querySelector(".message-modal p") as HTMLElement
       try {
-        expect(messageElement!.style.display).toEqual("none")
+        expect(messageContainer!.style.display).toEqual("none")
         await editor.initialize()
       } catch (error) {
-        expect(messageElement!.style.display).toEqual("initial")
-        expect(messageElement!.querySelector("p")!.innerText).toEqual("pouet")
+        expect(messageContainer.style.display).toEqual("block")
+        expect(messageElement.innerText).toEqual("pouet")
       }
     })
   })