diff --git a/cypress/integration/rendering/sequencediagram.spec.js b/cypress/integration/rendering/sequencediagram.spec.js
index bb460418f..0ec283c16 100644
--- a/cypress/integration/rendering/sequencediagram.spec.js
+++ b/cypress/integration/rendering/sequencediagram.spec.js
@@ -52,6 +52,26 @@ context('Sequence diagram', () => {
{}
);
});
+ it('should handle line breaks and wrap annotations', () => {
+ imgSnapshotTest(
+ `
+ sequenceDiagram
+ participant Alice
+ participant Bob
+ participant John as John
Second Line
+ Alice ->> Bob: Hello Bob, how are you?
+ Bob-->>John: How about you John?
+ Note right of John: John thinks a long
long time, so long
that the text does
not fit on a row.
+ Bob-->Alice: Checking with John...
+ Note over John:wrap: John looks like he's still thinking, so Bob prods him a bit.
+ Bob-x John: Hey John -
we're still waiting to know
how you're doing
+ Note over John:nowrap: John's trying hard not to break his train of thought.
+ Bob-x John:wrap: John! Are you still debating about how you're doing? How long does it take??
+ Note over John: After a few more moments, John
finally snaps out of it.
+ `,
+ {}
+ );
+ })
it('should render loops with a slight margin', () => {
imgSnapshotTest(
`
diff --git a/src/diagrams/sequence/sequenceDiagram.spec.js b/src/diagrams/sequence/sequenceDiagram.spec.js
index 12e934ed1..6cb6d55c4 100644
--- a/src/diagrams/sequence/sequenceDiagram.spec.js
+++ b/src/diagrams/sequence/sequenceDiagram.spec.js
@@ -442,6 +442,87 @@ note right of 1: multiline
text
expect(messages[6].message).toBe('multiline
text');
expect(messages[7].message).toBe('multiline
text');
});
+ it('it should handle notes and messages without wrap specified', function () {
+ const str = `
+sequenceDiagram
+participant 1
+participant 2
+participant 3
+participant 4
+1->>2: single-line text
+note right of 2: single-line text
+2->>3:nowrap: single-line text
+note right of 3:nowrap: single-line text
+3->>4: multiline
text
+note right of 4: multiline
text
+4->>1:nowrap: multiline
text
+note right of 1:nowrap: multiline
text
+`;
+
+ mermaidAPI.parse(str);
+
+ const messages = parser.yy.getMessages();
+ expect(messages[0].message).toBe('single-line text');
+ expect(messages[1].message).toBe('single-line text');
+ expect(messages[2].message).toBe('single-line text');
+ expect(messages[3].message).toBe('single-line text');
+ expect(messages[4].message).toBe('multiline
text');
+ expect(messages[5].message).toBe('multiline
text');
+ expect(messages[6].message).toBe('multiline
text');
+ expect(messages[7].message).toBe('multiline
text');
+
+ // wrap indicates whether wrap is specified
+ expect(messages[0].wrap).toBe(false);
+ expect(messages[1].wrap).toBe(false);
+ expect(messages[2].wrap).toBe(false);
+ expect(messages[3].wrap).toBe(false);
+ expect(messages[4].wrap).toBe(false);
+ expect(messages[5].wrap).toBe(false);
+ expect(messages[6].wrap).toBe(false);
+ expect(messages[7].wrap).toBe(false);
+ })
+ it('it should handle notes and messages with wrap specified', function () {
+ const str = `
+sequenceDiagram
+participant 1
+participant 2
+participant 3
+participant 4
+1->>2:wrap: single-line text
+note right of 2:wrap: single-line text
+2->>3:wrap: multiline
text
+note right of 3:wrap: multiline
text
+`;
+
+ mermaidAPI.parse(str);
+
+ const messages = parser.yy.getMessages();
+ expect(messages[0].message).toBe('single-line text');
+ expect(messages[1].message).toBe('single-line text');
+ expect(messages[2].message).toBe('multiline
text');
+ expect(messages[3].message).toBe('multiline
text');
+ expect(messages[0].wrap).toBe(true);
+ expect(messages[1].wrap).toBe(true);
+ expect(messages[2].wrap).toBe(true);
+ expect(messages[3].wrap).toBe(true);
+ })
+ it('it should handle notes and messages with nowrap or line breaks', function () {
+ const str = `
+sequenceDiagram
+participant 1
+participant 2
+1->>2: single-line text
+note right of 2: single-line text
+`;
+
+ mermaidAPI.parse(str);
+
+ const messages = parser.yy.getMessages();
+ expect(messages[0].message).toBe('single-line text');
+ expect(messages[1].message).toBe('single-line text');
+ expect(messages[0].wrap).toBe(false);
+ expect(messages[1].wrap).toBe(false);
+ })
it('it should handle notes over a single actor', function() {
const str = `
sequenceDiagram
diff --git a/src/diagrams/sequence/svgDraw.spec.js b/src/diagrams/sequence/svgDraw.spec.js
index c99b9b95b..cc54b7184 100644
--- a/src/diagrams/sequence/svgDraw.spec.js
+++ b/src/diagrams/sequence/svgDraw.spec.js
@@ -49,6 +49,58 @@ describe('svgDraw', function() {
expect(rect.attr).not.toHaveBeenCalledWith('class', expect.anything());
});
});
+ describe('drawText', function() {
+ it('it should append a single element', function() {
+ const svg = MockD3('svg');
+ svgDraw.drawText(svg, {
+ x: 10,
+ y: 10,
+ dy: '1em',
+ text: 'One fine text message',
+ class: 'noteText',
+ fontFamily: 'courier',
+ fontSize: '10px',
+ fontWeight: '500',
+ });
+ expect(svg.__children.length).toBe(1);
+ const text = svg.__children[0];
+ expect(text.__name).toBe('text');
+ expect(text.attr).toHaveBeenCalledWith('x', 10);
+ expect(text.attr).toHaveBeenCalledWith('y', 10);
+ expect(text.attr).toHaveBeenCalledWith('dy', '1em');
+ expect(text.attr).toHaveBeenCalledWith('class', 'noteText');
+ expect(text.text).toHaveBeenCalledWith('One fine text message');
+ expect(text.style).toHaveBeenCalledWith('font-family', 'courier');
+ expect(text.style).toHaveBeenCalledWith('font-size', '10px');
+ expect(text.style).toHaveBeenCalledWith('font-weight', '500');
+ });
+ it('it should append a multiple elements', function() {
+ const svg = MockD3('svg');
+ svgDraw.drawText(svg, {
+ x: 10,
+ y: 10,
+ text: 'One fine text message
with multiple
fine lines',
+ });
+ expect(svg.__children.length).toBe(3);
+ const text1 = svg.__children[0];
+ expect(text1.__name).toBe('text');
+ expect(text1.attr).toHaveBeenCalledWith('x', 10);
+ expect(text1.attr).toHaveBeenCalledWith('y', 10);
+ expect(text1.text).toHaveBeenCalledWith('One fine text message');
+
+ const text2 = svg.__children[1];
+ expect(text2.__name).toBe('text');
+ expect(text2.attr).toHaveBeenCalledWith('x', 10);
+ expect(text2.attr).toHaveBeenCalledWith('y', 10);
+ expect(text2.text).toHaveBeenCalledWith('with multiple');
+
+ const text3 = svg.__children[2];
+ expect(text3.__name).toBe('text');
+ expect(text3.attr).toHaveBeenCalledWith('x', 10);
+ expect(text3.attr).toHaveBeenCalledWith('y', 10);
+ expect(text3.text).toHaveBeenCalledWith('fine lines');
+ });
+ });
describe('drawBackgroundRect', function() {
it('it should append a rect before the previous element within a given bound', function() {
const svg = MockD3('svg');