Skip to content

Commit f67f1c2

Browse files
ellatrixellatrix
committed
Fix br handling
1 parent a2ccee4 commit f67f1c2

File tree

6 files changed

+126
-23
lines changed

6 files changed

+126
-23
lines changed

‎core-blocks/test/fixtures/core__preformatted.json‎

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -79,11 +79,7 @@
7979
null,
8080
null,
8181
null,
82-
[
83-
{
84-
"type": "br"
85-
}
86-
],
82+
null,
8783
null,
8884
null,
8985
null,

‎core-blocks/test/fixtures/core__verse.json‎

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -34,11 +34,7 @@
3434
}
3535
],
3636
null,
37-
[
38-
{
39-
"type": "br"
40-
}
41-
],
37+
null,
4238
null,
4339
null,
4440
null,

‎editor/components/rich-text/index.js‎

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -86,7 +86,7 @@ export class RichText extends Component {
8686
this.patterns = patterns.call( this );
8787

8888
this.state = {
89-
selection: [],
89+
selection: {},
9090
};
9191
}
9292

@@ -544,7 +544,10 @@ export class RichText extends Component {
544544
event.preventDefault();
545545

546546
if ( event.shiftKey || ! this.props.onSplit ) {
547-
this.editor.execCommand( 'InsertLineBreak', false, event );
547+
const { value } = this.props;
548+
const { selection } = this.state;
549+
const record = richTextStructure.splice( { value, selection }, undefined, 0, '\n' );
550+
this.onChange( record );
548551
} else {
549552
this.splitContent();
550553
}

‎editor/components/rich-text/patterns.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -79,7 +79,7 @@ export default function() {
7979
}
8080

8181
const start = match.index;
82-
const end = start + match[ 1 ].length - 1;
82+
const end = start + match[ 1 ].length;
8383

8484
record = splice( record, match.index + match[ 0 ].length - 1, 1 );
8585
record = splice( record, start, 1 );

‎packages/blocks/src/api/rich-text-structure.js‎

Lines changed: 27 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -74,7 +74,7 @@ function createRecord( element, range, settings = {} ) {
7474
) {
7575
return {
7676
value: {
77-
formats: Array( 1 ),
77+
formats: [ undefined ],
7878
text: '\n',
7979
},
8080
selection: {},
@@ -131,7 +131,7 @@ function createRecord( element, range, settings = {} ) {
131131

132132
let format;
133133

134-
if ( ! unwrapNodeMatch( node ) ) {
134+
if ( ! unwrapNodeMatch( node ) && node.nodeName !== 'BR' ) {
135135
const type = node.nodeName.toLowerCase();
136136
const attributes = getAttributes( node, settings );
137137

@@ -173,6 +173,10 @@ function createRecord( element, range, settings = {} ) {
173173
formats[ index ] = value.formats[ i ];
174174
}
175175
}
176+
177+
if ( ! formats[ index ] ) {
178+
formats[ index ] = undefined;
179+
}
176180
}
177181
}
178182

@@ -229,7 +233,13 @@ export function apply( value, current, multiline ) {
229233
const range = current.ownerDocument.createRange();
230234
const isCollapsed = startContainer === endContainer && startOffset === endOffset;
231235

232-
if ( isCollapsed && startOffset === 0 && startContainer.nodeType === TEXT_NODE ) {
236+
if (
237+
isCollapsed &&
238+
startOffset === 0 &&
239+
startContainer.previousSibling &&
240+
startContainer.previousSibling.nodeType === ELEMENT_NODE &&
241+
startContainer.previousSibling.nodeName !== 'BR'
242+
) {
233243
startContainer.insertData( 0, '\uFEFF' );
234244
range.setStart( startContainer, 1 );
235245
range.setEnd( endContainer, 1 );
@@ -357,18 +367,22 @@ export function toDOM( { value, selection = {} }, multiline, _tag ) {
357367
} );
358368
}
359369

360-
if ( pointer.nodeType === TEXT_NODE ) {
370+
if ( character === '\n' ) {
371+
pointer = pointer.parentNode.appendChild( doc.createElement( 'br' ) );
372+
} else if ( pointer.nodeType === TEXT_NODE ) {
361373
pointer.appendData( character );
362374
} else {
363375
pointer = pointer.parentNode.appendChild( doc.createTextNode( character ) );
364376
}
365377

366378
if ( start === i ) {
367-
startPath = createPathToNode( pointer, body, [ pointer.nodeValue.length - 1 ] );
379+
const initialPath = pointer.nodeValue ? [ pointer.nodeValue.length - 1 ] : [];
380+
startPath = createPathToNode( pointer, body, initialPath );
368381
}
369382

370383
if ( end === i ) {
371-
endPath = createPathToNode( pointer, body, [ pointer.nodeValue.length - 1 ] );
384+
const initialPath = pointer.nodeValue ? [ pointer.nodeValue.length - 1 ] : [];
385+
endPath = createPathToNode( pointer, body, initialPath );
372386
}
373387
}
374388

@@ -418,21 +432,24 @@ export function isEmpty( record ) {
418432
return text.length === 0 && formats.length === 0;
419433
}
420434

421-
export function splice( { formats, text, selection, value }, start, deleteCount, textToInsert = '', formatsToInsert = [] ) {
435+
export function splice( { formats, text, selection, value }, start, deleteCount, textToInsert = '', formatsToInsert ) {
422436
if ( value !== undefined ) {
437+
start = start || selection.start;
438+
deleteCount = deleteCount || selection.end - selection.start;
439+
423440
const diff = textToInsert.length - deleteCount;
424441

425442
return {
426443
selection: {
427-
start: selection.start + ( selection.start > start ? diff : 0 ),
428-
end: selection.end + ( selection.end > start + diff ? diff : 0 ),
444+
start: selection.start + ( selection.start >= start ? diff : 0 ),
445+
end: selection.end + ( selection.end >= start ? diff : 0 ),
429446
},
430447
value: splice( value, start, deleteCount, textToInsert, formatsToInsert ),
431448
};
432449
}
433450

434451
if ( ! Array.isArray( formatsToInsert ) ) {
435-
formatsToInsert = Array( textToInsert.length ).fill( [ formatsToInsert ] );
452+
formatsToInsert = Array( textToInsert.length ).fill( formatsToInsert ? [ formatsToInsert ] : formatsToInsert );
436453
}
437454

438455
formats.splice( start, deleteCount, ...formatsToInsert );

‎packages/blocks/src/api/test/rich-text-structure.js‎

Lines changed: 91 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -205,6 +205,64 @@ describe( 'create', () => {
205205
},
206206
} );
207207
} );
208+
209+
it( 'should handle br', () => {
210+
const element = createNode( '<p>test<br>test</p>' );
211+
const range1 = {
212+
startOffset: 1,
213+
startContainer: element,
214+
endOffset: 1,
215+
endContainer: element,
216+
};
217+
const range2 = {
218+
startOffset: 0,
219+
startContainer: element.lastChild,
220+
endOffset: 0,
221+
endContainer: element.lastChild,
222+
};
223+
224+
deepEqual( createWithSelection( element, range1, false ), {
225+
value: {
226+
formats: [
227+
undefined,
228+
undefined,
229+
undefined,
230+
undefined,
231+
undefined,
232+
undefined,
233+
undefined,
234+
undefined,
235+
undefined,
236+
],
237+
text: 'test\ntest',
238+
},
239+
selection: {
240+
start: 4,
241+
end: 4,
242+
},
243+
} );
244+
245+
deepEqual( createWithSelection( element, range2, false ), {
246+
value: {
247+
formats: [
248+
undefined,
249+
undefined,
250+
undefined,
251+
undefined,
252+
undefined,
253+
undefined,
254+
undefined,
255+
undefined,
256+
undefined,
257+
],
258+
text: 'test\ntest',
259+
},
260+
selection: {
261+
start: 5,
262+
end: 5,
263+
},
264+
} );
265+
} );
208266
} );
209267

210268
describe( 'toString', () => {
@@ -440,6 +498,39 @@ describe( 'splice', () => {
440498
expect( splice( record, 2, 4, 'a', [ [ { type: 'strong' } ] ] ) ).toEqual( expected );
441499
} );
442500

501+
it( 'should insert line break with selection', () => {
502+
const record = {
503+
value: {
504+
formats: [
505+
undefined,
506+
undefined,
507+
],
508+
text: 'tt',
509+
},
510+
selection: {
511+
start: 1,
512+
end: 1,
513+
},
514+
};
515+
516+
const expected = {
517+
value: {
518+
formats: [
519+
undefined,
520+
undefined,
521+
undefined,
522+
],
523+
text: 't\nt',
524+
},
525+
selection: {
526+
start: 2,
527+
end: 2,
528+
},
529+
};
530+
531+
expect( splice( record, undefined, 0, '\n' ) ).toEqual( expected );
532+
} );
533+
443534
// it( 'should delete and insert multiline', () => {
444535
// const record = {
445536
// value: [

0 commit comments

Comments
 (0)