Skip to content

Commit 344f5da

Browse files
chrisrzhouchrisrzhou
committed
refactor(tests): refactor and update tests.
1 parent 933f6de commit 344f5da

9 files changed

+312
-113
lines changed

‎package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -66,7 +66,7 @@
6666
"microbundle": "^0.12.2",
6767
"react": "^16.13.1",
6868
"react-test-renderer": "^16.13.1",
69-
"rehype-toc": "^3.0.1",
69+
"rehype-highlight": "^4.0.0",
7070
"typescript": "^4.0.2",
7171
"xo": "^0.33.1"
7272
},

‎tests/component/__snapshots__/content.test.js.snap

Lines changed: 53 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,52 @@
11
// Jest Snapshot v1, https://goo.gl/fbAQLP
22

3+
exports[`content code block content (sanitized) renders JS content to code block (.js extension) 1`] = `
4+
<div>
5+
<div>
6+
<pre
7+
className="language-js"
8+
>
9+
<code
10+
className="language-js"
11+
>
12+
function hello() {
13+
return "world";
14+
}
15+
</code>
16+
</pre>
17+
</div>
18+
</div>
19+
`;
20+
21+
exports[`content code block content (sanitized) renders JSON content to code block (.js extension) 1`] = `
22+
<div>
23+
<div>
24+
<pre
25+
className="language-json"
26+
>
27+
<code
28+
className="language-json"
29+
>
30+
{"one":2,"three":[true,false,null,"four",5],"six":{"7":"eight","nine":0}}
31+
</code>
32+
</pre>
33+
</div>
34+
</div>
35+
`;
36+
37+
exports[`content html content renders code block (.any extension) 1`] = `
38+
<div>
39+
<div>
40+
<pre>
41+
<code>
42+
&lt;blockquote&gt;&lt;strong&gt;some&lt;/strong&gt;
43+
content&lt;/blockquote&gt;
44+
</code>
45+
</pre>
46+
</div>
47+
</div>
48+
`;
49+
350
exports[`content html content renders html content (.html extension) 1`] = `
451
<div>
552
<div>
@@ -20,11 +67,14 @@ exports[`content html content renders html content (.md extension) 1`] = `
2067
</div>
2168
`;
2269

23-
exports[`content html content renders html content (.txt extension) 1`] = `
70+
exports[`content markdown content renders code block (.any extension) 1`] = `
2471
<div>
2572
<div>
26-
&lt;blockquote&gt;&lt;strong&gt;some&lt;/strong&gt;
27-
content&lt;/blockquote&gt;
73+
<pre>
74+
<code>
75+
&gt; **some** markdown content
76+
</code>
77+
</pre>
2878
</div>
2979
</div>
3080
`;
@@ -55,11 +105,3 @@ exports[`content markdown content renders markdown content (.md extension) 1`] =
55105
</div>
56106
</div>
57107
`;
58-
59-
exports[`content markdown content renders markdown content (.txt extension) 1`] = `
60-
<div>
61-
<div>
62-
&gt; **some** markdown content
63-
</div>
64-
</div>
65-
`;

‎tests/component/__snapshots__/plugins.test.js.snap

Lines changed: 99 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,107 @@
11
// Jest Snapshot v1, https://goo.gl/fbAQLP
22

3-
exports[`plugins applies post plugins 1`] = `
3+
exports[`plugins applies postPlugins 1`] = `
44
<div>
55
<div>
6-
<nav
7-
className="toc"
6+
<pre
7+
className="language-js"
88
>
9-
<ol
10-
className="custom-list custom-list-1"
11-
/>
12-
</nav>
13-
<blockquote>
14-
<strong>
15-
some
16-
</strong>
17-
18-
content
19-
</blockquote>
9+
<code
10+
className="hljs language-js"
11+
>
12+
<span
13+
className="hljs-function"
14+
>
15+
<span
16+
className="hljs-keyword"
17+
>
18+
function
19+
</span>
20+
21+
<span
22+
className="hljs-title"
23+
>
24+
hello
25+
</span>
26+
(
27+
<span
28+
className="hljs-params"
29+
/>
30+
)
31+
</span>
32+
{
33+
34+
<span
35+
className="hljs-keyword"
36+
>
37+
return
38+
</span>
39+
40+
<span
41+
className="hljs-string"
42+
>
43+
"world"
44+
</span>
45+
;
46+
}
47+
</code>
48+
</pre>
49+
</div>
50+
</div>
51+
`;
52+
53+
exports[`plugins applies prePlugins 1`] = `
54+
<div>
55+
<div>
56+
<pre
57+
className="language-js"
58+
>
59+
<code
60+
className="hljs language-js"
61+
>
62+
<span
63+
className="hljs-function"
64+
>
65+
<span
66+
className="hljs-keyword"
67+
>
68+
function
69+
</span>
70+
71+
<span
72+
className="hljs-title"
73+
>
74+
<mark
75+
className="a b"
76+
data-mark-id="a"
77+
id="a"
78+
>
79+
hello
80+
</mark>
81+
</span>
82+
(
83+
<span
84+
className="hljs-params"
85+
/>
86+
)
87+
</span>
88+
{
89+
90+
<span
91+
className="hljs-keyword"
92+
>
93+
return
94+
</span>
95+
96+
<span
97+
className="hljs-string"
98+
>
99+
"world"
100+
</span>
101+
;
102+
}
103+
</code>
104+
</pre>
20105
</div>
21106
</div>
22107
`;

