img with span problem - Githubissues

Frank1e0927 commented 5 years ago

   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

jpuri commented 5 years ago

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 ?

Frank1e0927 commented 5 years ago

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

jpuri commented 5 years ago

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

ElliotZhang commented 5 years ago

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

jpuri / html-to-draftjs

img with span problem #63