mirrors
/
mermaid
mirror of https://github.com/mermaid-js/mermaid.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

various fixes + add unit tests for parsed styles

This commit is contained in:
ilyes-ced 2024-02-07 00:21:33 +00:00
parent 2640120be8
commit 17959f648a
5 changed files with 79 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
cypress/integration/rendering/quadrantChart.spec.js
View File

@ -240,11 +240,11 @@ describe('Quadrant Chart', () => {
quadrant-4 May be improved
Campaign A: [0.3, 0.6] radius: 20
Campaign B: [0.45, 0.23] color: #ff0000
Campaign C: [0.57, 0.69] stroke_color: #ff00ff
Campaign D: [0.78, 0.34] stroke_width: 3px
Campaign E: [0.40, 0.34] radius: 20, color: #ff0000, stroke_color: #ff00ff, stroke_width: 3px
Campaign F: [0.35, 0.78] stroke_width: 3px, color: #ff0000, radius: 20, stroke_color: #ff00ff
Campaign G: [0.22, 0.22] stroke_width: 3px, color: #309708, radius: 20, stroke_color: #5060ff
Campaign C: [0.57, 0.69] stroke-color: #ff00ff
Campaign D: [0.78, 0.34] stroke-width: 3px
Campaign E: [0.40, 0.34] radius: 20, color: #ff0000, stroke-color: #ff00ff, stroke-width: 3px
Campaign F: [0.35, 0.78] stroke-width: 3px, color: #ff0000, radius: 20, stroke-color: #ff00ff
Campaign G: [0.22, 0.22] stroke-width: 3px, color: #309708, radius: 20, stroke-color: #5060ff
Campaign H: [0.22, 0.44]
`,
{}
@ -265,15 +265,13 @@ describe('Quadrant Chart', () => {
quadrant-4 May be improved
Campaign A:::class1: [0.3, 0.6] radius: 20
Campaign B: [0.45, 0.23] color: #ff0000
Campaign C: [0.57, 0.69] stroke_color: #ff00ff
Campaign D:::class2: [0.78, 0.34] stroke_width: 3px
Campaign E:::class2: [0.40, 0.34] radius: 20 color: #ff0000, stroke_color: #ff00ff, stroke_width: 3px
Campaign C: [0.57, 0.69] stroke-color: #ff00ff
Campaign D:::class2: [0.78, 0.34] stroke-width: 3px
Campaign E:::class2: [0.40, 0.34] radius: 20 color: #ff0000, stroke-color: #ff00ff, stroke-width: 3px
Campaign F:::class1: [0.35, 0.78]
classDef class1 color: #908342, radius : 10, stroke-color: #310085, stroke-width: 10px
classDef class2 color: #f00fff, radius : 10
`,
{}
`
);
cy.get('svg');
});
});

4
packages/mermaid/src/diagrams/quadrant-chart/parser/quadrant.jison
View File

@ -96,9 +96,9 @@ style: styleComponent
;
stylesOpt: style
{$$ = [$style]}
{$$ = [$style.trim()]}
| stylesOpt COMMA style
{$stylesOpt.push($style);$$ = $stylesOpt;}
{$stylesOpt.push($style.trim());$$ = $stylesOpt;}
;
classDefStatement

46
packages/mermaid/src/diagrams/quadrant-chart/parser/quadrant.jison.spec.ts
View File

@ -203,20 +203,34 @@ describe('Testing quadrantChart jison file', () => {
it('should be able to parse points', () => {
let str = 'quadrantChart\npoint1: [0.1, 0.4]';
expect(parserFnConstructor(str)).not.toThrow();
expect(mockDB.addPoint).toHaveBeenCalledWith({ text: 'point1', type: 'text' }, '0.1', '0.4');
expect(mockDB.addPoint).toHaveBeenCalledWith(
{ text: 'point1', type: 'text' },
'',
'0.1',
'0.4',
[]
);
clearMocks();
str = 'QuadRantChart \n Point1 : [0.1, 0.4] ';
expect(parserFnConstructor(str)).not.toThrow();
expect(mockDB.addPoint).toHaveBeenCalledWith({ text: 'Point1', type: 'text' }, '0.1', '0.4');
expect(mockDB.addPoint).toHaveBeenCalledWith(
{ text: 'Point1', type: 'text' },
'',
'0.1',
'0.4',
[]
);
clearMocks();
str = 'QuadRantChart \n "Point1 : (* +=[❤": [1, 0] ';
expect(parserFnConstructor(str)).not.toThrow();
expect(mockDB.addPoint).toHaveBeenCalledWith(
{ text: 'Point1 : (* +=[❤', type: 'text' },
'',
'1',
'0'
'0',
[]
);
clearMocks();
@ -255,16 +269,32 @@ describe('Testing quadrantChart jison file', () => {
expect(mockDB.setQuadrant4Text).toHaveBeenCalledWith({ text: 'Visionaries', type: 'text' });
expect(mockDB.addPoint).toHaveBeenCalledWith(
{ text: 'Microsoft', type: 'text' },
'',
'0.75',
'0.75'
'0.75',
[]
);
expect(mockDB.addPoint).toHaveBeenCalledWith(
{ text: 'Salesforce', type: 'text' },
'',
'0.55',
'0.60'
'0.60',
[]
);
expect(mockDB.addPoint).toHaveBeenCalledWith(
{ text: 'IBM', type: 'text' },
'',
'0.51',
'0.40',
[]
);
expect(mockDB.addPoint).toHaveBeenCalledWith(
{ text: 'Incorta', type: 'text' },
'',
'0.20',
'0.30',
[]
);
expect(mockDB.addPoint).toHaveBeenCalledWith({ text: 'IBM', type: 'text' }, '0.51', '0.40');
expect(mockDB.addPoint).toHaveBeenCalledWith({ text: 'Incorta', type: 'text' }, '0.20', '0.30');
});
it('should be able to parse the whole chart with point styling with all params or some params', () => {
@ -301,7 +331,7 @@ describe('Testing quadrantChart jison file', () => {
'',
'0.75',
'0.75',
'radius: 10'
['radius: 10']
);
expect(mockDB.addPoint).toHaveBeenCalledWith(
{ text: 'Salesforce', type: 'text' },

28
packages/mermaid/src/diagrams/quadrant-chart/quadrantDb.spec.ts Normal file
View File

@ -0,0 +1,28 @@
import quadrantDb from './quadrantDb.js';
describe('quadrant unit tests', () => {
it('should parse the styles array and return a StylesObject', () => {
const styles = ['radius: 10', 'color: #ff0000', 'stroke-color: #ff00ff', 'stroke-width: 10px'];
const result = quadrantDb.parseStyles(styles);
expect(result).toEqual({
radius: 10,
color: '#ff0000',
strokeColor: '#ff00ff',
strokeWidth: '10px',
});
});
it('should throw an error for unacceptable style name', () => {
const styles: string[] = ['test_name: value'];
expect(() => quadrantDb.parseStyles(styles)).toThrowError(
'stlye named test_name is unacceptable'
);
});
it('should return an empty StylesObject for an empty input array', () => {
const styles: string[] = [];
const result = quadrantDb.parseStyles(styles);
expect(result).toEqual({});
});
});

7
packages/mermaid/src/diagrams/quadrant-chart/quadrantDb.ts
View File

@ -92,11 +92,7 @@ function addPoint(textObj: LexTextObj, className: string, x: number, y: number,
}
function addClass(className: string, styles: string[]) {
const ss = parseStyles(styles);
if (Object.keys(ss).length === 0) {
throw new Error('class defintions require ss');
}
quadrantBuilder.addClass(className, ss);
quadrantBuilder.addClass(className, parseStyles(styles));
}
function setWidth(width: number) {
@ -150,6 +146,7 @@ export default {
setXAxisRightText,
setYAxisTopText,
setYAxisBottomText,
parseStyles,
addPoint,
addClass,
getQuadrantData,