Skip to content
This repository was archived by the owner on Jun 24, 2025. It is now read-only.

Commit 300b78d

Browse files
committed
Add a test and a new story for using a custom prefix.
1 parent fe902c9 commit 300b78d

File tree

3 files changed

+165
-30
lines changed

3 files changed

+165
-30
lines changed

src/McText.spec.js

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,13 @@ test('Formatting codes text renders properly', () => {
2222
expect(tree).toMatchSnapshot()
2323
})
2424

25+
test('Formatting codes text with custom prefix renders properly', () => {
26+
const tree = renderer.create(
27+
<McText prefix={'&'}>{'&4This is red and this is &ksecret&r and &lbold. Note that &9color codes reset format codes, as you &ocan see.'}</McText>
28+
).toJSON()
29+
expect(tree).toMatchSnapshot()
30+
})
31+
2532
test('JSON text component renders properly', () => {
2633
const tree = renderer.create(
2734
<McText>

src/__snapshots__/McText.spec.js.snap

Lines changed: 152 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,110 @@
1-
exports[`test Formatting codes text renders properly 1`] = `
1+
// Jest Snapshot v1, https://goo.gl/fbAQLP
2+
3+
exports[`Formatting codes text renders properly 1`] = `
4+
<span
5+
style={
6+
Object {
7+
"fontFamily": "monospace",
8+
}
9+
}
10+
>
11+
<span
12+
style={
13+
Object {
14+
"color": undefined,
15+
"fontStyle": undefined,
16+
"fontWeight": undefined,
17+
"textDecoration": undefined,
18+
}
19+
}
20+
>
21+
22+
<span
23+
style={
24+
Object {
25+
"color": "#aa0000",
26+
"fontStyle": undefined,
27+
"fontWeight": undefined,
28+
"textDecoration": undefined,
29+
}
30+
}
31+
>
32+
This is red and this is
33+
</span>
34+
<span
35+
style={
36+
Object {
37+
"color": "#aa0000",
38+
"fontStyle": undefined,
39+
"fontWeight": undefined,
40+
"textDecoration": undefined,
41+
}
42+
}
43+
>
44+
<span>
45+
bipw3!
46+
</span>
47+
</span>
48+
<span
49+
style={
50+
Object {
51+
"color": undefined,
52+
"fontStyle": undefined,
53+
"fontWeight": undefined,
54+
"textDecoration": undefined,
55+
}
56+
}
57+
>
58+
and
59+
</span>
60+
<span
61+
style={
62+
Object {
63+
"color": undefined,
64+
"fontStyle": undefined,
65+
"fontWeight": "bold",
66+
"textDecoration": undefined,
67+
}
68+
}
69+
>
70+
bold. Note that
71+
</span>
72+
<span
73+
style={
74+
Object {
75+
"color": "#5555ff",
76+
"fontStyle": undefined,
77+
"fontWeight": undefined,
78+
"textDecoration": undefined,
79+
}
80+
}
81+
>
82+
color codes reset format codes, as you
83+
</span>
84+
<span
85+
style={
86+
Object {
87+
"color": "#5555ff",
88+
"fontStyle": "italic",
89+
"fontWeight": undefined,
90+
"textDecoration": undefined,
91+
}
92+
}
93+
>
94+
can see.
95+
</span>
96+
</span>
97+
</span>
98+
`;
99+
100+
exports[`Formatting codes text with custom prefix renders properly 1`] = `
2101
<span
3102
style={
4103
Object {
5104
"fontFamily": "monospace",
6105
}
7-
}>
106+
}
107+
>
8108
<span
9109
style={
10110
Object {
@@ -13,7 +113,8 @@ exports[`test Formatting codes text renders properly 1`] = `
13113
"fontWeight": undefined,
14114
"textDecoration": undefined,
15115
}
16-
}>
116+
}
117+
>
17118
18119
<span
19120
style={
@@ -23,7 +124,8 @@ exports[`test Formatting codes text renders properly 1`] = `
23124
"fontWeight": undefined,
24125
"textDecoration": undefined,
25126
}
26-
}>
127+
}
128+
>
27129
This is red and this is
28130
</span>
29131
<span
@@ -34,9 +136,10 @@ exports[`test Formatting codes text renders properly 1`] = `
34136
"fontWeight": undefined,
35137
"textDecoration": undefined,
36138
}
37-
}>
139+
}
140+
>
38141
<span>
39-
NUbipw
142+
#AGNUb
40143
</span>
41144
</span>
42145
<span
@@ -47,7 +150,8 @@ exports[`test Formatting codes text renders properly 1`] = `
47150
"fontWeight": undefined,
48151
"textDecoration": undefined,
49152
}
50-
}>
153+
}
154+
>
51155
and
52156
</span>
53157
<span
@@ -58,7 +162,8 @@ exports[`test Formatting codes text renders properly 1`] = `
58162
"fontWeight": "bold",
59163
"textDecoration": undefined,
60164
}
61-
}>
165+
}
166+
>
62167
bold. Note that
63168
</span>
64169
<span
@@ -69,7 +174,8 @@ exports[`test Formatting codes text renders properly 1`] = `
69174
"fontWeight": undefined,
70175
"textDecoration": undefined,
71176
}
72-
}>
177+
}
178+
>
73179
color codes reset format codes, as you
74180
</span>
75181
<span
@@ -80,20 +186,22 @@ exports[`test Formatting codes text renders properly 1`] = `
80186
"fontWeight": undefined,
81187
"textDecoration": undefined,
82188
}
83-
}>
189+
}
190+
>
84191
can see.
85192
</span>
86193
</span>
87194
</span>
88195
`;
89196

