How to test component view in React-Admin using <TestContext>?

Viewed 400

I am wondering how to use <TestContext> as a sufficient tool for testing react-admin custom components view. So far we have not encountered an error rendering basic HTML element inside <TestContext>, but with RA component test are failing mostly due to:

TypeError: Cannot create proxy with a non-object as target or handler

In our case, we do not have a redux store connected to our component and for now, just want to test the display with simple props using an example from documentation.

describe('<EditManufacturer/>', () => {
  let testUtils: any;

  beforeEach(() => {
    const mockEditManufacturerProps = {
      basePath: '/',
      id: '123',
      resource: 'foo',
    };

    testUtils = render(
    <TestContext>
      <EditManufacturer {...mockEditManufacturerProps}/>
    </TestContext>)
  });


  // test

  })
});

Example syntax above produces another error:

Cannot read property '{"type":"GET_ONE","resource":"foo","payload":{"id":"123"}}' of undefined

Here is our EditManufacturer.tsx component:

const EditManufacturer:React.FC<EditProps> = props => {
  return(
    <Edit {...props}>
      <SimpleForm>
        <ManufacturerInputFields/>
      </SimpleForm>
    </Edit>

  )};

export default EditManufacturer;

Is injecting all the required props for HOCs and then mounting the view as mentioned in answer here or using e2e tests the only solution? Any help would be appreciated.

0 Answers
Related