Fix movable blocks when editor is readOnly (#315)

globocom · Apr 14, 2020 · 1055019 · 1055019
1 parent d5023de
commit 1055019
Show file tree

Hide file tree

Showing 2 changed files with 26 additions and 13 deletions.
diff --git a/src/components/MegadraftEditor.js b/src/components/MegadraftEditor.js
@@ -98,19 +98,20 @@ export default class MegadraftEditor extends Component {
       for (let [blockType, data] of DefaultDraftBlockRenderMap.entrySeq()) {
         r.set(blockType, {
           ...data,
-          wrapper: this.props.movableBlocks ? (
-            <MoveControl
-              wrapper={data.wrapper}
-              swapUp={this.swapUp}
-              swapDown={this.swapDown}
-              isFirstBlock={this.isFirstBlock}
-              isLastBlock={this.isLastBlock}
-              onAction={this.onAction}
-              isAtomic={blockType === "atomic"}
-            />
-          ) : (
-            <MegadraftBlock wrapper={data.wrapper} />
-          )
+          wrapper:
+            !this.props.readOnly && this.props.movableBlocks ? (
+              <MoveControl
+                wrapper={data.wrapper}
+                swapUp={this.swapUp}
+                swapDown={this.swapDown}
+                isFirstBlock={this.isFirstBlock}
+                isLastBlock={this.isLastBlock}
+                onAction={this.onAction}
+                isAtomic={blockType === "atomic"}
+              />
+            ) : (
+              <MegadraftBlock wrapper={data.wrapper} />
+            )
         });
       }
     });

diff --git a/tests/components/MegadraftEditor_test.js b/tests/components/MegadraftEditor_test.js
@@ -838,6 +838,18 @@ describe("MegadraftEditor Component", () => {
       );
     };
 
+    it("should not render MoveControl when readOnly is present", () => {
+      const wrapper = mount(
+        <MegadraftEditor
+          editorState={testContext.editorState}
+          onChange={testContext.onChange}
+          readOnly
+          movableBlocks
+        />
+      );
+      expect(wrapper.find(".move-control").exists()).toBeFalsy();
+    });
+
     it("with the top block by clicking the up control", () => {
       const expected = [
           "block-kst0",