html-to-draftjs icon indicating copy to clipboard operation
html-to-draftjs copied to clipboard

img with span problem

Open Frank1e0927 opened this issue 7 years ago • 4 comments

   const blocksFromHtml = htmlToDraft(this.props.value);
    const { contentBlocks, entityMap } = blocksFromHtml;
    const contentState = ContentState.createFromBlockArray(contentBlocks, entityMap);
    const editorState = EditorState.createWithContent(contentState);
    this.state = {
      editorState,
      loading: false
    };
<Editor editorState={this.state.editorState} defaultEditorState={this.state.editorState}/>

here props value just is img tag with src

it will throw an error Unknown DraftEntity key: null.

why ????

and if i pass

<p></p>
<img src="..."/>

it will work

and if i pass

<p></p>
<img src="..."/>
<span>it will invisible or miss in editor<span>

// or

<p></p>
<img src="..."/>it will invisible or miss in editor

it will invisible all the element after img tag

Hope to get the answer

Frank1e0927 avatar Jan 04 '19 04:01 Frank1e0927

Hey @Frank1e0927 , there is a limitation - currently the library best works with only html produced by https://github.com/jpuri/react-draft-wysiwyg it can not take care of any arbitrary html.

Is this HTML generated by above wysiwyg ?

jpuri avatar Jan 04 '19 07:01 jpuri

Hey @Frank1e0927 , there is a limitation - currently the library best works with only html produced by https://github.com/jpuri/react-draft-wysiwyg it can not take care of any arbitrary html.

Is this HTML generated by above wysiwyg ?

yes, i used react-draft-wysiwyg

Frank1e0927 avatar Jan 07 '19 08:01 Frank1e0927

But AFAIK lib does not produce span like this. Can you plz details the step to reproduce this.

jpuri avatar Jan 12 '19 06:01 jpuri

We have this issue because we try to migrate our UI to use this component but some pre-exisiting HTML data just break.

ElliotZhang avatar May 10 '19 02:05 ElliotZhang