diff --git a/cypress/integration/rendering/flowchart-v2.spec.js b/cypress/integration/rendering/flowchart-v2.spec.js
index 9ce39b3e6..796fc6d95 100644
--- a/cypress/integration/rendering/flowchart-v2.spec.js
+++ b/cypress/integration/rendering/flowchart-v2.spec.js
@@ -1231,15 +1231,18 @@ class link myClass
);
});
- it('should not create foreignObject elements when htmlLabels disabled via global config', () => {
- renderGraph(
- `flowchart TD
- A["Node with
HTML"] -- "edge
label" --> B["Another node"]
+ it('should not render with htmlLabels when disabled via flowchart config, even when enabled in global config', () => {
+ imgSnapshotTest(
+ `flowchart LR
+ A["HTML label
with breaks"] --> B["Another label"]
C --> D
`,
- { htmlLabels: false }
+ { htmlLabels: true, flowchart: { htmlLabels: false } },
+ undefined,
+ ($svg) => {
+ expect($svg.find('foreignObject').length).to.equal(0);
+ }
);
- cy.get('svg foreignObject').should('not.exist');
});
it('should create foreignObject elements when htmlLabels enabled', () => {
diff --git a/packages/mermaid/src/diagrams/flowchart/flowDiagram.ts b/packages/mermaid/src/diagrams/flowchart/flowDiagram.ts
index 80ddebb76..1fc7de529 100644
--- a/packages/mermaid/src/diagrams/flowchart/flowDiagram.ts
+++ b/packages/mermaid/src/diagrams/flowchart/flowDiagram.ts
@@ -21,7 +21,7 @@ export const diagram = {
if (cnf.layout) {
setConfig({ layout: cnf.layout });
}
- cnf.flowchart.htmlLabels = cnf?.htmlLabels ?? cnf.flowchart?.htmlLabels;
+ cnf.flowchart.htmlLabels = cnf.flowchart?.htmlLabels ?? cnf?.htmlLabels;
cnf.flowchart.arrowMarkerAbsolute = cnf.arrowMarkerAbsolute;
setConfig({
flowchart: {
diff --git a/packages/mermaid/src/rendering-util/rendering-elements/shapes/util.ts b/packages/mermaid/src/rendering-util/rendering-elements/shapes/util.ts
index 52471ecc0..37cf9697d 100644
--- a/packages/mermaid/src/rendering-util/rendering-elements/shapes/util.ts
+++ b/packages/mermaid/src/rendering-util/rendering-elements/shapes/util.ts
@@ -13,7 +13,7 @@ export const labelHelper = async (
_classes?: string
) => {
let cssClasses;
- const useHtmlLabels = node.useHtmlLabels || evaluate(getConfig()?.htmlLabels);
+ const useHtmlLabels = node.useHtmlLabels || evaluate(getConfig()?.flowchart?.htmlLabels);
if (!_classes) {
cssClasses = 'node default';
} else {