90-
exports[`test JSON text component renders properly 1`] = `
197+
exports[`JSON text component renders properly 1`] = `
91198
<span
92199
style={
93200
Object {
94201
"fontFamily": "monospace",
95202
}
96-
}>
203+
}
204+
>
97205
<span
98206
style={
99207
Object {
@@ -102,7 +210,8 @@ exports[`test JSON text component renders properly 1`] = `
102210
"fontWeight": undefined,
103211
"textDecoration": undefined,
104212
}
105-
}>
213+
}
214+
>
106215
107216
<span
108217
style={
@@ -112,9 +221,10 @@ exports[`test JSON text component renders properly 1`] = `
112221
"fontWeight": undefined,
113222
"textDecoration": undefined,
114223
}
115-
}>
224+
}
225+
>
116226
<span>
117-
3!#AGNUbipw3!#AGNUbipw3!#AGNUbipw3!#AGNUbipw3
227+
ipw3!#AGNUbipw3!#AGNUbipw3!#AGNUbipw3!#AGNUbi
118228
</span>
119229
</span>
120230
<span
@@ -125,7 +235,8 @@ exports[`test JSON text component renders properly 1`] = `
125235
"fontWeight": undefined,
126236
"textDecoration": undefined,
127237
}
128-
}>
238+
}
239+
>
129240
|
130241
</span>
131242
<span
@@ -136,7 +247,8 @@ exports[`test JSON text component renders properly 1`] = `
136247
"fontWeight": undefined,
137248
"textDecoration": undefined,
138249
}
139-
}>
250+
}
251+
>
140252
SKY-Server
141253
</span>
142254
<span
@@ -147,7 +259,8 @@ exports[`test JSON text component renders properly 1`] = `
147259
"fontWeight": undefined,
148260
"textDecoration": undefined,
149261
}
150-
}>
262+
}
263+
>
151264
|
152265
</span>
153266
<span
@@ -158,7 +271,8 @@ exports[`test JSON text component renders properly 1`] = `
158271
"fontWeight": undefined,
159272
"textDecoration": undefined,
160273
}
161-
}>
274+
}
275+
>
162276
Minigames
163277
</span>
164278
<span
@@ -169,7 +283,8 @@ exports[`test JSON text component renders properly 1`] = `
169283
"fontWeight": undefined,
170284
"textDecoration": undefined,
171285
}
172-
}>
286+
}
287+
>
173288
|
174289
</span>
175290
<span
@@ -180,7 +295,8 @@ exports[`test JSON text component renders properly 1`] = `
180295
"fontWeight": undefined,
181296
"textDecoration": undefined,
182297
}
183-
}>
298+
}
299+
>
184300
Creative
185301
</span>
186302
<span
@@ -191,7 +307,8 @@ exports[`test JSON text component renders properly 1`] = `
191307
"fontWeight": undefined,
192308
"textDecoration": undefined,
193309
}
194-
}>
310+
}
311+
>
195312
|
196313
</span>
197314
<span
@@ -202,7 +319,8 @@ exports[`test JSON text component renders properly 1`] = `
202319
"fontWeight": undefined,
203320
"textDecoration": undefined,
204321
}
205-
}>
322+
}
323+
>
206324
Community von 8 - 66 Jahren
207325
</span>
208326
<span
@@ -213,7 +331,8 @@ exports[`test JSON text component renders properly 1`] = `
213331
"fontWeight": undefined,
214332
"textDecoration": undefined,
215333
}
216-
}>
334+
}
335+
>
217336
|
218337
</span>
219338
<span
@@ -224,20 +343,22 @@ exports[`test JSON text component renders properly 1`] = `
224343
"fontWeight": undefined,
225344
"textDecoration": undefined,
226345
}
227-
}>
346+
}
347+
>
228348
Aktive Admins
229349
</span>
230350
</span>
231351
</span>
232352
`;
233353

234-
exports[`test JSON text component with string extra components renders properly 1`] = `
354+
exports[`JSON text component with string extra components renders properly 1`] = `
235355
<span
236356
style={
237357
Object {
238358
"fontFamily": "monospace",
239359
}
240-
}>
360+
}
361+
>
241362
<span
242363
style={
243364
Object {
@@ -246,7 +367,8 @@ exports[`test JSON text component with string extra components renders properly
246367
"fontWeight": undefined,
247368
"textDecoration": undefined,
248369
}
249-
}>
370+
}
371+
>
250372
This
251373
<span>
252374
works
@@ -259,7 +381,8 @@ exports[`test JSON text component with string extra components renders properly
259381
"fontWeight": undefined,
260382
"textDecoration": undefined,
261383
}
262-
}>
384+
}
385+
>
263386
great!
264387
</span>
265388
</span>

stories/index.js

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import React from 'react'
2-
import { storiesOf } from '@kadira/storybook'
2+
import { storiesOf } from '@storybook/react'
33
import McText from '../src/McText'
44

55
storiesOf('McText', module)
@@ -23,3 +23,8 @@ storiesOf('McText', module)
2323
§4This is red and this is §ksecret§r and §lbold. Note that §9color codes reset format codes, as you §ocan see.
2424
</McText>
2525
))
26+
.add('from string (& as prefix)', () => (
27+
<McText prefix={'&'}>
28+
{'&4This is red and this is &ksecret&r and &lbold. Note that &9color codes reset format codes, as you &ocan see.'}
29+
</McText>
30+
))

0 commit comments

Comments
 (0)