Skip to content

Commit

Permalink
Merge 9a87ff6 into 06cb09c
Browse files Browse the repository at this point in the history
  • Loading branch information
@knsv
knsv committed Nov 20, 2019
2 parents 06cb09c + 9a87ff6 commit 7b8b100
Show file tree
Hide file tree
Showing 10 changed files with 137 additions and 33 deletions.
6 changes: 6 additions & 0 deletions cypress/helpers/util.js
View file
Expand Up @@ -26,3 +26,9 @@ export const imgSnapshotTest = (graphStr, options, api) => {
cy.get('svg');
cy.percySnapshot();
};

export const renderGraph = (graphStr, options, api) => {
const url = mermaidUrl(graphStr, options, api);

cy.visit(url);
};
100 changes: 100 additions & 0 deletions cypress/integration/other/configuration.spec.js
View file
@@ -0,0 +1,100 @@
import { renderGraph } from '../../helpers/util';
/* eslint-env jest */
describe('Configuration', () => {
describe('arrowMarkerAbsolute', () => {
it('should handle default value false of arrowMarkerAbsolute', () => {
renderGraph(
`graph TD
A[Christmas] -->|Get money| B(Go shopping)
B --> C{Let me think}
C -->|One| D[Laptop]
C -->|Two| E[iPhone]
C -->|Three| F[fa:fa-car Car]
`,
{ }
);

// Check the marker-end property to make sure it is properly set to
// start with #
cy.get('.edgePath path').first().should('have.attr', 'marker-end')
.should('exist')
.and('include', 'url(#');
});
it('should handle default value false of arrowMarkerAbsolute', () => {
renderGraph(
`graph TD
A[Christmas] -->|Get money| B(Go shopping)
B --> C{Let me think}
C -->|One| D[Laptop]
C -->|Two| E[iPhone]
C -->|Three| F[fa:fa-car Car]
`,
{ }
);

// Check the marker-end property to make sure it is properly set to
// start with #
cy.get('.edgePath path').first().should('have.attr', 'marker-end')
.should('exist')
.and('include', 'url(#');
});
it('should handle arrowMarkerAbsolute excplicitly set to false', () => {
renderGraph(
`graph TD
A[Christmas] -->|Get money| B(Go shopping)
B --> C{Let me think}
C -->|One| D[Laptop]
C -->|Two| E[iPhone]
C -->|Three| F[fa:fa-car Car]
`,
{
arrowMarkerAbsolute: false
}
);

// Check the marker-end property to make sure it is properly set to
// start with #
cy.get('.edgePath path').first().should('have.attr', 'marker-end')
.should('exist')
.and('include', 'url(#');
});
it('should handle arrowMarkerAbsolute excplicitly set to "false" as false', () => {
renderGraph(
`graph TD
A[Christmas] -->|Get money| B(Go shopping)
B --> C{Let me think}
C -->|One| D[Laptop]
C -->|Two| E[iPhone]
C -->|Three| F[fa:fa-car Car]
`,
{
arrowMarkerAbsolute: "false"
}
);

// Check the marker-end property to make sure it is properly set to
// start with #
cy.get('.edgePath path').first().should('have.attr', 'marker-end')
.should('exist')
.and('include', 'url(#');
});
it('should handle arrowMarkerAbsolute set to true', () => {
renderGraph(
`graph TD
A[Christmas] -->|Get money| B(Go shopping)
B --> C{Let me think}
C -->|One| D[Laptop]
C -->|Two| E[iPhone]
C -->|Three| F[fa:fa-car Car]
`,
{
arrowMarkerAbsolute: true
}
);

cy.get('.edgePath path').first().should('have.attr', 'marker-end')
.should('exist')
.and('include', 'url(http://localhost');
});
});
});
10 changes: 5 additions & 5 deletions cypress/integration/other/interaction.spec.js
View file
Expand Up @@ -16,7 +16,7 @@ describe('Interaction', () => {
cy.viewport(1440, 1024);
cy.visit(url);
cy.get('body')
.find('g#mermaid-dom-id-1Function')
.find('g[id="1Function"]')
.click();

cy.get('.created-by-click').should('have.text', 'Clicked By Flow');
Expand All @@ -38,7 +38,7 @@ describe('Interaction', () => {
cy.viewport(1440, 1024);
cy.visit(url);
cy.get('body')
.find('g#mermaid-dom-id-2URL')
.find('g[id="2URL"]')
.click();

cy.location().should(location => {
Expand Down Expand Up @@ -108,7 +108,7 @@ describe('Interaction', () => {
cy.viewport(1440, 1024);
cy.visit(url);
cy.get('body')
.find('g#mermaid-dom-id-1Function')
.find('g[id="1Function"]')
.click();

cy.get('.created-by-click').should('not.have.text', 'Clicked By Flow');
Expand All @@ -130,7 +130,7 @@ describe('Interaction', () => {
cy.viewport(1440, 1024);
cy.visit(url);
cy.get('body')
.find('g#mermaid-dom-id-2URL')
.find('g[id="2URL"]')
.click();

cy.location().should(location => {
Expand Down Expand Up @@ -200,7 +200,7 @@ describe('Interaction', () => {
cy.viewport(1440, 1024);
cy.visit(url);
cy.get('body')
.find('g#mermaid-dom-id-1Function')
.find('g[id="1Function"]')
.click();

cy.get('.created-by-click').should('not.have.text', 'Clicked By Flow');
Expand Down
5 changes: 2 additions & 3 deletions cypress/platform/e2e.html
View file
Expand Up @@ -4,9 +4,8 @@
<link href="https://fonts.googleapis.com/css?family=Mansalva&display=swap" rel="stylesheet" />
<style>
body {
/* font-family: 'Mansalva', cursive;
font-family: 'Mansalva', cursive; */
font-family: 'times';
/* font-family: 'Mansalva', cursive;*/
font-family: 'Mansalva', cursive;
}
/* .mermaid-main-font {
font-family: "trebuchet ms", verdana, arial;
Expand Down
3 changes: 2 additions & 1 deletion src/diagrams/flowchart/flowDb.js
View file
Expand Up @@ -4,7 +4,8 @@ import { logger } from '../../logger';
import utils from '../../utils';
import { getConfig } from '../../config';

const MERMAID_DOM_ID_PREFIX = 'mermaid-dom-id-';
// const MERMAID_DOM_ID_PREFIX = 'mermaid-dom-id-';
const MERMAID_DOM_ID_PREFIX = '';

const config = getConfig();
let vertices = {};
Expand Down
6 changes: 3 additions & 3 deletions src/diagrams/flowchart/flowRenderer.js
View file
Expand Up @@ -460,8 +460,8 @@ export const draw = function(text, id) {
subG = subGraphs[i];

if (subG.title !== 'undefined') {
const clusterRects = document.querySelectorAll('#' + id + ' #' + subG.id + ' rect');
const clusterEl = document.querySelectorAll('#' + id + ' #' + subG.id);
const clusterRects = document.querySelectorAll('#' + id + ' [id="' + subG.id + '"] rect');
const clusterEl = document.querySelectorAll('#' + id + ' [id="' + subG.id + '"]');

const xPos = clusterRects[0].x.baseVal.value;
const yPos = clusterRects[0].y.baseVal.value;
Expand All @@ -475,7 +475,7 @@ export const draw = function(text, id) {

// Add label rects for non html labels
if (!conf.htmlLabels) {
const labels = document.querySelectorAll('#' + id + ' .edgeLabel .label');
const labels = document.querySelectorAll('[id="' + id + '"] .edgeLabel .label');
for (let k = 0; k < labels.length; k++) {
const label = labels[k];

Expand Down
6 changes: 3 additions & 3 deletions src/diagrams/flowchart/parser/flow-singlenode.spec.js
View file
Expand Up @@ -168,7 +168,7 @@ describe('[Singlenodes] when parsing', () => {
const edges = flow.parser.yy.getEdges();

expect(edges.length).toBe(0);
expect(vert['mermaid-dom-id-1'].text).toBe('1');
expect(vert['1'].text).toBe('1');
});

it('should handle a single node with a single digit in a subgraph', function() {
Expand All @@ -180,7 +180,7 @@ describe('[Singlenodes] when parsing', () => {
const edges = flow.parser.yy.getEdges();

expect(edges.length).toBe(0);
expect(vert['mermaid-dom-id-1'].text).toBe('1');
expect(vert['1'].text).toBe('1');
});

it('should handle a single node with alphanumerics starting on a num', function() {
Expand All @@ -191,7 +191,7 @@ describe('[Singlenodes] when parsing', () => {
const edges = flow.parser.yy.getEdges();

expect(edges.length).toBe(0);
expect(vert['mermaid-dom-id-1id'].styles.length).toBe(0);
expect(vert['1id'].styles.length).toBe(0);
});

it('should handle a single node with alphanumerics containing a minus sign', function() {
Expand Down
2 changes: 1 addition & 1 deletion src/diagrams/flowchart/parser/subgraph.spec.js
View file
Expand Up @@ -83,7 +83,7 @@ describe('when parsing subgraphs', function() {
const subgraph = subgraphs[0];
expect(subgraph.nodes.length).toBe(1);
expect(subgraph.nodes[0]).toBe('A');
expect(subgraph.id).toBe('mermaid-dom-id-1test');
expect(subgraph.id).toBe('1test');
});

it('should handle subgraphs1', function() {
Expand Down
2 changes: 0 additions & 2 deletions src/diagrams/state/stateRenderer.js
View file
Expand Up @@ -92,8 +92,6 @@ export const draw = function(text, id) {
const padding = conf.padding;
const bounds = diagram.node().getBBox();

console.warn(bounds);

const width = bounds.width + padding * 2;
const height = bounds.height + padding * 2;

Expand Down
30 changes: 15 additions & 15 deletions src/mermaidAPI.js
View file
Expand Up @@ -585,23 +585,23 @@ const render = function(id, txt, cb, container) {
.selectAll('foreignobject > *')
.attr('xmlns', 'http://www.w3.org/1999/xhtml');

let url = '';
if (config.arrowMarkerAbsolute) {
url =
window.location.protocol +
'//' +
window.location.host +
window.location.pathname +
window.location.search;
url = url.replace(/\(/g, '\\(');
url = url.replace(/\)/g, '\\)');
}
// if (config.arrowMarkerAbsolute) {
// url =
// window.location.protocol +
// '//' +
// window.location.host +
// window.location.pathname +
// window.location.search;
// url = url.replace(/\(/g, '\\(');
// url = url.replace(/\)/g, '\\)');
// }

// Fix for when the base tag is used
let svgCode = d3
.select('#d' + id)
.node()
.innerHTML.replace(/url\(#arrowhead/g, 'url(' + url + '#arrowhead', 'g');
let svgCode = d3.select('#d' + id).node().innerHTML;

if (!config.arrowMarkerAbsolute || config.arrowMarkerAbsolute === 'false') {
svgCode = svgCode.replace(/marker-end="url\(.*?#/g, 'marker-end="url(#', 'g');
}

svgCode = decodeEntities(svgCode);

Expand Down

0 comments on commit 7b8b100

Please sign in to comment.