score:1

Accepted answer

since you export your raw component

export { projectpageui as projectpageuicomponent }

you can test it directly without the need to mock up a redux provider and store

import { projectpageuicomponent } from '.'; // import raw component

...

test('shallow-render without crashing', () => {

  const props = { 
    match: { params: {} },
    project: { /* now mock up a project object for testing */ }
    // mock/supply any other required props
  }

  shallow(<projectpageuicomponent {...props} />)
});

have you considered react-testing-library? imo it is a much cleaner way to test ui components. for a simple "renders without crashing" test it is very similar to the above.

score:1

try to wrap you component with redux provider component the makes the redux store available to any nested components that have been wrapped in the connect() function.

shallow(
  <provider store={store}>
    <projectpageuicomponent {...props} />
  </provider>)

score:1

pretty stupid, but it was an issue of wrong importing of the projectpageui. i imported it as:

import { projectpageuicomponent } from './projectpageui'

which imports the unconnected component, but should have imported the defaults' way:

import projectpageui from './projectpageui'

which worked out


Related Query

More Query from same tag