From b486177ca7089acb03765614d1726f5c57f3ed47 Mon Sep 17 00:00:00 2001 From: Sidharth Vinod Date: Sat, 15 Oct 2022 00:28:21 +0530 Subject: [PATCH] fix: Diagram load issue --- .vite/build.ts | 12 +++++++++--- package.json | 1 + packages/mermaid/src/Diagram.ts | 8 ++++++-- packages/mermaid/src/diagram-api/diagramAPI.ts | 11 ++++++++++- packages/mermaid/src/logger.ts | 3 +++ packages/mermaid/src/mermaid.ts | 11 +++++++---- 6 files changed, 36 insertions(+), 10 deletions(-) diff --git a/.vite/build.ts b/.vite/build.ts index 7398d30d5..360f878ba 100644 --- a/.vite/build.ts +++ b/.vite/build.ts @@ -6,6 +6,7 @@ import pkg from '../package.json' assert { type: 'json' }; const { dependencies } = pkg; const watch = process.argv.includes('--watch'); +const mermaidOnly = process.argv.includes('--mermaid'); const __dirname = fileURLToPath(new URL('.', import.meta.url)); type OutputOptions = Exclude< @@ -129,14 +130,19 @@ const buildPackage = async (entryName: keyof typeof packageOptions) => { const main = async () => { const packageNames = Object.keys(packageOptions) as (keyof typeof packageOptions)[]; for (const pkg of packageNames) { + if (mermaidOnly && pkg !== 'mermaid') { + continue; + } await buildPackage(pkg); } }; if (watch) { - build(getBuildConfig({ minify: false, watch, entryName: 'mermaid' })); - build(getBuildConfig({ minify: false, watch, entryName: 'mermaid-mindmap' })); - build(getBuildConfig({ minify: false, watch, entryName: 'mermaid-example-diagram' })); + build(getBuildConfig({ minify: false, watch, core: true, entryName: 'mermaid' })); + if (!mermaidOnly) { + build(getBuildConfig({ minify: false, watch, entryName: 'mermaid-mindmap' })); + build(getBuildConfig({ minify: false, watch, entryName: 'mermaid-example-diagram' })); + } } else { void main(); } diff --git a/package.json b/package.json index 15adccd64..5dc6792a1 100644 --- a/package.json +++ b/package.json @@ -26,6 +26,7 @@ "git graph" ], "scripts": { + "build:mermaid": "ts-node-esm --transpileOnly --project=.vite/tsconfig.json .vite/build.ts --mermaid", "build:vite": "ts-node-esm --transpileOnly --project=.vite/tsconfig.json .vite/build.ts", "build:types": "concurrently \"tsc -p ./packages/mermaid/tsconfig.json --emitDeclarationOnly\" \"tsc -p ./packages/mermaid-mindmap/tsconfig.json --emitDeclarationOnly\"", "build:watch": "pnpm build:vite --watch", diff --git a/packages/mermaid/src/Diagram.ts b/packages/mermaid/src/Diagram.ts index e4f1d2645..cdd771e4d 100644 --- a/packages/mermaid/src/Diagram.ts +++ b/packages/mermaid/src/Diagram.ts @@ -1,6 +1,6 @@ import * as configApi from './config'; import { log } from './logger'; -import { getDiagram, registerDiagram } from './diagram-api/diagramAPI'; +import { DiagramNotFoundError, getDiagram, registerDiagram } from './diagram-api/diagramAPI'; import { detectType, getDiagramLoader } from './diagram-api/detectType'; import { isDetailedError } from './utils'; export class Diagram { @@ -92,9 +92,13 @@ export const getDiagramFromText = ( getDiagram(type); return new Diagram(txt, parseError); } catch (error) { + if (!(error instanceof DiagramNotFoundError)) { + log.error(error); + throw error; + } const loader = getDiagramLoader(type); if (!loader) { - throw new Error(`Diagram ${type} not found.`); + throw new Error(`Loader for ${type} not found.`); } // TODO: Uncomment for v10 // // Diagram not available, loading it diff --git a/packages/mermaid/src/diagram-api/diagramAPI.ts b/packages/mermaid/src/diagram-api/diagramAPI.ts index 91c5ffe71..6eeff6df1 100644 --- a/packages/mermaid/src/diagram-api/diagramAPI.ts +++ b/packages/mermaid/src/diagram-api/diagramAPI.ts @@ -34,6 +34,7 @@ export const registerDiagram = ( _setupGraphViewbox: any ) => void ) => { + log.debug(`Registering diagram ${id}`); if (diagrams[id]) { log.warn(`Diagram ${id} already registered.`); // The error throw is commented out to as it breaks pages where you have multiple diagrams, @@ -50,11 +51,19 @@ export const registerDiagram = ( if (typeof callback !== 'undefined') { callback(log, setLogLevel, getConfig, sanitizeText, setupGraphViewbox); } + log.debug(`Registered diagram ${id}. ${Object.keys(diagrams).join(', ')} diagrams registered.`); }; export const getDiagram = (name: string): DiagramDefinition => { + log.debug(`Getting diagram ${name}. ${Object.keys(diagrams).join(', ')} diagrams registered.`); if (name in diagrams) { return diagrams[name]; } - throw new Error(`Diagram ${name} not found.`); + throw new DiagramNotFoundError(name); }; + +export class DiagramNotFoundError extends Error { + constructor(message: string) { + super(`Diagram ${message} not found.`); + } +} diff --git a/packages/mermaid/src/logger.ts b/packages/mermaid/src/logger.ts index b01934e88..3eae56d8a 100644 --- a/packages/mermaid/src/logger.ts +++ b/packages/mermaid/src/logger.ts @@ -30,6 +30,8 @@ export const log: Record = { * @param {LogLevel} [level="fatal"] The level to set the logging to. Default is `"fatal"` */ export const setLogLevel = function (level: keyof typeof LEVELS | number | string = 'fatal') { + // TODO: Even if we call initialize with loglevel 0, many initial logs are skipped as LL is set to 5 initially. + let numericLevel: number = LEVELS.fatal; if (typeof level === 'string') { level = level.toLowerCase(); @@ -39,6 +41,7 @@ export const setLogLevel = function (level: keyof typeof LEVELS | number | strin } else if (typeof level === 'number') { numericLevel = level; } + numericLevel = 0; log.trace = () => {}; log.debug = () => {}; log.info = () => {}; diff --git a/packages/mermaid/src/mermaid.ts b/packages/mermaid/src/mermaid.ts index 7a280fa31..a630016dc 100644 --- a/packages/mermaid/src/mermaid.ts +++ b/packages/mermaid/src/mermaid.ts @@ -159,7 +159,7 @@ const initThrowsErrors = function ( } }; -let lazyLoadingPromise: Promise | undefined; +let lazyLoadingPromise: Promise | undefined = undefined; /** * @param conf * @deprecated This is an internal function and should not be used. Will be removed in v10. @@ -179,12 +179,15 @@ const registerLazyLoadedDiagrams = async (conf: MermaidConfig) => { await lazyLoadingPromise; }; +let loadingPromise: Promise | undefined = undefined; + const loadExternalDiagrams = async (conf: MermaidConfig) => { // Only lazy load once // TODO: This is a hack. We should either throw error when new diagrams are added, or load them anyway. - if (lazyLoadingPromise === undefined) { + if (loadingPromise === undefined) { + log.debug(`Loading ${conf?.lazyLoadedDiagrams?.length} external diagrams`); // Load all lazy loaded diagrams in parallel - lazyLoadingPromise = Promise.allSettled( + loadingPromise = Promise.allSettled( (conf?.lazyLoadedDiagrams ?? []).map(async (url: string) => { const { id, detector, loadDiagram } = await import(url); const { diagram } = await loadDiagram(); @@ -192,7 +195,7 @@ const loadExternalDiagrams = async (conf: MermaidConfig) => { }) ); } - await lazyLoadingPromise; + await loadingPromise; }; /**