‎tests/component/classname.test.js

Lines changed: 6 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -2,17 +2,16 @@ import React from 'react';
22
import renderer from 'react-test-renderer';
33

44
import { htmlContent } from '../fixtures';
5-
import Doc from '../../lib/component';
5+
import DocComponent from '../../lib/component';
66

77
describe('classname', () => {
88
it('applies custom CSS class name', () => {
9+
const options = {
10+
content: htmlContent,
11+
filename: 'doc.html',
12+
};
913
const tree = renderer
10-
.create(
11-
<Doc
12-
className="custom-doc"
13-
options={{ content: htmlContent, filename: 'doc.html' }}
14-
/>,
15-
)
14+
.create(<DocComponent className="custom-doc" options={options} />)
1615
.toJSON();
1716
expect(tree).toMatchSnapshot();
1817
});

‎tests/component/content.test.js

Lines changed: 69 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -1,60 +1,99 @@
11
import React from 'react';
22
import renderer from 'react-test-renderer';
33

4-
import Doc from '../../lib/component';
5-
import { markdownContent, htmlContent } from '../fixtures';
4+
import DocComponent from '../../lib/component';
5+
import {
6+
markdownContent,
7+
htmlContent,
8+
jsContent,
9+
jsonContent,
10+
} from '../fixtures';
11+
12+
const sanitizeSchema = {
13+
attributes: {
14+
'*': ['className', 'style'],
15+
mark: ['dataMarkId', 'id'],
16+
},
17+
clobberPrefix: '',
18+
};
619

720
describe('content', () => {
821
describe('html content', () => {
922
it('renders html content (.html extension)', () => {
10-
const tree = renderer
11-
.create(
12-
<Doc options={{ content: htmlContent, filename: 'doc.html' }} />,
13-
)
14-
.toJSON();
23+
const options = {
24+
content: htmlContent,
25+
filename: 'doc.html',
26+
};
27+
const tree = renderer.create(<DocComponent options={options} />).toJSON();
1528
expect(tree).toMatchSnapshot();
1629
});
1730

18-
it('renders html content (.txt extension)', () => {
19-
const tree = renderer
20-
.create(<Doc options={{ content: htmlContent, filename: 'doc.txt' }} />)
21-
.toJSON();
31+
it('renders code block (.any extension)', () => {
32+
const options = {
33+
content: htmlContent,
34+
filename: 'doc.any',
35+
};
36+
const tree = renderer.create(<DocComponent options={options} />).toJSON();
2237
expect(tree).toMatchSnapshot();
2338
});
2439

2540
it('renders html content (.md extension)', () => {
26-
const tree = renderer
27-
.create(<Doc options={{ content: htmlContent, filename: 'doc.md' }} />)
28-
.toJSON();
41+
const options = {
42+
content: htmlContent,
43+
filename: 'doc.md',
44+
};
45+
const tree = renderer.create(<DocComponent options={options} />).toJSON();
2946
expect(tree).toMatchSnapshot();
3047
});
3148
});
3249

3350
describe('markdown content', () => {
3451
it('renders markdown content (.html extension)', () => {
35-
const tree = renderer
36-
.create(
37-
<Doc options={{ content: markdownContent, filename: 'doc.html' }} />,
38-
)
39-
.toJSON();
52+
const options = {
53+
content: markdownContent,
54+
filename: 'doc.html',
55+
};
56+
const tree = renderer.create(<DocComponent options={options} />).toJSON();
4057
expect(tree).toMatchSnapshot();
4158
});
4259

43-
it('renders markdown content (.txt extension)', () => {
44-
const tree = renderer
45-
.create(
46-
<Doc options={{ content: markdownContent, filename: 'doc.txt' }} />,
47-
)
48-
.toJSON();
60+
it('renders code block (.any extension)', () => {
61+
const options = {
62+
content: markdownContent,
63+
filename: 'doc.any',
64+
};
65+
const tree = renderer.create(<DocComponent options={options} />).toJSON();
4966
expect(tree).toMatchSnapshot();
5067
});
5168

5269
it('renders markdown content (.md extension)', () => {
53-
const tree = renderer
54-
.create(
55-
<Doc options={{ content: markdownContent, filename: 'doc.md' }} />,
56-
)
57-
.toJSON();
70+
const options = {
71+
content: markdownContent,
72+
filename: 'doc.md',
73+
};
74+
const tree = renderer.create(<DocComponent options={options} />).toJSON();
75+
expect(tree).toMatchSnapshot();
76+
});
77+
});
78+
79+
describe('code block content (sanitized)', () => {
80+
it('renders JS content to code block (.js extension)', () => {
81+
const options = {
82+
content: jsContent,
83+
filename: 'doc.js',
84+
sanitizeSchema,
85+
};
86+
const tree = renderer.create(<DocComponent options={options} />).toJSON();
87+
expect(tree).toMatchSnapshot();
88+
});
89+
90+
it('renders JSON content to code block (.js extension)', () => {
91+
const options = {
92+
content: jsonContent,
93+
filename: 'doc.json',
94+
sanitizeSchema,
95+
};
96+
const tree = renderer.create(<DocComponent options={options} />).toJSON();
5897
expect(tree).toMatchSnapshot();
5998
});
6099
});

0 commit comments

Comments
 (0)