Draft.js editor is empty

Question

How to test if the content of draftjs editor is empty?

The only idea that I have now is an object comparison against the object returned from this function : EditorState.createEmpty().getCurrentContent()

check that out: https://stackoverflow.com/questions/47420136/how-to-check-empty-spaces-in-draft-js-editor/68093543#68093543 — Marcello Manuel Borges da Cost, Jun 23 '21 at 04:36

zianwar · Accepted Answer · 2020-05-03T08:17:44.760

61

Just use the hasText function on ContentState :

editorState.getCurrentContent().hasText()

edited May 03 '20 at 08:17

answered Jul 05 '16 at 11:13

zianwar

3,642
3
28
37

3

Does this work with editor states that have only images etc? I have read the docs of `draftjs` and there doesn't seem to be a straight-forward way to check if editor state is empty. I think they left this as an implementation detail because it is not clearly understood what the meaning of `empty` is, maybe because even if the editor state is `empty`, it contains other info like cursor position, placeholder etc which may not be the exact kind of content we would like to check for. I could be wrong, let me know if this helps. – kaushik94 Oct 31 '16 at 11:00
This is nice. But the issue is that even if the user has typed only spaces then also it will return true. How to check that case? – sktguha Oct 19 '20 at 21:43

score 6 · Answer 2 · answered Aug 18 '21 at 14:48

6

 contentState.hasText() && contentState.getPlainText().length > 0

Check

Empty
White Space

answered Aug 18 '21 at 14:48

Zanyar Jalal

1,407
12
29

score 2 · Answer 3 · answered Nov 07 '18 at 07:29

export const isEmptyDraftJs = (rawState) => {
  if (!rawState || _.isEmpty(rawState)) { // filter undefined and {}
    return true;
  }
  const contentState = convertFromRaw(rawState);
  return !(contentState.hasText() && (contentState.getPlainText() !== ''));
};

I am not sure it is perfect but I use above code.

When you add just image, there is an space character so getPlainText() can filter only image draftJS.

score 0 · Answer 4 · answered Oct 22 '22 at 13:57

0

const text=editorState.getCurrentState().getPlainText()
return text===''

answered Oct 22 '22 at 13:57

chenjiahe

29
5

1

While this code may answer the question, providing additional context regarding how and/or why it solves the problem would improve the answer's long-term value. You can find more information on how to write good answers in the help center: https://stackoverflow.com/help/how-to-answer . Good luck – nima Oct 25 '22 at 08:48

Draft.js editor is empty

4 Answers4

Check