diff --git a/packages/slate-react/src/components/leaf.js b/packages/slate-react/src/components/leaf.js index a5de819cb..4051d6481 100644 --- a/packages/slate-react/src/components/leaf.js +++ b/packages/slate-react/src/components/leaf.js @@ -123,8 +123,10 @@ class Leaf extends React.Component { const { block, node, parent, text, index, leaves } = this.props // COMPAT: If the text is empty and it's the only child, we need to render a - //
to get the block to have the proper height. - if (text == '' && parent.kind == 'block' && parent.text == '') return
+ // line break to get the block to have the proper height. + if (text == '' && parent.kind == 'block' && parent.text == '') { + return {'\n'} + } // COMPAT: If the text is empty otherwise, it's because it's on the edge of // an inline void node, so we render a zero-width space so that the diff --git a/packages/slate-react/src/components/text.js b/packages/slate-react/src/components/text.js index 2baf93f17..2e98dccf7 100644 --- a/packages/slate-react/src/components/text.js +++ b/packages/slate-react/src/components/text.js @@ -81,7 +81,7 @@ class Text extends React.Component { if (n.node != p.node) return true // If the node parent is a block node, and it was the last child of the - // block, re-render to cleanup extra `
` or `\n`. + // block, re-render to cleanup extra `\n`. if (n.parent.kind == 'block') { const pLast = p.parent.nodes.last() const nLast = n.parent.nodes.last() diff --git a/packages/slate-react/src/utils/find-dom-point.js b/packages/slate-react/src/utils/find-dom-point.js index 74d16306a..7d64db7d2 100644 --- a/packages/slate-react/src/utils/find-dom-point.js +++ b/packages/slate-react/src/utils/find-dom-point.js @@ -40,11 +40,11 @@ function findDOMPoint(key, offset) { } // COMPAT: For empty blocks with only a single empty text node, we will have - // rendered a `
` instead of a text node. + // rendered a `` with `\n` inside, instead of a text node. if ( el.childNodes.length == 1 && el.childNodes[0].childNodes.length == 1 && - el.childNodes[0].childNodes[0].tagName == 'BR' + el.childNodes[0].childNodes[0].hasAttributes('data-slate-empty-block') ) { return { node: el.childNodes[0], offset: 0 } } diff --git a/packages/slate-react/test/rendering/fixtures/empty-block-with-inline.js b/packages/slate-react/test/rendering/fixtures/empty-block-with-inline.js index e0c3c6d8f..b3aa4dd9a 100644 --- a/packages/slate-react/test/rendering/fixtures/empty-block-with-inline.js +++ b/packages/slate-react/test/rendering/fixtures/empty-block-with-inline.js @@ -19,7 +19,9 @@ export const output = `
-
+ + \n +
diff --git a/packages/slate-react/test/rendering/fixtures/empty-block.js b/packages/slate-react/test/rendering/fixtures/empty-block.js index d5cf008a0..7746912f4 100644 --- a/packages/slate-react/test/rendering/fixtures/empty-block.js +++ b/packages/slate-react/test/rendering/fixtures/empty-block.js @@ -17,7 +17,9 @@ export const output = `
-
+ + \n +