Merge pull request marmelab#10670 from marmelab/RichTextField-emptyText

Fix `<RichTextField>` should render `emptyText` when value is an empty string

Author: djhi

packages/ra-ui-materialui/src/field/RichTextField.spec.tsx

@@ -110,7 +110,7 @@ describe('<RichTextField />', () => {
         expect(container.children[0].classList.contains('foo')).toBe(true);
     });
 
-    it.each([null, undefined])(
+    it.each([null, undefined, ''])(
         'should render the emptyText when value is %s and stripTags is set to false',
         body => {
             const { queryByText } = render(
@@ -124,7 +124,7 @@ describe('<RichTextField />', () => {
         }
     );
 
-    it.each([null, undefined])(
+    it.each([null, undefined, ''])(
         'should render the emptyText when value is %s and stripTags is set to true',
         body => {
             const { queryByText } = render(

packages/ra-ui-materialui/src/field/RichTextField.stories.tsx

@@ -133,3 +133,29 @@ It is regarded as one of Tolstoy's finest literary achievements and remains a cl
         <RichTextField source="body" purifyOptions={{ ADD_ATTR: ['target'] }} />
     </RecordContextProvider>
 );
+
+export const Empty = ({ emptyText, body }) => (
+    <RecordContextProvider value={{ id: 1, body }}>
+        <RichTextField source="body" emptyText={emptyText} />
+    </RecordContextProvider>
+);
+Empty.args = {
+    emptyText: 'empty',
+    body: '',
+};
+Empty.argTypes = {
+    emptyText: {
+        options: [undefined, 'empty'],
+        control: { type: 'inline-radio' },
+    },
+    body: {
+        options: [undefined, null, 'empty string', 'foo'],
+        mapping: {
+            undefined: undefined,
+            null: null,
+            'empty string': '',
+            'foo': 'foo',
+        },
+        control: { type: 'inline-radio' },
+    },
+};

packages/ra-ui-materialui/src/field/RichTextField.tsx

@@ -44,7 +44,7 @@ const RichTextFieldImpl = <
             component="span"
             {...sanitizeFieldRestProps(rest)}
         >
-            {value == null && emptyText ? (
+            {(value == null || value === '') && emptyText ? (
                 translate(emptyText, { _: emptyText })
             ) : stripTags ? (
                 removeTags(value)