Skip to content

Commit 2b85af2

Browse files
committed
Prevent diff
1 parent 35f3893 commit 2b85af2

File tree

6 files changed

+64
-0
lines changed

6 files changed

+64
-0
lines changed

src/formatter/formatProp.spec.ts

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -79,6 +79,7 @@ describe('formatProp', () => {
7979
useBooleanShorthandSyntax: true,
8080
tabStop: 2,
8181
};
82+
8283
formatPropValue.mockReturnValue('{true}');
8384

8485
expect(
@@ -98,6 +99,7 @@ describe('formatProp', () => {
9899
useBooleanShorthandSyntax: true,
99100
tabStop: 2,
100101
};
102+
101103
formatPropValue.mockReturnValue('{false}');
102104

103105
expect(
@@ -116,6 +118,7 @@ describe('formatProp', () => {
116118
useBooleanShorthandSyntax: false,
117119
tabStop: 2,
118120
};
121+
119122
formatPropValue.mockReturnValue('{true}');
120123

121124
expect(
@@ -135,6 +138,7 @@ describe('formatProp', () => {
135138
useBooleanShorthandSyntax: false,
136139
tabStop: 2,
137140
};
141+
138142
formatPropValue.mockReturnValue('{false}');
139143

140144
expect(
@@ -198,6 +202,7 @@ describe('formatProp', () => {
198202
useBooleanShorthandSyntax: true,
199203
tabStop: 2,
200204
};
205+
201206
formatPropValue.mockReturnValue('"MockedPropValue"');
202207

203208
expect(

src/formatter/formatProp.ts

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import spacer from './spacer';
22
import formatPropValue from './formatPropValue';
33
import type { Options } from './../options';
4+
45
export default (
56
name: string,
67
hasValue: boolean,
@@ -22,8 +23,11 @@ export default (
2223
}
2324

2425
const usedValue = hasValue ? value : defaultValue;
26+
2527
const { useBooleanShorthandSyntax, tabStop } = options;
28+
2629
const formattedPropValue = formatPropValue(usedValue, inline, lvl, options);
30+
2731
let attributeFormattedInline = ' ';
2832
let attributeFormattedMultiline = `\n${spacer(lvl + 1, tabStop)}`;
2933
const isMultilineAttribute = formattedPropValue.includes('\n');

src/formatter/formatPropValue.spec.tsx

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,39 +3,48 @@ import formatPropValue from './formatPropValue';
33
import parseReactElement from './../parser/parseReactElement';
44
import formatTreeNode from './formatTreeNode';
55
import formatComplexDataStructure from './formatComplexDataStructure';
6+
67
jest.mock('./../parser/parseReactElement');
8+
79
jest.mock('./formatTreeNode', () =>
810
jest.fn().mockReturnValue('<MockedFormatTreeNodeResult />')
911
);
12+
1013
jest.mock('./formatComplexDataStructure', () =>
1114
jest.fn().mockReturnValue('*Mocked formatComplexDataStructure result*')
1215
);
16+
1317
describe('formatPropValue', () => {
1418
beforeEach(() => {
1519
jest.clearAllMocks();
1620
});
21+
1722
it('should format an integer prop value', () => {
1823
expect(formatPropValue(42, false, 0, {})).toBe('{42}');
1924
});
25+
2026
it('should escape double quote on prop value of string type', () => {
2127
expect(formatPropValue('Hello "Jonh"!', false, 0, {})).toBe(
2228
'"Hello &quot;Jonh&quot;!"'
2329
);
2430
});
31+
2532
it('should format a symbol prop value', () => {
2633
expect(formatPropValue(Symbol('Foo'), false, 0, {})).toBe(
2734
"{Symbol('Foo')}"
2835
);
2936
// eslint-disable-next-line symbol-description
3037
expect(formatPropValue(Symbol(), false, 0, {})).toBe('{Symbol()}');
3138
});
39+
3240
it('should replace a function prop value by a an empty generic function by default', () => {
3341
const doThings = (a) => a * 2;
3442

3543
expect(formatPropValue(doThings, false, 0, {})).toBe(
3644
'{function noRefCheck() {}}'
3745
);
3846
});
47+
3948
it('should show the function prop value implementation if "showFunctions" option is true', () => {
4049
const doThings = (a) => a * 2;
4150

@@ -45,11 +54,13 @@ describe('formatPropValue', () => {
4554
})
4655
).toBe('{function doThings(a) {return a * 2;}}');
4756
});
57+
4858
it('should format the function prop value with the "functionValue" option', () => {
4959
const doThings = (a) => a * 2;
5060

5161
const functionValue = (fn) => {
5262
expect(fn).toBe(doThings);
63+
5364
return 'function Myfunction() {}';
5465
};
5566

@@ -66,23 +77,27 @@ describe('formatPropValue', () => {
6677
})
6778
).toBe('{function Myfunction() {}}');
6879
});
80+
6981
it('should parse and format a react element prop value', () => {
7082
expect(formatPropValue(<div />, false, 0, {})).toBe(
7183
'{<MockedFormatTreeNodeResult />}'
7284
);
7385
expect(parseReactElement).toHaveBeenCalledTimes(1);
7486
expect(formatTreeNode).toHaveBeenCalledTimes(1);
7587
});
88+
7689
it('should format a date prop value', () => {
7790
expect(
7891
formatPropValue(new Date('2017-01-01T11:00:00.000Z'), false, 0, {})
7992
).toBe('{new Date("2017-01-01T11:00:00.000Z")}');
8093
});
94+
8195
it('should format an invalid date prop value', () => {
8296
expect(formatPropValue(new Date(NaN), false, 0, {})).toBe(
8397
'{new Date(NaN)}'
8498
);
8599
});
100+
86101
it('should format an object prop value', () => {
87102
expect(
88103
formatPropValue(
@@ -96,22 +111,27 @@ describe('formatPropValue', () => {
96111
).toBe('{*Mocked formatComplexDataStructure result*}');
97112
expect(formatComplexDataStructure).toHaveBeenCalledTimes(1);
98113
});
114+
99115
it('should format an array prop value', () => {
100116
expect(formatPropValue(['a', 'b', 'c'], false, 0, {})).toBe(
101117
'{*Mocked formatComplexDataStructure result*}'
102118
);
103119
expect(formatComplexDataStructure).toHaveBeenCalledTimes(1);
104120
});
121+
105122
it('should format a boolean prop value', () => {
106123
expect(formatPropValue(true, false, 0, {})).toBe('{true}');
107124
expect(formatPropValue(false, false, 0, {})).toBe('{false}');
108125
});
126+
109127
it('should format null prop value', () => {
110128
expect(formatPropValue(null, false, 0, {})).toBe('{null}');
111129
});
130+
112131
it('should format undefined prop value', () => {
113132
expect(formatPropValue(undefined, false, 0, {})).toBe('{undefined}');
114133
});
134+
115135
it('should call the ".toString()" method on object instance prop value', () => {
116136
expect(formatPropValue(new Set(['a', 'b', 42]), false, 0, {})).toBe(
117137
'{[object Set]}'

src/formatter/formatReactElementNode.spec.tsx

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import React from 'react';
22
import formatReactElementNode from './formatReactElementNode';
3+
34
const defaultOptions = {
45
filterProps: [],
56
showDefaultProps: true,
@@ -8,6 +9,7 @@ const defaultOptions = {
89
useBooleanShorthandSyntax: true,
910
sortProps: true,
1011
};
12+
1113
describe('formatReactElementNode', () => {
1214
it('should format a react element with a string a children', () => {
1315
const tree = {
@@ -22,10 +24,12 @@ describe('formatReactElementNode', () => {
2224
},
2325
],
2426
};
27+
2528
expect(formatReactElementNode(tree, false, 0, defaultOptions)).toEqual(`<h1>
2629
Hello world
2730
</h1>`);
2831
});
32+
2933
it('should format a single depth react element', () => {
3034
const tree = {
3135
type: 'ReactElement',
@@ -38,10 +42,12 @@ describe('formatReactElementNode', () => {
3842
},
3943
childrens: [],
4044
};
45+
4146
expect(formatReactElementNode(tree, false, 0, defaultOptions)).toEqual(
4247
'<aaa foo="41" />'
4348
);
4449
});
50+
4551
it('should format a react element with an object as props', () => {
4652
const tree = {
4753
type: 'ReactElement',
@@ -64,6 +70,7 @@ describe('formatReactElementNode', () => {
6470
},
6571
childrens: [],
6672
};
73+
6774
expect(formatReactElementNode(tree, false, 0, defaultOptions)).toEqual(`<div
6875
a={{
6976
aa: '1',
@@ -73,6 +80,7 @@ describe('formatReactElementNode', () => {
7380
}}
7481
/>`);
7582
});
83+
7684
it('should format a react element with another react element as props', () => {
7785
const tree = {
7886
type: 'ReactElement',
@@ -85,10 +93,12 @@ describe('formatReactElementNode', () => {
8593
},
8694
childrens: [],
8795
};
96+
8897
expect(formatReactElementNode(tree, false, 0, defaultOptions)).toEqual(
8998
'<div a={<span b="42" />} />'
9099
);
91100
});
101+
92102
it('should format a react element with multiline children', () => {
93103
const tree = {
94104
type: 'ReactElement',
@@ -102,19 +112,22 @@ describe('formatReactElementNode', () => {
102112
},
103113
],
104114
};
115+
105116
expect(formatReactElementNode(tree, false, 0, defaultOptions))
106117
.toEqual(`<div>
107118
first line
108119
second line
109120
third line
110121
</div>`);
122+
111123
expect(formatReactElementNode(tree, false, 2, defaultOptions))
112124
.toEqual(`<div>
113125
first line
114126
second line
115127
third line
116128
</div>`);
117129
});
130+
118131
it('should allow filtering props by function', () => {
119132
const tree = {
120133
type: 'ReactElement',
@@ -135,6 +148,7 @@ describe('formatReactElementNode', () => {
135148
...defaultOptions,
136149
filterProps: (val, key) => !key.startsWith('on'),
137150
};
151+
138152
expect(formatReactElementNode(tree, false, 0, options))
139153
.toEqual(`<h1 className="myClass">
140154
Hello world

src/formatter/formatReactElementNode.ts

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -119,20 +119,26 @@ export default (
119119
let outInlineAttr = out;
120120
let outMultilineAttr = out;
121121
let containsMultilineAttr = false;
122+
122123
const visibleAttributeNames: Array<string> = [];
124+
123125
const propFilter = createPropFilter(props, filterProps);
126+
124127
Object.keys(props)
125128
.filter(propFilter)
126129
.filter(onlyPropsWithOriginalValue(defaultProps, props))
127130
.forEach((propName) => visibleAttributeNames.push(propName));
131+
128132
Object.keys(defaultProps)
129133
.filter(propFilter)
130134
.filter(() => showDefaultProps)
131135
.filter(
132136
(defaultPropName) => !visibleAttributeNames.includes(defaultPropName)
133137
)
134138
.forEach((defaultPropName) => visibleAttributeNames.push(defaultPropName));
139+
135140
const attributes = sortPropsByNames(sortProps)(visibleAttributeNames);
141+
136142
attributes.forEach((attributeName) => {
137143
const {
138144
attributeFormattedInline,
@@ -156,6 +162,7 @@ export default (
156162
outInlineAttr += attributeFormattedInline;
157163
outMultilineAttr += attributeFormattedMultiline;
158164
});
165+
159166
outMultilineAttr += `\n${spacer(lvl, tabStop)}`;
160167

161168
if (
@@ -176,6 +183,7 @@ export default (
176183

177184
if (childrens && childrens.length > 0) {
178185
const newLvl = lvl + 1;
186+
179187
out += '>';
180188

181189
if (!inline) {

0 commit comments

Comments
 (0)