title: Is it possible to pass a React Component to puppeteer?
body: <p>I have a React component with some componentDidMount logic:</p>
  
  <pre><code>export default class MyComponent {
      componentDidMount() {
          // some changes to DOM done here by a library  
      }
  
      render() {
          return (
              &lt;div&gt;{props.data}&lt;/div&gt;
          );
      }
  }
  </code></pre>
  
  <p>Is it possible to pass this component with props so that everything in componentDidMount() gets executed, somehow to puppeteer in order to take a screenshot? Something along these lines:</p>
  
  <pre><code>const browser = await puppeteer.launch({ headless: true });
  const page = await browser.newPage();
  
  const html = ReactDOMServer.renderToString(&lt;MyComponent data='' /&gt;); &lt;-- but this skips the componentDidMount logic
  await page.setContent(html);
  await page.screenshot({ path: 'screenshot.png' });
  </code></pre>
  
  <p>I know I could use <code>page.goto()</code>, but I have some complex login logic that I would like to avoid with a shortcut like this and instead pass all the needed props just directly to the component?</p>