mermaid/packages/mermaid/src/diagrams/flowchart/parser/flow-comments.spec.js

import { FlowDB } from '../flowDb.js';
import flow from './flowParserAdapter.js';
import { setConfig } from '../../../config.js';
import { cleanupComments } from '../../../diagram-api/comments.js';

setConfig({
  securityLevel: 'strict',
});

describe('[Comments] when parsing', () => {
  beforeEach(function () {
    flow.yy = new FlowDB();
    flow.yy.clear();
  });

  it('should handle comments', function () {
    const res = flow.parse(cleanupComments('graph TD;\n%% Comment\n A-->B;'));

    const vert = flow.yy.getVertices();
    const edges = flow.yy.getEdges();

    expect(vert.get('A').id).toBe('A');
    expect(vert.get('B').id).toBe('B');
    expect(edges.length).toBe(1);
    expect(edges[0].start).toBe('A');
    expect(edges[0].end).toBe('B');
    expect(edges[0].type).toBe('arrow_point');
    expect(edges[0].text).toBe('');
  });

  it('should handle comments at the start', function () {
    const res = flow.parse(cleanupComments('%% Comment\ngraph TD;\n A-->B;'));

    const vert = flow.yy.getVertices();
    const edges = flow.yy.getEdges();

    expect(vert.get('A').id).toBe('A');
    expect(vert.get('B').id).toBe('B');
    expect(edges.length).toBe(1);
    expect(edges[0].start).toBe('A');
    expect(edges[0].end).toBe('B');
    expect(edges[0].type).toBe('arrow_point');
    expect(edges[0].text).toBe('');
  });

  it('should handle comments at the end', function () {
    const res = flow.parse(cleanupComments('graph TD;\n A-->B\n %% Comment at the end\n'));

    const vert = flow.yy.getVertices();
    const edges = flow.yy.getEdges();

    expect(vert.get('A').id).toBe('A');
    expect(vert.get('B').id).toBe('B');
    expect(edges.length).toBe(1);
    expect(edges[0].start).toBe('A');
    expect(edges[0].end).toBe('B');
    expect(edges[0].type).toBe('arrow_point');
    expect(edges[0].text).toBe('');
  });

  it('should handle comments at the end no trailing newline', function () {
    const res = flow.parse(cleanupComments('graph TD;\n A-->B\n%% Comment'));

    const vert = flow.yy.getVertices();
    const edges = flow.yy.getEdges();

    expect(vert.get('A').id).toBe('A');
    expect(vert.get('B').id).toBe('B');
    expect(edges.length).toBe(1);
    expect(edges[0].start).toBe('A');
    expect(edges[0].end).toBe('B');
    expect(edges[0].type).toBe('arrow_point');
    expect(edges[0].text).toBe('');
  });

  it('should handle comments at the end many trailing newlines', function () {
    const res = flow.parse(cleanupComments('graph TD;\n A-->B\n%% Comment\n\n\n'));

    const vert = flow.yy.getVertices();
    const edges = flow.yy.getEdges();

    expect(vert.get('A').id).toBe('A');
    expect(vert.get('B').id).toBe('B');
    expect(edges.length).toBe(1);
    expect(edges[0].start).toBe('A');
    expect(edges[0].end).toBe('B');
    expect(edges[0].type).toBe('arrow_point');
    expect(edges[0].text).toBe('');
  });

  it('should handle no trailing newlines', function () {
    const res = flow.parse(cleanupComments('graph TD;\n A-->B'));

    const vert = flow.yy.getVertices();
    const edges = flow.yy.getEdges();

    expect(vert.get('A').id).toBe('A');
    expect(vert.get('B').id).toBe('B');
    expect(edges.length).toBe(1);
    expect(edges[0].start).toBe('A');
    expect(edges[0].end).toBe('B');
    expect(edges[0].type).toBe('arrow_point');
    expect(edges[0].text).toBe('');
  });

  it('should handle many trailing newlines', function () {
    const res = flow.parse(cleanupComments('graph TD;\n A-->B\n\n'));

    const vert = flow.yy.getVertices();
    const edges = flow.yy.getEdges();

    expect(vert.get('A').id).toBe('A');
    expect(vert.get('B').id).toBe('B');
    expect(edges.length).toBe(1);
    expect(edges[0].start).toBe('A');
    expect(edges[0].end).toBe('B');
    expect(edges[0].type).toBe('arrow_point');
    expect(edges[0].text).toBe('');
  });

  it('should handle a comment with blank rows in-between', function () {
    const res = flow.parse(cleanupComments('graph TD;\n\n\n %% Comment\n A-->B;'));

    const vert = flow.yy.getVertices();
    const edges = flow.yy.getEdges();

    expect(vert.get('A').id).toBe('A');
    expect(vert.get('B').id).toBe('B');
    expect(edges.length).toBe(1);
    expect(edges[0].start).toBe('A');
    expect(edges[0].end).toBe('B');
    expect(edges[0].type).toBe('arrow_point');
    expect(edges[0].text).toBe('');
  });

  it('should handle a comment with mermaid flowchart code in them', function () {
    const res = flow.parse(
      cleanupComments(
        'graph TD;\n\n\n %% Test od>Odd shape]-->|Two line<br>edge comment|ro;\n A-->B;'
      )
    );

    const vert = flow.yy.getVertices();
    const edges = flow.yy.getEdges();

    expect(vert.get('A').id).toBe('A');
    expect(vert.get('B').id).toBe('B');
    expect(edges.length).toBe(1);
    expect(edges[0].start).toBe('A');
    expect(edges[0].end).toBe('B');
    expect(edges[0].type).toBe('arrow_point');
    expect(edges[0].text).toBe('');
  });
});