Fixed dag and drop .length error

[jobpaardekooper]

If you drag an image into the draft-js editor it throws an error:

insertTextIntoContentState.js:25 Uncaught TypeError: Cannot read property 'length' of null
    at insertTextIntoContentState (insertTextIntoContentState.js:25)
    at Object.replaceText (DraftModifier.js:63)
    at Object.insertText (DraftModifier.js:67)
    at insertTextAtSelection (DraftEditorDragHandler.js:116)
    at onDrop (DraftEditorDragHandler.js:102)
    at DraftEditor.react.js:268
    at HTMLUnknownElement.callCallback (react-dom.development.js:147)
    at Object.invokeGuardedCallbackDev (react-dom.development.js:196)
    at invokeGuardedCallback (react-dom.development.js:250)
    at invokeGuardedCallbackAndCatchFirstError (react-dom.development.js:265)
    at executeDispatch (react-dom.development.js:571)
    at executeDispatchesInOrder (react-dom.development.js:596)
    at executeDispatchesAndRelease (react-dom.development.js:695)
    at executeDispatchesAndReleaseTopLevel (react-dom.development.js:704)
    at forEachAccumulated (react-dom.development.js:676)
    at runEventsInBatch (react-dom.development.js:844)
    at runExtractedEventsInBatch (react-dom.development.js:852)
    at handleTopLevel (react-dom.development.js:5030)
    at batchedUpdates$1 (react-dom.development.js:21469)
    at batchedUpdates (react-dom.development.js:2247)
    at dispatchEvent (react-dom.development.js:5110)
    at react-dom.development.js:21526
    at Object.unstable_runWithPriority (scheduler.development.js:255)
    at interactiveUpdates$1 (react-dom.development.js:21525)
    at interactiveUpdates (react-dom.development.js:2268)
    at dispatchInteractiveEvent (react-dom.development.js:5086)
insertTextIntoContentState @ insertTextIntoContentState.js:25
replaceText @ DraftModifier.js:63
insertText @ DraftModifier.js:67
insertTextAtSelection @ DraftEditorDragHandler.js:116
onDrop @ DraftEditorDragHandler.js:102
(anonymous) @ DraftEditor.react.js:268
callCallback @ react-dom.development.js:147
invokeGuardedCallbackDev @ react-dom.development.js:196
invokeGuardedCallback @ react-dom.development.js:250
invokeGuardedCallbackAndCatchFirstError @ react-dom.development.js:265
executeDispatch @ react-dom.development.js:571
executeDispatchesInOrder @ react-dom.development.js:596
executeDispatchesAndRelease @ react-dom.development.js:695
executeDispatchesAndReleaseTopLevel @ react-dom.development.js:704
forEachAccumulated @ react-dom.development.js:676
runEventsInBatch @ react-dom.development.js:844
runExtractedEventsInBatch @ react-dom.development.js:852
handleTopLevel @ react-dom.development.js:5030
batchedUpdates$1 @ react-dom.development.js:21469
batchedUpdates @ react-dom.development.js:2247
dispatchEvent @ react-dom.development.js:5110
(anonymous) @ react-dom.development.js:21526
unstable_runWithPriority @ scheduler.development.js:255
interactiveUpdates$1 @ react-dom.development.js:21525
interactiveUpdates @ react-dom.development.js:2268
dispatchInteractiveEvent @ react-dom.development.js:5086

With this change the editor checks if there is any text and if there is it handles it like normal, if there isn't it does nothing.

Closes: #2116

[facebook-github-bot]

Thank you for your pull request and welcome to our community. We require contributors to sign our Contributor License Agreement, and we don't seem to have you on file. In order for us to review and merge your code, please sign up at https://code.facebook.com/cla. If you are contributing on behalf of someone else (eg your employer), the individual CLA may not be sufficient and your employer may need the corporate CLA signed.

If you have received this in error or have any questions, please contact us at [email protected]. Thanks!

[facebook-github-bot]

Thank you for signing our Contributor License Agreement. We can now accept your code for this (and any) Facebook open source project. Thanks!

[jobpaardekooper]

This is also a proper fix for: #291.

[claudiopro]

Thanks for contributing this fix @jobpaardekooper! Please take a look at the comments inline.

[jobpaardekooper]

Also correctly addresses #1293 and #494.

[jobpaardekooper]

@claudiopro thank you for the tips and the reasoning behind them!

[claudiopro]

LGTM! 👍

[facebook-github-bot]

@claudiopro has imported this pull request. If you are a Facebook employee, you can view this diff on Phabricator.

[facebook-github-bot]

@claudiopro merged this pull request in 2487e7d.