Skip to content
This repository was archived by the owner on Feb 6, 2023. It is now read-only.

Commit a0267a9

Browse files
ericbiewenerfacebook-github-bot
authored andcommitted
Unstyle empty list item on Enter key (#769)
Summary: **Summary** This appears to be standard functionality in text editors. If the list item has no text and the user pressed `Enter`, rather than creating a new list item, the current one should simply be removed. This is how it works in Google Docs, TextEdit, etc. **Test Plan** 1. Open the Rich Text editor example. 2. Create a list item. Don't add any text to it. 3. Press enter The list item should be removed. Pull Request resolved: #769 Reviewed By: flarnie Differential Revision: D10371552 Pulled By: flarnie fbshipit-source-id: aa975e465c5cdbb1a8def62ba079545836211152
1 parent 9a96ab0 commit a0267a9

File tree

3 files changed

+330
-2
lines changed

3 files changed

+330
-2
lines changed

src/model/transaction/__tests__/__snapshots__/splitBlockInContentState-test.js.snap

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

3+
exports[`must convert empty list item ContentBlock to unstyled rather than split 1`] = `
4+
Array [
5+
Object {
6+
"characterList": Array [
7+
Object {
8+
"entity": null,
9+
"style": Array [],
10+
},
11+
Object {
12+
"entity": null,
13+
"style": Array [],
14+
},
15+
Object {
16+
"entity": null,
17+
"style": Array [],
18+
},
19+
Object {
20+
"entity": null,
21+
"style": Array [],
22+
},
23+
Object {
24+
"entity": null,
25+
"style": Array [],
26+
},
27+
],
28+
"children": Array [],
29+
"data": Object {},
30+
"depth": 0,
31+
"key": "A",
32+
"nextSibling": "B",
33+
"parent": null,
34+
"prevSibling": null,
35+
"text": "Alpha",
36+
"type": "unstyled",
37+
},
38+
Object {
39+
"characterList": Array [],
40+
"children": Array [
41+
"C",
42+
"F",
43+
],
44+
"data": Object {},
45+
"depth": 0,
46+
"key": "B",
47+
"nextSibling": "G",
48+
"parent": null,
49+
"prevSibling": "A",
50+
"text": "",
51+
"type": "unstyled",
52+
},
53+
Object {
54+
"characterList": Array [],
55+
"children": Array [
56+
"D",
57+
"E",
58+
],
59+
"data": Object {},
60+
"depth": 0,
61+
"key": "C",
62+
"nextSibling": "F",
63+
"parent": "B",
64+
"prevSibling": null,
65+
"text": "",
66+
"type": "unstyled",
67+
},
68+
Object {
69+
"characterList": Array [
70+
Object {
71+
"entity": null,
72+
"style": Array [],
73+
},
74+
Object {
75+
"entity": null,
76+
"style": Array [],
77+
},
78+
Object {
79+
"entity": null,
80+
"style": Array [],
81+
},
82+
Object {
83+
"entity": null,
84+
"style": Array [],
85+
},
86+
Object {
87+
"entity": null,
88+
"style": Array [],
89+
},
90+
],
91+
"children": Array [],
92+
"data": Object {},
93+
"depth": 0,
94+
"key": "D",
95+
"nextSibling": "E",
96+
"parent": "C",
97+
"prevSibling": null,
98+
"text": "Delta",
99+
"type": "unstyled",
100+
},
101+
Object {
102+
"characterList": Array [
103+
Object {
104+
"entity": null,
105+
"style": Array [],
106+
},
107+
Object {
108+
"entity": null,
109+
"style": Array [],
110+
},
111+
Object {
112+
"entity": null,
113+
"style": Array [],
114+
},
115+
Object {
116+
"entity": null,
117+
"style": Array [],
118+
},
119+
Object {
120+
"entity": null,
121+
"style": Array [],
122+
},
123+
Object {
124+
"entity": null,
125+
"style": Array [],
126+
},
127+
Object {
128+
"entity": null,
129+
"style": Array [],
130+
},
131+
Object {
132+
"entity": null,
133+
"style": Array [],
134+
},
135+
],
136+
"children": Array [],
137+
"data": Object {},
138+
"depth": 0,
139+
"key": "E",
140+
"nextSibling": null,
141+
"parent": "C",
142+
"prevSibling": "D",
143+
"text": "Elephant",
144+
"type": "unstyled",
145+
},
146+
Object {
147+
"characterList": Array [
148+
Object {
149+
"entity": null,
150+
"style": Array [],
151+
},
152+
Object {
153+
"entity": null,
154+
"style": Array [],
155+
},
156+
Object {
157+
"entity": null,
158+
"style": Array [],
159+
},
160+
Object {
161+
"entity": null,
162+
"style": Array [],
163+
},
164+
],
165+
"children": Array [],
166+
"data": Object {},
167+
"depth": 0,
168+
"key": "F",
169+
"nextSibling": null,
170+
"parent": "B",
171+
"prevSibling": "C",
172+
"text": "Fire",
173+
"type": "unstyled",
174+
},
175+
Object {
176+
"characterList": Array [
177+
Object {
178+
"entity": null,
179+
"style": Array [],
180+
},
181+
Object {
182+
"entity": null,
183+
"style": Array [],
184+
},
185+
Object {
186+
"entity": null,
187+
"style": Array [],
188+
},
189+
Object {
190+
"entity": null,
191+
"style": Array [],
192+
},
193+
Object {
194+
"entity": null,
195+
"style": Array [],
196+
},
197+
Object {
198+
"entity": null,
199+
"style": Array [],
200+
},
201+
],
202+
"children": Array [],
203+
"data": Object {},
204+
"depth": 0,
205+
"key": "G",
206+
"nextSibling": null,
207+
"parent": null,
208+
"prevSibling": "B",
209+
"text": "Gorila",
210+
"type": "unstyled",
211+
},
212+
Object {
213+
"characterList": Array [],
214+
"children": Array [],
215+
"data": Object {},
216+
"depth": 0,
217+
"key": "H",
218+
"nextSibling": null,
219+
"parent": null,
220+
"prevSibling": "G",
221+
"text": "",
222+
"type": "unstyled",
223+
},
224+
]
225+
`;
226+
3227
exports[`must split at the beginning of a block 1`] = `
4228
Array [
5229
Object {
@@ -395,6 +619,18 @@ Array [
395619
"text": "Gorila",
396620
"type": "unstyled",
397621
},
622+
Object {
623+
"characterList": Array [],
624+
"children": Array [],
625+
"data": Object {},
626+
"depth": 0,
627+
"key": "H",
628+
"nextSibling": null,
629+
"parent": null,
630+
"prevSibling": "G",
631+
"text": "",
632+
"type": "unordered-list-item",
633+
},
398634
]
399635
`;
400636

@@ -619,6 +855,18 @@ Array [
619855
"text": "Gorila",
620856
"type": "unstyled",
621857
},
858+
Object {
859+
"characterList": Array [],
860+
"children": Array [],
861+
"data": Object {},
862+
"depth": 0,
863+
"key": "H",
864+
"nextSibling": null,
865+
"parent": null,
866+
"prevSibling": "G",
867+
"text": "",
868+
"type": "unordered-list-item",
869+
},
622870
]
623871
`;
624872

@@ -1017,6 +1265,18 @@ Array [
10171265
"text": "Gorila",
10181266
"type": "unstyled",
10191267
},
1268+
Object {
1269+
"characterList": Array [],
1270+
"children": Array [],
1271+
"data": Object {},
1272+
"depth": 0,
1273+
"key": "H",
1274+
"nextSibling": null,
1275+
"parent": null,
1276+
"prevSibling": "G",
1277+
"text": "",
1278+
"type": "unordered-list-item",
1279+
},
10201280
]
10211281
`;
10221282

