Merge pull request #1153 from GDFaber/bug/702_br_tags_in_sequence_diagrams
Bug/702 br tags in sequence diagrams
This commit is contained in:
commit
d96b79a9ba
|
@ -2,8 +2,8 @@
|
|||
|
||||
import { imgSnapshotTest } from '../../helpers/util';
|
||||
|
||||
context('Aliasing', () => {
|
||||
it('should render a simple sequence diagrams', () => {
|
||||
context('Sequence diagram', () => {
|
||||
it('should render a simple sequence diagram', () => {
|
||||
imgSnapshotTest(
|
||||
`
|
||||
sequenceDiagram
|
||||
|
@ -32,6 +32,23 @@ context('Aliasing', () => {
|
|||
{}
|
||||
);
|
||||
});
|
||||
it('should handle different line breaks', () => {
|
||||
imgSnapshotTest(
|
||||
`
|
||||
sequenceDiagram
|
||||
participant 1 as multiline<br>using #lt;br#gt;
|
||||
participant 2 as multiline<br/>using #lt;br/#gt;
|
||||
participant 3 as multiline<br />using #lt;br /#gt;
|
||||
1->>2: multiline<br>using #lt;br#gt;
|
||||
note right of 2: multiline<br>using #lt;br#gt;
|
||||
2->>3: multiline<br/>using #lt;br/#gt;
|
||||
note right of 3: multiline<br/>using #lt;br/#gt;
|
||||
3->>1: multiline<br />using #lt;br /#gt;
|
||||
note right of 1: multiline<br />using #lt;br /#gt;
|
||||
`,
|
||||
{}
|
||||
);
|
||||
});
|
||||
context('background rects', () => {
|
||||
it('should render a single and nested rects', () => {
|
||||
imgSnapshotTest(
|
||||
|
|
|
@ -356,6 +356,18 @@ and
|
|||
Alice -->> John: Parallel message 2
|
||||
end
|
||||
</div>
|
||||
<div class="mermaid">
|
||||
sequenceDiagram
|
||||
participant 1 as multiline<br>using #lt;br#gt;
|
||||
participant 2 as multiline<br/>using #lt;br/#gt;
|
||||
participant 3 as multiline<br />using #lt;br /#gt;
|
||||
1->>2: multiline<br>using #lt;br#gt;
|
||||
note right of 2: multiline<br>using #lt;br#gt;
|
||||
2->>3: multiline<br/>using #lt;br/#gt;
|
||||
note right of 3: multiline<br/>using #lt;br/#gt;
|
||||
3->>1: multiline<br />using #lt;br /#gt;
|
||||
note right of 1: multiline<br />using #lt;br /#gt;
|
||||
</div>
|
||||
|
||||
<hr/>
|
||||
|
||||
|
|
|
@ -333,6 +333,34 @@ describe('when parsing a sequenceDiagram', function() {
|
|||
expect(messages[0].from).toBe('Alice');
|
||||
expect(messages[2].from).toBe('John');
|
||||
});
|
||||
it('it should handle different line breaks', function() {
|
||||
const str =
|
||||
'sequenceDiagram\n' +
|
||||
'participant 1 as multiline<br>text\n' +
|
||||
'participant 2 as multiline<br/>text\n' +
|
||||
'participant 3 as multiline<br />text\n' +
|
||||
'1->>2: multiline<br>text\n' +
|
||||
'note right of 2: multiline<br>text\n' +
|
||||
'2->>3: multiline<br/>text\n' +
|
||||
'note right of 3: multiline<br/>text\n' +
|
||||
'3->>1: multiline<br />text\n' +
|
||||
'note right of 1: multiline<br />text\n';
|
||||
|
||||
parser.parse(str);
|
||||
|
||||
const actors = parser.yy.getActors();
|
||||
expect(actors['1'].description).toBe('multiline<br>text');
|
||||
expect(actors['2'].description).toBe('multiline<br/>text');
|
||||
expect(actors['3'].description).toBe('multiline<br />text');
|
||||
|
||||
const messages = parser.yy.getMessages();
|
||||
expect(messages[0].message).toBe('multiline<br>text');
|
||||
expect(messages[1].message).toBe('multiline<br>text');
|
||||
expect(messages[2].message).toBe('multiline<br/>text');
|
||||
expect(messages[3].message).toBe('multiline<br/>text');
|
||||
expect(messages[4].message).toBe('multiline<br />text');
|
||||
expect(messages[5].message).toBe('multiline<br />text');
|
||||
});
|
||||
it('it should handle notes over a single actor', function() {
|
||||
const str =
|
||||
'sequenceDiagram\n' + 'Alice->Bob: Hello Bob, how are you?\n' + 'Note over Bob: Bob thinks\n';
|
||||
|
|
|
@ -168,7 +168,7 @@ export const bounds = {
|
|||
|
||||
const _drawLongText = (text, x, y, g, width) => {
|
||||
let textHeight = 0;
|
||||
const lines = text.split(/<br\/?>/gi);
|
||||
const lines = text.split(/<br ?\/?>/gi);
|
||||
for (const line of lines) {
|
||||
const textObj = svgDraw.getTextObj();
|
||||
textObj.x = x;
|
||||
|
@ -233,7 +233,7 @@ const drawMessage = function(elem, startx, stopx, verticalPos, msg, sequenceInde
|
|||
let textElem;
|
||||
let counterBreaklines = 0;
|
||||
let breaklineOffset = 17;
|
||||
const breaklines = msg.message.split(/<br\/?>/gi);
|
||||
const breaklines = msg.message.split(/<br ?\/?>/gi);
|
||||
for (const breakline of breaklines) {
|
||||
textElem = g
|
||||
.append('text') // text label for the x axis
|
||||
|
|
|
@ -18,7 +18,7 @@ export const drawRect = function(elem, rectData) {
|
|||
|
||||
export const drawText = function(elem, textData) {
|
||||
// Remove and ignore br:s
|
||||
const nText = textData.text.replace(/<br\/?>/gi, ' ');
|
||||
const nText = textData.text.replace(/<br ?\/?>/gi, ' ');
|
||||
|
||||
const textElem = elem.append('text');
|
||||
textElem.attr('x', textData.x);
|
||||
|
@ -321,7 +321,7 @@ const _drawTextCandidateFunc = (function() {
|
|||
function byTspan(content, g, x, y, width, height, textAttrs, conf) {
|
||||
const { actorFontSize, actorFontFamily } = conf;
|
||||
|
||||
const lines = content.split(/<br\/?>/gi);
|
||||
const lines = content.split(/<br ?\/?>/gi);
|
||||
for (let i = 0; i < lines.length; i++) {
|
||||
const dy = i * actorFontSize - (actorFontSize * (lines.length - 1)) / 2;
|
||||
const text = g
|
||||
|
|
Loading…
Reference in New Issue