- use keyBindingFn for handling enter - so that fallback resolves without interference

Author: juliankrispel

src/__test__/plugin.test.js

@@ -1,4 +1,3 @@
-import sinon from "sinon";
 import Draft, { EditorState, SelectionState, ContentBlock } from "draft-js";
 import {
   CheckableListItem,
@@ -105,8 +104,11 @@ describe("draft-js-markdown-plugin", () => {
       });
       describe("handleReturn", () => {
         beforeEach(() => {
-          subject = () =>
-            plugin.handleReturn(event, store.getEditorState(), store);
+          subject = () => {
+            event = new window.KeyboardEvent("keydown", { which: 13 });
+            jest.spyOn(event, "preventDefault");
+            return plugin.keyBindingFn(event, store);
+          };
         });
         it("does not handle", () => {
           currentRawContentState = {
@@ -123,7 +125,7 @@ describe("draft-js-markdown-plugin", () => {
               },
             ],
           };
-          expect(subject()).toBe("not-handled");
+          expect(subject()).toBe(null);
           expect(modifierSpy).not.toHaveBeenCalledTimes(1);
           expect(store.setEditorState).not.toHaveBeenCalled();
         });

src/index.js

@@ -7,7 +7,7 @@ import {
 } from "draft-js-checkable-list-item";
 
 import { Map } from "immutable";
-
+import { getDefaultKeyBinding, Modifier, EditorState } from "draft-js";
 import adjustBlockDepth from "./modifiers/adjustBlockDepth";
 import handleBlockType from "./modifiers/handleBlockType";
 import handleInlineStyle from "./modifiers/handleInlineStyle";
@@ -152,23 +152,31 @@ const createMarkdownPlugin = (config = {}) => {
       }
       return "not-handled";
     },
-    handleReturn(ev, editorState, { setEditorState }) {
-      let newEditorState = checkReturnForState(editorState, ev);
-      if (editorState !== newEditorState) {
-        setEditorState(newEditorState);
-        return "handled";
-      }
+    keyBindingFn(ev, { getEditorState, setEditorState }) {
+      if (ev.which === 13) {
+        const editorState = getEditorState();
+        let newEditorState = checkReturnForState(editorState, ev);
+        if (editorState !== newEditorState) {
+          setEditorState(newEditorState);
+          return "handled";
+        }
 
-      // If we're in a code block don't add markdown to it
-      if (inCodeBlock(editorState)) return "not-handled";
+        newEditorState = checkCharacterForState(editorState, "");
+        if (!inCodeBlock(editorState) && editorState !== newEditorState) {
+          const contentState = Modifier.splitBlock(
+            newEditorState.getCurrentContent(),
+            newEditorState.getSelection()
+          );
 
-      newEditorState = checkCharacterForState(editorState, "\n");
-      if (editorState !== newEditorState) {
-        setEditorState(newEditorState);
-        return "handled";
+          setEditorState(
+            EditorState.push(newEditorState, contentState, "split-block")
+          );
+
+          return "handled";
+        }
       }
 
-      return "not-handled";
+      return getDefaultKeyBinding(ev);
     },
     handleBeforeInput(character, editorState, { setEditorState }) {
       if (character !== " ") {

src/modifiers/changeCurrentInlineStyle.js

@@ -27,7 +27,7 @@ const changeCurrentInlineStyle = (editorState, matchArr, style, character) => {
     wordSelection.merge({
       anchorOffset: wordSelection.getFocusOffset() - markdownCharacterLength,
     }),
-    character || " "
+    character == null ? " " : character
   );
 
   let afterSelection = newContentState.getSelectionAfter();