Merge pull request #6002 from marmelab/fix-nullablebooleaninput-ignor…

…es-defaultvalue Fix NullabelBooleanInput Ignores defaultValue
marmelab · Mar 7, 2021 · 727b5e2 · 727b5e2
2 parents 65e0f60 + c0485b7
commit 727b5e2
Show file tree

Hide file tree

Showing 2 changed files with 86 additions and 0 deletions.
diff --git a/packages/ra-ui-materialui/src/input/NullableBooleanInput.spec.tsx b/packages/ra-ui-materialui/src/input/NullableBooleanInput.spec.tsx
@@ -77,6 +77,35 @@ describe('<NullableBooleanInput />', () => {
         ).toBeNull();
     });
 
+    it('should select the option "true" if defaultValue is true', () => {
+        const { container, getByRole, getByText, getAllByText } = render(
+            <Form
+                onSubmit={jest.fn}
+                render={() => (
+                    <NullableBooleanInput
+                        source="isPublished"
+                        resource="posts"
+                        defaultValue
+                    />
+                )}
+            />
+        );
+        expect(container.querySelector('input').getAttribute('value')).toBe(
+            'true'
+        );
+        const select = getByRole('button');
+        fireEvent.mouseDown(select);
+        expect(
+            getAllByText('ra.boolean.true')[1].getAttribute('aria-selected')
+        ).toBe('true');
+        expect(
+            getByText('ra.boolean.false').getAttribute('aria-selected')
+        ).toBeNull();
+        expect(
+            getByText('ra.boolean.null').getAttribute('aria-selected')
+        ).toBeNull();
+    });
+
     it('should select the option "false" if value is false', () => {
         const { getByRole, getByText, getAllByText, container } = render(
             <Form
@@ -108,6 +137,35 @@ describe('<NullableBooleanInput />', () => {
         ).toBeNull();
     });
 
+    it('should select the option "false" if defaultValue is false', () => {
+        const { getByRole, getByText, getAllByText, container } = render(
+            <Form
+                onSubmit={jest.fn}
+                render={() => (
+                    <NullableBooleanInput
+                        source="isPublished"
+                        resource="posts"
+                        defaultValue={false}
+                    />
+                )}
+            />
+        );
+        expect(container.querySelector('input').getAttribute('value')).toBe(
+            'false'
+        );
+        const select = getByRole('button');
+        fireEvent.mouseDown(select);
+        expect(
+            getByText('ra.boolean.true').getAttribute('aria-selected')
+        ).toBeNull();
+        expect(
+            getAllByText('ra.boolean.false')[1].getAttribute('aria-selected')
+        ).toBe('true');
+        expect(
+            getByText('ra.boolean.null').getAttribute('aria-selected')
+        ).toBeNull();
+    });
+
     it('should select the option "null" if value is null', () => {
         const { getByRole, getByText, container } = render(
             <Form
@@ -137,6 +195,33 @@ describe('<NullableBooleanInput />', () => {
         );
     });
 
+    it('should select the option "null" if defaultValue is null', () => {
+        const { getByRole, getByText, container } = render(
+            <Form
+                onSubmit={jest.fn}
+                render={() => (
+                    <NullableBooleanInput
+                        source="isPublished"
+                        resource="posts"
+                        defaultValue={null}
+                    />
+                )}
+            />
+        );
+        expect(container.querySelector('input').getAttribute('value')).toBe('');
+        const select = getByRole('button');
+        fireEvent.mouseDown(select);
+        expect(
+            getByText('ra.boolean.true').getAttribute('aria-selected')
+        ).toBeNull();
+        expect(
+            getByText('ra.boolean.false').getAttribute('aria-selected')
+        ).toBeNull();
+        expect(getByText('ra.boolean.null').getAttribute('aria-selected')).toBe(
+            'true'
+        );
+    });
+
     it('should allow to customize the label of the null option', () => {
         const { getByRole, getByText, container } = render(
             <Form

diff --git a/packages/ra-ui-materialui/src/input/NullableBooleanInput.tsx b/packages/ra-ui-materialui/src/input/NullableBooleanInput.tsx
@@ -75,6 +75,7 @@ const NullableBooleanInput: FunctionComponent<NullableBooleanInputProps> = props
         resource,
         source,
         validate,
+        ...rest,
     });
 
     return (