@@ -1241,6 +1501,18 @@ Array [
12411501
"text": "Gorila",
12421502
"type": "unstyled",
12431503
},
1504+
Object {
1505+
"characterList": Array [],
1506+
"children": Array [],
1507+
"data": Object {},
1508+
"depth": 0,
1509+
"key": "H",
1510+
"nextSibling": null,
1511+
"parent": null,
1512+
"prevSibling": "G",
1513+
"text": "",
1514+
"type": "unordered-list-item",
1515+
},
12441516
]
12451517
`;
12461518

@@ -1641,6 +1913,18 @@ Array [
16411913
"text": "Gorila",
16421914
"type": "unstyled",
16431915
},
1916+
Object {
1917+
"characterList": Array [],
1918+
"children": Array [],
1919+
"data": Object {},
1920+
"depth": 0,
1921+
"key": "H",
1922+
"nextSibling": null,
1923+
"parent": null,
1924+
"prevSibling": "G",
1925+
"text": "",
1926+
"type": "unordered-list-item",
1927+
},
16441928
]
16451929
`;
16461930

@@ -1866,5 +2150,17 @@ Array [
18662150
"text": "Gorila",
18672151
"type": "unstyled",
18682152
},
2153+
Object {
2154+
"characterList": Array [],
2155+
"children": Array [],
2156+
"data": Object {},
2157+
"depth": 0,
2158+
"key": "H",
2159+
"nextSibling": null,
2160+
"parent": null,
2161+
"prevSibling": "G",
2162+
"text": "",
2163+
"type": "unordered-list-item",
2164+
},
18692165
]
18702166
`;

src/model/transaction/__tests__/splitBlockInContentState-test.js

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -70,6 +70,12 @@ const contentBlockNodes = [
7070
prevSibling: 'B',
7171
text: 'Gorila',
7272
}),
73+
new ContentBlockNode({
74+
key: 'H',
75+
prevSibling: 'G',
76+
text: '',
77+
type: 'unordered-list-item',
78+
}),
7379
];
7480
const treeSelectionState = SelectionState.createEmpty('A');
7581
const treeContentState = contentState.set(
@@ -208,3 +214,15 @@ test('must split at the end of a nested ContentBlock', () => {
208214
treeContentState,
209215
);
210216
});
217+
218+
test('must convert empty list item ContentBlock to unstyled rather than split', () => {
219+
assertSplitBlockInContentState(
220+
treeSelectionState.merge({
221+
anchorOffset: 0,
222+
focusOffset: 0,
223+
anchorKey: 'H',
224+
focusKey: 'H',
225+
}),
226+
treeContentState,
227+
);
228+
});

0 commit comments

Comments
 (0)