Merge branch 'develop' into sidv/fixRunAsync

* develop: (23 commits) Fix test refactor(deps): replace `moment` with `dayjs` test(gantt): test daylight savings in ganttdb Update .lycheeignore chore: dagre-d3-es@7.0.9 chore: Add tsdoc for registerLazyLoadedDiagrams feat: Ensure proper detection for flowcharts fix: Class label not visible if class is already defined Update import fix TS errors fix TS errors feat: Match timeline section width to tasks chore: TimelineRenderer in TS Fix types fix: Detector order Lint Cleanup nodes.js docs: Update classdiagram docs classLabel tests Formatting ...
2025-11-02 03:44:16 +01:00 · 2023-02-28 16:48:54 +05:30
parent 275a54a562 3f93edaaf3
commit 7cee8cb6dc
37 changed files with 1350 additions and 1000 deletions
--- a/cypress/helpers/util.js
+++ b/cypress/helpers/util.js
@@ -22,7 +22,7 @@ export const mermaidUrl = (graphStr, options, api) => {
  return url;
 };

-export const imgSnapshotTest = (graphStr, _options, api = false, validation) => {
+export const imgSnapshotTest = (graphStr, _options = {}, api = false, validation = undefined) => {
  cy.log(_options);
  const options = Object.assign(_options);
  if (!options.fontFamily) {
--- a/cypress/integration/rendering/classDiagram-v2.spec.js
+++ b/cypress/integration/rendering/classDiagram-v2.spec.js
@@ -13,7 +13,6 @@ describe('Class diagram V2', () => {
        `,
      { logLevel: 1, flowchart: { htmlLabels: false } }
    );
-    cy.get('svg');
  });

  it('1: should render a simple class diagram', () => {
@@ -47,7 +46,6 @@ describe('Class diagram V2', () => {
      `,
      { logLevel: 1, flowchart: { htmlLabels: false } }
    );
-    cy.get('svg');
  });

  it('2: should render a simple class diagrams with cardinality', () => {
@@ -76,7 +74,6 @@ describe('Class diagram V2', () => {
      `,
      { logLevel: 1, flowchart: { htmlLabels: false } }
    );
-    cy.get('svg');
  });

  it('should render a simple class diagram with different visibilities', () => {
@@ -94,7 +91,6 @@ describe('Class diagram V2', () => {
      `,
      { logLevel: 1, flowchart: { htmlLabels: false } }
    );
-    cy.get('svg');
  });

  it('should render multiple class diagrams', () => {
@@ -147,7 +143,6 @@ describe('Class diagram V2', () => {
      ],
      { logLevel: 1, flowchart: { htmlLabels: false } }
    );
-    cy.get('svg');
  });

  it('4: should render a simple class diagram with comments', () => {
@@ -177,7 +172,6 @@ describe('Class diagram V2', () => {
      `,
      { logLevel: 1, flowchart: { htmlLabels: false } }
    );
-    cy.get('svg');
  });

  it('5: should render a simple class diagram with abstract method', () => {
@@ -189,7 +183,6 @@ describe('Class diagram V2', () => {
      `,
      { logLevel: 1, flowchart: { htmlLabels: false } }
    );
-    cy.get('svg');
  });

  it('6: should render a simple class diagram with static method', () => {
@@ -201,7 +194,6 @@ describe('Class diagram V2', () => {
      `,
      { logLevel: 1, flowchart: { htmlLabels: false } }
    );
-    cy.get('svg');
  });

  it('7: should render a simple class diagram with Generic class', () => {
@@ -221,7 +213,6 @@ describe('Class diagram V2', () => {
      `,
      { logLevel: 1, flowchart: { htmlLabels: false } }
    );
-    cy.get('svg');
  });

  it('8: should render a simple class diagram with Generic class and relations', () => {
@@ -242,7 +233,6 @@ describe('Class diagram V2', () => {
      `,
      { logLevel: 1, flowchart: { htmlLabels: false } }
    );
-    cy.get('svg');
  });

  it('9: should render a simple class diagram with clickable link', () => {
@@ -264,7 +254,6 @@ describe('Class diagram V2', () => {
      `,
      { logLevel: 1, flowchart: { htmlLabels: false } }
    );
-    cy.get('svg');
  });

  it('10: should render a simple class diagram with clickable callback', () => {
@@ -286,7 +275,6 @@ describe('Class diagram V2', () => {
      `,
      { logLevel: 1, flowchart: { htmlLabels: false } }
    );
-    cy.get('svg');
  });

  it('11: should render a simple class diagram with return type on method', () => {
@@ -301,7 +289,6 @@ describe('Class diagram V2', () => {
      `,
      { logLevel: 1, flowchart: { htmlLabels: false } }
    );
-    cy.get('svg');
  });

  it('12: should render a simple class diagram with generic types', () => {
@@ -317,7 +304,6 @@ describe('Class diagram V2', () => {
      `,
      { logLevel: 1, flowchart: { htmlLabels: false } }
    );
-    cy.get('svg');
  });

  it('13: should render a simple class diagram with css classes applied', () => {
@@ -335,7 +321,6 @@ describe('Class diagram V2', () => {
      `,
      { logLevel: 1, flowchart: { htmlLabels: false } }
    );
-    cy.get('svg');
  });

  it('14: should render a simple class diagram with css classes applied directly', () => {
@@ -351,7 +336,6 @@ describe('Class diagram V2', () => {
      `,
      { logLevel: 1, flowchart: { htmlLabels: false } }
    );
-    cy.get('svg');
  });

  it('15: should render a simple class diagram with css classes applied two multiple classes', () => {
@@ -365,7 +349,6 @@ describe('Class diagram V2', () => {
      `,
      { logLevel: 1, flowchart: { htmlLabels: false } }
    );
-    cy.get('svg');
  });

  it('16a: should render a simple class diagram with static field', () => {
@@ -378,7 +361,6 @@ describe('Class diagram V2', () => {
            `,
      { logLevel: 1, flowchart: { htmlLabels: false } }
    );
-    cy.get('svg');
  });

  it('16b: should handle the direction statement with TB', () => {
@@ -403,7 +385,6 @@ describe('Class diagram V2', () => {
      `,
      { logLevel: 1, flowchart: { htmlLabels: false } }
    );
-    cy.get('svg');
  });

  it('18: should handle the direction statement with LR', () => {
@@ -428,7 +409,6 @@ describe('Class diagram V2', () => {
      `,
      { logLevel: 1, flowchart: { htmlLabels: false } }
    );
-    cy.get('svg');
  });
  it('17a: should handle the direction statement with BT', () => {
    imgSnapshotTest(
@@ -452,7 +432,6 @@ describe('Class diagram V2', () => {
      `,
      { logLevel: 1, flowchart: { htmlLabels: false } }
    );
-    cy.get('svg');
  });
  it('17b: should handle the direction statement with RL', () => {
    imgSnapshotTest(
@@ -476,7 +455,6 @@ describe('Class diagram V2', () => {
      `,
      { logLevel: 1, flowchart: { htmlLabels: false } }
    );
-    cy.get('svg');
  });

  it('18: should render a simple class diagram with notes', () => {
@@ -493,7 +471,6 @@ describe('Class diagram V2', () => {
        `,
      { logLevel: 1, flowchart: { htmlLabels: false } }
    );
-    cy.get('svg');
  });

  it('1433: should render a simple class with a title', () => {
@@ -503,8 +480,72 @@ title: simple class diagram
 ---
 classDiagram-v2
 class Class10
-`,
-      {}
+`
+    );
+  });
+
+  it('should render a class with text label', () => {
+    imgSnapshotTest(
+      `classDiagram
+  class C1["Class 1 with text label"]
+  C1 -->  C2`
+    );
+  });
+
+  it('should render two classes with text labels', () => {
+    imgSnapshotTest(
+      `classDiagram
+  class C1["Class 1 with text label"]
+  class C2["Class 2 with chars @?"]
+  C1 -->  C2`
+    );
+  });
+  it('should render a class with a text label, members and annotation', () => {
+    imgSnapshotTest(
+      `classDiagram
+  class C1["Class 1 with text label"] {
+    &lt;&lt;interface&gt;&gt;
+    +member1
+  }
+  C1 -->  C2`
+    );
+  });
+  it('should render multiple classes with same text labels', () => {
+    imgSnapshotTest(
+      `classDiagram
+class C1["Class with text label"]
+class C2["Class with text label"]
+class C3["Class with text label"]
+C1 --> C2
+C3 ..> C2
+  `
+    );
+  });
+  it('should render classes with different text labels', () => {
+    imgSnapshotTest(
+      `classDiagram
+class C1["OneWord"]
+class C2["With, Comma"]
+class C3["With (Brackets)"]
+class C4["With [Brackets]"]
+class C5["With {Brackets}"]
+class C7["With 1 number"]
+class C8["With . period..."]
+class C9["With - dash"]
+class C10["With _ underscore"]
+class C11["With ' single quote"]
+class C12["With ~!@#$%^&*()_+=-/?"]
+class C13["With Città foreign language"]
+  `
+    );
+  });
+
+  it('should render classLabel if class has already been defined earlier', () => {
+    imgSnapshotTest(
+      `classDiagram
+  Animal <|-- Duck
+  class Duck["Duck with text label"]
+`
    );
  });
 });
--- a/cypress/platform/class.html
+++ b/cypress/platform/class.html
@@ -12,7 +12,6 @@
    <style>
      body {
        background: rgb(221, 208, 208);
-        /*background:#333;*/
        font-family: 'Arial';
      }
      h1 {
@@ -120,17 +119,9 @@ classE o-- classF : aggregation
      };
      mermaid.initialize({
        theme: 'default',
-        // arrowMarkerAbsolute: true,
-        // themeCSS: '.edgePath .path {stroke: red;} .arrowheadPath {fill: red;}',
        logLevel: 0,
        flowchart: { curve: 'linear', htmlLabels: true },
-        // gantt: { axisFormat: '%m/%d/%Y' },
        sequence: { actorMargin: 50, showSequenceNumbers: true },
-        // sequenceDiagram: { actorMargin: 300 } // deprecated
-        // fontFamily: '"arial", sans-serif',
-        // themeVariables: {
-        //   fontFamily: '"arial", sans-serif',
-        // },
        curve: 'linear',
        securityLevel: 'loose',
      });