From 20c6e9146cea4704d6bc93e0c43cf3e4d566bc2f Mon Sep 17 00:00:00 2001 From: sidharthv96 Date: Thu, 24 Nov 2022 10:30:12 +0000 Subject: [PATCH 1/3] Update Browserslist --- yarn.lock | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/yarn.lock b/yarn.lock index d2e8a5ae..09c0d5a8 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1039,9 +1039,9 @@ caniuse-api@^3.0.0: lodash.uniq "^4.5.0" caniuse-lite@^1.0.0, caniuse-lite@^1.0.30001370, caniuse-lite@^1.0.30001400, caniuse-lite@^1.0.30001407: - version "1.0.30001431" - resolved "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001431.tgz" - integrity sha512-zBUoFU0ZcxpvSt9IU66dXVT/3ctO1cy4y9cscs1szkPlcWb6pasYM144GqrUygUbT+k7cmUCW61cvskjcv0enQ== + version "1.0.30001434" + resolved "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001434.tgz" + integrity sha512-aOBHrLmTQw//WFa2rcF1If9fa3ypkC1wzqqiKHgfdrXTWcU8C4gKVZT77eQAPWN1APys3+uQ0Df07rKauXGEYA== caseless@~0.12.0: version "0.12.0" From 7c4c2a02f963828ca055e2bc2cae585189099d77 Mon Sep 17 00:00:00 2001 From: Sidharth Vinod Date: Thu, 24 Nov 2022 16:20:01 +0530 Subject: [PATCH 2/3] fix: Remove AsyncQueue --- src/lib/components/View.svelte | 6 ++---- src/lib/util/state.ts | 13 ++----------- src/lib/util/util.ts | 21 --------------------- 3 files changed, 4 insertions(+), 36 deletions(-) diff --git a/src/lib/components/View.svelte b/src/lib/components/View.svelte index 28fa976f..c6c66e93 100644 --- a/src/lib/components/View.svelte +++ b/src/lib/components/View.svelte @@ -4,7 +4,7 @@ import panzoom from 'svg-pan-zoom'; import type { State, ValidatedState } from '$lib/types'; import { logEvent } from '$lib/util/stats'; - import { AsyncQueue, cmdKey } from '$lib/util/util'; + import { cmdKey } from '$lib/util/util'; import { render as renderDiagram } from '$lib/util/mermaid'; import type { MermaidConfig } from 'mermaid'; @@ -113,11 +113,9 @@ } }; - const q = new AsyncQueue(handleStateChange); - onMount(() => { stateStore.subscribe((state) => { - void q.process(state); + void handleStateChange(state); }); window.addEventListener('resize', () => { if ($stateStore.panZoom && pzoom) { diff --git a/src/lib/util/state.ts b/src/lib/util/state.ts index b0c9a3ba..c8a2619e 100644 --- a/src/lib/util/state.ts +++ b/src/lib/util/state.ts @@ -2,7 +2,7 @@ import { writable, get, type Readable, derived } from 'svelte/store'; import { persist, localStorage } from './persist'; import { saveStatistics, countLines } from './stats'; import { serializeState, deserializeState } from './serde'; -import { cmdKey, errorDebug, AsyncQueue } from './util'; +import { cmdKey, errorDebug } from './util'; import { parse } from './mermaid'; import type { ErrorHash, MarkerData, State, ValidatedState } from '$lib/types'; @@ -52,8 +52,6 @@ export const currentState: ValidatedState = (() => { }; })(); -let q: AsyncQueue | undefined; - const processState = async (state: State) => { const processed: ValidatedState = { ...state, @@ -99,14 +97,7 @@ const processState = async (state: State) => { export const stateStore: Readable = derived( [inputStateStore], ([state], set) => { - if (!q) { - // Initialize the queue for first time. - q = new AsyncQueue(async (state: State) => { - const newState = await processState(state); - set(newState); - }); - } - void q.process(state); + void processState(state).then(set); }, currentState ); diff --git a/src/lib/util/util.ts b/src/lib/util/util.ts index 980bda63..bf2c7606 100644 --- a/src/lib/util/util.ts +++ b/src/lib/util/util.ts @@ -38,24 +38,3 @@ export const errorDebug = (limit = 100) => { debugger; } }; - -// To queue async tasks so they are executed one after the other, not concurrently. -export class AsyncQueue { - private readonly queue: T[] = []; - private running = false; - constructor(private processor: (item: T) => Promise) {} - public async process(item: T): Promise { - this.queue.push(item); - if (this.running) { - return; - } - this.running = true; - while (this.queue.length > 0) { - const item = this.queue.shift(); - if (item) { - await this.processor(item); - } - } - this.running = false; - } -} From 3e6c28f15a24b20976593621e8fd41b97fbfec58 Mon Sep 17 00:00:00 2001 From: Sidharth Vinod Date: Thu, 24 Nov 2022 21:56:20 +0530 Subject: [PATCH 3/3] fix #1103 --- cypress/e2e/diagramUpdate.spec.ts | 8 ++++++++ cypress/snapshots.js | 2 +- src/lib/util/state.ts | 8 ++++---- 3 files changed, 13 insertions(+), 5 deletions(-) diff --git a/cypress/e2e/diagramUpdate.spec.ts b/cypress/e2e/diagramUpdate.spec.ts index 07bd430a..317a62a1 100644 --- a/cypress/e2e/diagramUpdate.spec.ts +++ b/cypress/e2e/diagramUpdate.spec.ts @@ -69,6 +69,14 @@ describe('Auto sync tests', () => { ) .should('exist'); }); + + it.only('should update diagram after entire text is removed', () => { + // https://github.com/mermaid-js/mermaid-live-editor/issues/1102 + getEditor().type(`${cmd} a {backspace}`); + getEditor().type('graph LR'); + getEditor().type(' {enter} A-->Car'); + cy.get('#view').contains('Car').should('exist'); + }); }); describe('Pan and Zoom', () => { diff --git a/cypress/snapshots.js b/cypress/snapshots.js index a66a23cb..547d2f44 100644 --- a/cypress/snapshots.js +++ b/cypress/snapshots.js @@ -16,7 +16,7 @@ module.exports = { "1": "{\"code\":\"graph TD\\n A[Party] -->|Get money| B(Go shopping!!)\\n \",\"mermaid\":\"{\\n \\\"theme\\\": \\\"forest\\\",\\n \\\"test\\\": \\\"hello world\\\"\\n}\",\"autoSync\":true,\"updateDiagram\":true,\"loader\":{\"type\":\"files\",\"config\":{\"codeURL\":\"https://gist.githubusercontent.com/sidharthv96/6268a23e673a533dcb198f241fd7012a/raw/4eb03887e6a41397e80bdcdbf94017c498f8f1e2/code.mmd\",\"configURL\":\"https://gist.githubusercontent.com/sidharthv96/6268a23e673a533dcb198f241fd7012a/raw/4eb03887e6a41397e80bdcdbf94017c498f8f1e2/config.json\"}}}" } }, - "__version": "10.10.0", + "__version": "11.2.0", "Auto sync tests": { "should dim diagram when code is edited": { "1": "{\"code\":\"graph TD\\n A[Christmas] -->|Get money| B(Go shopping)\\n B --> C{Let me think}\\n C -->|One| D[Laptop]\\n C -->|Two| E[iPhone]\\n C -->|Three| F[fa:fa-car Car]\\n C --> Test\",\"mermaid\":\"{\\n \\\"theme\\\": \\\"default\\\"\\n}\",\"autoSync\":false,\"updateDiagram\":false}" diff --git a/src/lib/util/state.ts b/src/lib/util/state.ts index c8a2619e..6181096a 100644 --- a/src/lib/util/state.ts +++ b/src/lib/util/state.ts @@ -70,11 +70,11 @@ const processState = async (state: State) => { errorDebug(); console.error(e); if ('hash' in e) { - const { - loc: { first_line, last_line, first_column, last_column } - // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access - } = e.hash as ErrorHash; try { + const { + loc: { first_line, last_line, first_column, last_column } + // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access + } = e.hash as ErrorHash; const marker: MarkerData = { severity: 8, // Error startLineNumber: first_line,