draft-js-utils icon indicating copy to clipboard operation
draft-js-utils copied to clipboard

Call Stack Exceeded on large HTML Imports

Open skswanke opened this issue 7 years ago • 1 comments

When trying to import lengthy html to draft state most browsers (Chrome, Firefox, Safari) crash with call stack exceeded error.

Steps to reproduce:

  1. (In a react app with react-draft-wysiwyg) in constructer convert html
  2. convert large html string (in my case 75,000+ characters) to draftjs using stateFromHTML()
  3. Import will not complete, giving: RangeError: Maximum callstack size exceeded

To solve this I ended up using

import DraftPasteProcessor from 'draft-js/lib/DraftPasteProcessor'

const processedHTML = DraftPasteProcessor.processHTML(value);
const contentState = ContentState.createFromBlockArray(processedHTML);
editorState = EditorState.createWithContent(contentState);

From draftjs own utils.

skswanke avatar Jan 16 '18 17:01 skswanke

Hey @skswanke, I just ran into a similar issue. Can you give https://github.com/sstur/draft-js-utils/pull/139 a try and check if this works for your use case as well?

sbstjn avatar May 30 '18 15:05 sbstjn