Code refactoring, add e2e test

cypress/integration/rendering/gantt.spec.js

@@ -2,7 +2,7 @@ import { imgSnapshotTest, renderGraph } from '../../helpers/util.js';
 
 describe('Gantt diagram', () => {
   beforeEach(() => {
-    cy.clock(new Date('1010-10-10').getTime());
+    cy.clock(new Date('2010-10-10').getTime());
   });
   it('should render a gantt chart', () => {
     imgSnapshotTest(
@@ -435,4 +435,37 @@ describe('Gantt diagram', () => {
       { gantt: { topAxis: true } }
     );
   });
+
+  it('should render when compact is true', () => {
+    imgSnapshotTest(
+      `
+      gantt
+        title GANTT compact
+        dateFormat  HH:mm:ss
+        axisFormat  %Hh%M
+        compact
+
+        section DB Clean
+        Clean: 12:00:00, 10m
+        Clean: 12:30:00, 12m
+        Clean: 13:00:00, 8m
+        Clean: 13:30:00, 9m
+        Clean: 14:00:00, 13m
+        Clean: 14:30:00, 10m
+        Clean: 15:00:00, 11m
+
+        section Sessions
+        A: 12:00:00, 63m
+        B: 12:30:00, 12m
+        C: 13:05:00, 12m
+        D: 13:06:00, 33m
+        E: 13:15:00, 55m
+        F: 13:20:00, 12m
+        G: 13:32:00, 18m
+        H: 13:50:00, 20m
+        I: 14:10:00, 10m
+    `,
+      {}
+    );
+  });
 });

demos/gantt.html

@@ -167,31 +167,31 @@
     <hr />
 
     <pre class="mermaid">
-      gantt
+    gantt
-        title GANTT compact
+    title GANTT compact
-        dateFormat  HH:mm:ss
+    dateFormat  HH:mm:ss
-        axisFormat  %Hh%M
+    axisFormat  %Hh%M
-        compact
+    compact
 
-        section DB Clean
+    section DB Clean
-        Clean: 12:00:00, 10m
+    Clean: 12:00:00, 10m
-        Clean: 12:30:00, 12m
+    Clean: 12:30:00, 12m
-        Clean: 13:00:00, 8m
+    Clean: 13:00:00, 8m
-        Clean: 13:30:00, 9m
+    Clean: 13:30:00, 9m
-        Clean: 14:00:00, 13m
+    Clean: 14:00:00, 13m
-        Clean: 14:30:00, 10m
+    Clean: 14:30:00, 10m
-        Clean: 15:00:00, 11m
+    Clean: 15:00:00, 11m
 
-        section Sessions
+    section Sessions
-        A: 12:00:00, 63m
+    A: 12:00:00, 63m
-        B: 12:30:00, 12m
+    B: 12:30:00, 12m
-        C: 13:05:00, 12m
+    C: 13:05:00, 12m
-        D: 13:06:00, 33m
+    D: 13:06:00, 33m
-        E: 13:15:00, 55m
+    E: 13:15:00, 55m
-        F: 13:20:00, 12m
+    F: 13:20:00, 12m
-        G: 13:32:00, 18m
+    G: 13:32:00, 18m
-        H: 13:50:00, 20m
+    H: 13:50:00, 20m
-        I: 14:10:00, 10m
+    I: 14:10:00, 10m
     </pre>
     <hr />
 

docs/config/setup/modules/mermaidAPI.md

@@ -88,6 +88,7 @@ const config = {
     numberSectionStyles: 4,
     axisFormat: '%Y-%m-%d',
     topAxis: false,
+    compact: false,
   },
 };
 mermaid.initialize(config);
@@ -95,7 +96,7 @@ mermaid.initialize(config);
 
 #### Defined in
 
-[mermaidAPI.ts:659](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L659)
+[mermaidAPI.ts:660](https://github.com/mermaid-js/mermaid/blob/master/packages/mermaid/src/mermaidAPI.ts#L660)
 
 ## Functions
 

packages/mermaid/src/defaultConfig.ts

@@ -688,7 +688,7 @@ const config: Partial<MermaidConfig> = {
     /**
      * | Parameter | Description               | Type    | Required | Values      |
      * | --------- | ------------------------- | ------- | -------- | ----------- |
-     * | compact   | displays in compact mode  | boolean | Optional | true, false |
+     * | compact   | displays in compact mode  | boolean | 4        | True, False |
      *
      * **Notes:**
      *

packages/mermaid/src/diagrams/gantt/ganttDb.js

@@ -25,7 +25,6 @@ dayjs.extend(dayjsAdvancedFormat);
 let dateFormat = '';
 let axisFormat = '';
 let tickInterval = undefined;
-let compact = false;
 let todayMarker = '';
 let includes = [];
 let excludes = [];
@@ -37,6 +36,7 @@ const tags = ['active', 'done', 'crit', 'milestone'];
 let funs = [];
 let inclusiveEndDates = false;
 let topAxis = false;
+let compact = false;
 
 // The serial order of the task in the script
 let lastOrder = 0;
@@ -57,12 +57,12 @@ export const clear = function () {
   dateFormat = '';
   axisFormat = '';
   tickInterval = undefined;
-  compact = false;
   todayMarker = '';
   includes = [];
   excludes = [];
   inclusiveEndDates = false;
   topAxis = false;
+  compact = false;
   lastOrder = 0;
   links = {};
   commonClear();
@@ -84,14 +84,6 @@ export const getTickInterval = function () {
   return tickInterval;
 };
 
-export const enableCompact = function () {
-  compact = true;
-};
-
-export const compactEnabled = function () {
-  return compact;
-};
-
 export const setTodayMarker = function (txt) {
   todayMarker = txt;
 };
@@ -120,6 +112,14 @@ export const topAxisEnabled = function () {
   return topAxis;
 };
 
+export const enableCompact = function () {
+  compact = true;
+};
+
+export const compactEnabled = function () {
+  return compact;
+};
+
 export const getDateFormat = function () {
   return dateFormat;
 };

packages/mermaid/src/diagrams/gantt/ganttRenderer.js

@@ -97,7 +97,7 @@ export const draw = function (text, id, version, diagObj) {
   const categoryHeights = {};
 
   let h = 2 * conf.topPadding;
-  if (diagObj.db.compactEnabled()) {
+  if (diagObj.db.compactEnabled() || conf.compact) {
     const categoryElements = {};
     for (const element of taskArray) {
       if (categoryElements[element.section] === undefined) {

packages/mermaid/src/diagrams/gantt/parser/gantt.spec.js

@@ -37,6 +37,12 @@ describe('when parsing a gantt diagram it', function () {
 
     expect(parserFnConstructor(str)).not.toThrow();
   });
+  it('should handle a compact definition', function () {
+    const str =
+      'gantt\ndateFormat yyyy-mm-dd\ntitle Adding gantt diagram functionality to mermaid\ncompact\nexcludes weekdays 2019-02-01';
+
+    expect(parserFnConstructor(str)).not.toThrow();
+  });
   it('should handle a todayMarker definition', function () {
     spyOn(ganttDb, 'setTodayMarker');
     const str =

packages/mermaid/src/mermaidAPI.ts

@@ -650,6 +650,7 @@ function addA11yInfo(
  *       numberSectionStyles: 4,
  *       axisFormat: '%Y-%m-%d',
  *       topAxis: false,
+ *       compact: false,
  *     },
  *   };
  *   mermaid.initialize(config);