RFC: Using JSX with k6

[behnammodi]

Currently, we are using K6 as our main tool for load testing. We have a large number of React components, each responsible for its own data. I was thinking about how we could leverage the readability of JSX for our load testing. This led me to the idea of using JSX in this context. As a result we can have:

export default () => {
  return JSX.call(
    <HomePage>
      <Header />
      <Banner />
      <Footer />
    </HomePage>
  );
};

and HomePage component looks like:

export const HomePage: FC = ({ children }) => {
  const res = http.get('https://example.com/');

  check(res, {
    'state is 200': r => r.status === 200
  });

  // Will perform <Header />, <Banner /> and <Footer /> if status is 200
  return res.status === 200 ? children : null
};

I created a module that allows JSX to be handled in a non-React environment:

https://github.com/behnammodi/jsx-to-call.

Additionally, I created a template called k6-template-jsx for K6:

https://github.com/behnammodi/k6-template-jsx

Please take a look at this idea and let me know if you have any feedback.