Load Testing Single Page App (react)

[srcd4]

How do you go about testing SPA'S using xlt? How do you go about navigating to log in "page" or to any other "page"?

I've downloaded xlt 6.2.5 and when I try to find page elements using selectors, the elements aren't found. Do I need to enable anything in the properties files? Thanks!

[rschwietzke]

I assume you are talking about performance testing?

PWA is a difficult beast because it depends heavily on the JavaScript stack as well as on the rendering of components. The current underlying version of the library HtmlUnit does not fully support Chrome-like JS and rendering.

Most load test tools don't support rendering at all (but XLT has an option, see later), and therefore you have to load test the API behind the PWA. Load and performance testing in this case is not about the rendering performance, rather the backend performance.

HtmlUnit is working on improving the support, but likely will never behave like a real browser.

Hence, you can go different routes:

1. Focus on the API only for performance testing and address functional testing with another tool, such as Neodymium (WebDriver-based), Cypress, WebDriver.io or others
2. Use XLT with a real browser and performance test with this (but you have to "pay" with hardware when you scale up, browsers are thirsty). Have a look at our real-browser load test suite.
3. Let's have a chat again to see what problem you try to solve.

[srcd4]

Thank you for the quick response!

I am using the simple load test suite available in github: https://github.com/Xceptance/posters-simple-loadtest-suite

I modified it so that it hits the website I need to load test, which is written using React. When I try to do any validation (e.g header navigation, navigation bar) the code can't find the web elements. This is an example:

This will not allow me to create load tests for search, browse and orders in the website I am trying to load test. This is a code snippet for search:

Is number 2 in your answer the only option when load testing (with xlt) websites using React, Angular or any other SPA frameworks?

Thank you!

[rschwietzke]

As mentioned before, React-based sites are heavily in JS and custom rendering, hence when you don't have a full blow real browser, you don't get what you want. The load test strategies are:

• Move to the full browser load test suite and use a real browser for load testing. You need more hardware to scale the test later, basically you write a standard functional automated test and later scale it up and let XLT orchestrate that as well as measure
• You avoid the rendering mess and focus on the delivery of the information, aka you run a pure API test. You "play" React and JS by just fetching data using POST and GET for instance.