How to use webpack to manually test react components?

I know we should use unit tests for our components. But what I also want, is some way to manually test our components in isolation. Because we are working on small sprints in which we must deliver some finished component before having the page that first uses that component. And I want to see that full component really working (i.e. test integration with css and sub-components).

So to start with, I would like to see that new component rendered in black page that doesn't that component directly, but to take that component name/path from a query-string parameter. And then I plan to add to that page some generic component configuration (e.g. a textbox with json representing the props to pass to that component).

The first problem I'm facing now is about how to configure , webpack-dev-middleware, or webpack-dev-server to be able to load a component passed by parameter.

Anyone know how to that? Or a better way to handle this?

I would try something like this:

  1. Set up an entry point that uses require.context.
  2. Invoke require within that context based on your querystring. You should have you React component now. Render that through React.

In order to generate the test controls I would include the meta within the component using JSON Schema. The form controls could be then generated using some form generator such as plexus-form or tcomb-form.