Merge pull request #1374 from rvsia/alwaysUseOverridenProps

Always use overriden props

Author: rvsia

packages/react-form-renderer/src/form-renderer/render-form.js

@@ -86,15 +86,21 @@ FormConditionWrapper.propTypes = {
   field: PropTypes.object,
 };
 
-const SingleField = ({ component, condition, hideField, ...rest }) => {
+const SingleField = ({ component, ...rest }) => {
   const { actionMapper, componentMapper } = useContext(RendererContext);
 
   const { componentProps, Component, overrideProps, mergedResolveProps } = prepareComponentProps({ component, rest, componentMapper, actionMapper });
 
+  const { condition, hideField, ...restProps } = {
+    ...componentProps,
+    ...overrideProps,
+    ...(mergedResolveProps && { resolveProps: mergedResolveProps }),
+  };
+
   return (
-    <FormConditionWrapper condition={condition} field={componentProps}>
+    <FormConditionWrapper condition={condition} field={restProps}>
       <FormFieldHideWrapper hideField={hideField}>
-        <Component {...componentProps} {...overrideProps} {...(mergedResolveProps && { resolveProps: mergedResolveProps })} />
+        <Component {...restProps} />
       </FormFieldHideWrapper>
     </FormConditionWrapper>
   );

packages/react-form-renderer/src/tests/form-renderer/condition.test.js

@@ -100,6 +100,46 @@ describe('condition test', () => {
     expect(() => screen.getByLabelText('field-2')).toThrow();
   });
 
+  it('should render when condition is fulfill - when is a function from action mapper', async () => {
+    const whenSpy = jest.fn().mockImplementation(() => 'field-1');
+    const actionMapper = {
+      condition: () => [
+        {
+          when: whenSpy,
+          is: 'show',
+        },
+      ],
+    };
+
+    schema = {
+      fields: [
+        {
+          component: componentTypes.TEXT_FIELD,
+          name: 'field-1',
+        },
+        {
+          component: componentTypes.TEXT_FIELD,
+          name: 'field-2',
+          actions: { condition: ['condition'] },
+        },
+      ],
+    };
+
+    render(<FormRenderer {...initialProps} schema={schema} actionMapper={actionMapper} />);
+
+    expect(whenSpy.mock.calls[0][0]).toEqual({ component: 'text-field', name: 'field-2' });
+
+    expect(() => screen.getByLabelText('field-2')).toThrow();
+
+    await userEvent.type(screen.getByLabelText('field-1'), 'show');
+
+    expect(screen.getByLabelText('field-2')).toBeInTheDocument();
+
+    await userEvent.type(screen.getByLabelText('field-1'), 'dont');
+
+    expect(() => screen.getByLabelText('field-2')).toThrow();
+  });
+
   it('sets value when condition is fulfill', async () => {
     schema = {
       fields: [