From 115cf469b96a8f9c12dd77394d23b19a9b9fa5b9 Mon Sep 17 00:00:00 2001
From: Kalley Powell <kalley.powell@gmail.com>
Date: Thu, 25 Oct 2018 11:41:43 -0500
Subject: [PATCH] Use <br /> inside empty block so those appear selected
 (#2300)

---
 packages/slate-react/src/components/leaf.js                | 7 ++++++-
 .../test/rendering/fixtures/custom-block-blurred.js        | 4 ++--
 .../test/rendering/fixtures/custom-block-focused.js        | 4 ++--
 .../test/rendering/fixtures/custom-block-selected.js       | 4 ++--
 .../test/rendering/fixtures/custom-inline-void.js          | 2 +-
 .../slate-react/test/rendering/fixtures/empty-block.js     | 2 +-
 .../test/rendering/fixtures/readonly-custom-inline-void.js | 2 +-
 7 files changed, 15 insertions(+), 10 deletions(-)

diff --git a/packages/slate-react/src/components/leaf.js b/packages/slate-react/src/components/leaf.js
index 19ce4b114..1b43a537d 100644
--- a/packages/slate-react/src/components/leaf.js
+++ b/packages/slate-react/src/components/leaf.js
@@ -142,7 +142,12 @@ class Leaf extends React.Component {
       parent.text === '' &&
       parent.nodes.last() === node
     ) {
-      return <span data-slate-zero-width="n">{'\uFEFF'}</span>
+      return (
+        <span data-slate-zero-width="n">
+          {'\uFEFF'}
+          <br />
+        </span>
+      )
     }
 
     // COMPAT: If the text is empty, it's because it's on the edge of an inline
diff --git a/packages/slate-react/test/rendering/fixtures/custom-block-blurred.js b/packages/slate-react/test/rendering/fixtures/custom-block-blurred.js
index a608baa2c..de0428de0 100644
--- a/packages/slate-react/test/rendering/fixtures/custom-block-blurred.js
+++ b/packages/slate-react/test/rendering/fixtures/custom-block-blurred.js
@@ -63,7 +63,7 @@ export const output = `
    <div style="position:relative">
     <span>
       <span>
-        <span data-slate-zero-width="n">&#xFEFF;</span>
+        <span data-slate-zero-width="n">&#xFEFF;<br /></span>
       </span>
     </span>
   </div>
@@ -82,7 +82,7 @@ export const output = `
   <div style="position:relative">
     <span>
       <span>
-        <span data-slate-zero-width="n">&#xFEFF;</span>
+        <span data-slate-zero-width="n">&#xFEFF;<br /></span>
       </span>
     </span>
   </div>
diff --git a/packages/slate-react/test/rendering/fixtures/custom-block-focused.js b/packages/slate-react/test/rendering/fixtures/custom-block-focused.js
index 2d403439f..182fcbb20 100644
--- a/packages/slate-react/test/rendering/fixtures/custom-block-focused.js
+++ b/packages/slate-react/test/rendering/fixtures/custom-block-focused.js
@@ -59,7 +59,7 @@ export const output = `
   <div style="position:relative">
     <span>
       <span>
-        <span data-slate-zero-width="n">&#xFEFF;</span>
+        <span data-slate-zero-width="n">&#xFEFF;<br /></span>
       </span>
     </span>
   </div>
@@ -78,7 +78,7 @@ export const output = `
   <div style="position:relative">
     <span>
       <span>
-        <span data-slate-zero-width="n">&#xFEFF;</span>
+        <span data-slate-zero-width="n">&#xFEFF;<br /></span>
       </span>
     </span>
   </div>
diff --git a/packages/slate-react/test/rendering/fixtures/custom-block-selected.js b/packages/slate-react/test/rendering/fixtures/custom-block-selected.js
index 980b4eb70..0acc2e9f9 100644
--- a/packages/slate-react/test/rendering/fixtures/custom-block-selected.js
+++ b/packages/slate-react/test/rendering/fixtures/custom-block-selected.js
@@ -59,7 +59,7 @@ export const output = `
   <div style="position:relative">
     <span>
       <span>
-        <span data-slate-zero-width="n">&#xFEFF;</span>
+        <span data-slate-zero-width="n">&#xFEFF;<br /></span>
       </span>
     </span>
   </div>
@@ -78,7 +78,7 @@ export const output = `
   <div style="position:relative">
     <span>
       <span>
-        <span data-slate-zero-width="n">&#xFEFF;</span>
+        <span data-slate-zero-width="n">&#xFEFF;<br /></span>
       </span>
     </span>
   </div>
diff --git a/packages/slate-react/test/rendering/fixtures/custom-inline-void.js b/packages/slate-react/test/rendering/fixtures/custom-inline-void.js
index f8c1f2ed6..35b18eee4 100644
--- a/packages/slate-react/test/rendering/fixtures/custom-inline-void.js
+++ b/packages/slate-react/test/rendering/fixtures/custom-inline-void.js
@@ -63,7 +63,7 @@ export const output = `
     </span>
     <span>
       <span>
-        <span data-slate-zero-width="n">&#xFEFF;</span>
+        <span data-slate-zero-width="n">&#xFEFF;<br /></span>
       </span>
     </span>
   </div>
diff --git a/packages/slate-react/test/rendering/fixtures/empty-block.js b/packages/slate-react/test/rendering/fixtures/empty-block.js
index a5a229356..8f0a4804a 100644
--- a/packages/slate-react/test/rendering/fixtures/empty-block.js
+++ b/packages/slate-react/test/rendering/fixtures/empty-block.js
@@ -19,7 +19,7 @@ export const output = `
   <div style="position:relative">
     <span>
       <span>
-        <span data-slate-zero-width="n">\uFEFF</span>
+        <span data-slate-zero-width="n">&#xFEFF;<br /></span>
       </span>
     </span>
   </div>
diff --git a/packages/slate-react/test/rendering/fixtures/readonly-custom-inline-void.js b/packages/slate-react/test/rendering/fixtures/readonly-custom-inline-void.js
index 53eb43d92..f790f8f59 100644
--- a/packages/slate-react/test/rendering/fixtures/readonly-custom-inline-void.js
+++ b/packages/slate-react/test/rendering/fixtures/readonly-custom-inline-void.js
@@ -55,7 +55,7 @@ export const output = `
     </span>
     <span>
       <span>
-        <span data-slate-zero-width="n">&#xFEFF;</span>
+        <span data-slate-zero-width="n">&#xFEFF;<br /></span>
       </span>
     </span>
   </div>