The useage is that we start wdio connecting to Selenium grid, within the testrun metrics via selenium grid are collected using the devtools, and as from there the data is send to InfluxDB. let me go through all the tools on high level, starting with webdriverio

What is WebdriverIO?

WebdriverIO is a Node.js-based test automation framework designed for end-to-end (E2E) testing of web and mobile applications. It provides a user-friendly API to interact with browsers and supports both the WebDriver protocol and Chrome DevTools Protocol (CDP).

Key Components

The useage of webdriverio in combination with selenium grid has benifits. Before we dive into this let us explain what selenium grid 4 is.

Introduction to Selenium Grid 4

Selenium Grid is a part of the Selenium Suite that specializes in running multiple tests across different browsers, operating systems, and machines in parallel. It achieves this by routing commands of your test scripts to browser instances that are running on remote machines. Each of these machines can run multiple instances of a browser, and the Grid manages the allocation of these browser instances to your tests. The key components that make up Selenium Grid are the Hub and Nodes.

Hub

The Hub acts as the central point where the tests are loaded. When you execute your Selenium tests, the Hub receives the test commands and understands on which browser, version, and platform (operating system) the test should run. There is typically only one Hub in a Selenium Grid setup. It listens to test requests and assigns them to Nodes that match the test’s requirements.

Nodes

Nodes are the machines that actually run the tests. A Grid can have one or many Nodes. Each Node registers with the Hub, specifying the browser versions and platforms (operating systems) it supports. When the Hub receives a request to run a test on a specific browser/version/platform, it searches for a Node that matches the criteria. Once a match is found, the Hub sends the test commands to that Node. A Node can run multiple browser instances, but the exact number depends on the resources (CPU, memory) of the machine and how the Node is configured.

Key Features and Benefits

• Parallel Execution: Selenium Grid allows for the parallel execution of tests, which can significantly reduce the time required for running large test suites.
• Cross-Browser Testing: It enables cross-browser testing by supporting tests across different browser types simultaneously.
• Cross-Platform Testing: Tests can be run on different operating systems (Windows, Linux, macOS) from the same test suite, making it easier to ensure compatibility across environments.
• Scalability: Grid’s architecture allows for scaling up by adding more Nodes to handle a larger volume of tests, or scaling out to include different browsers and operating systems.
• Resource Optimization: By distributing tests across various machines, Selenium Grid optimizes the use of resources, allowing for more efficient use of testing infrastructure.

Now we have an idea what selenium grid is what are the benifits of using it with wdio

Benefits of Combining WebdriverIO with Selenium Grid

• Cross-browser testing: Run tests on Chrome, Firefox, Safari, etc.
• Parallel execution: Speed up test runs by using multiple nodes.
• Distributed testing: Test across different machines and operating systems.
• Scalability: Add more nodes as test complexity grows.

This sounds like we are busy with ramping up a performance test are we ;-)

How does Influxdb fit into this

InfluxDB is a high-performance time series database that excels at storing and querying time-stamped data like performance metrics. When used in combination with WebdriverIO’s DevTools integration, custom hooks can extract key performance indicators such as:

• First Contentful Paint
• DOM Load Time
• XHR Response Time
• Test execution duration

These metrics are pushed into InfluxDB in real-time, where they are indexed and stored efficiently for high-speed analysis.

Graphana

Grafana reads data from InfluxDB and displays interactive dashboards that can show trends like response time, success/failure rate, and throughput. You can configure real-time visualizations, custom thresholds, and historical comparisons, making it easy to spot regressions across builds.

How They Work Together

[WDIO Test] → triggers test
   |
   └──> [Selenium Grid] → spins up browser containers
           |
           └──> Browser runs test + measures timing
                       |
                       └──> WDIO hook logs metric
                                |
                                └──> Metric sent to InfluxDB
                                         |
                                         └──> Grafana visualizes results

This full stack creates a real-time feedback loop for performance engineering:

• Trigger → Measure → Store → Visualize → Optimize

Why This Stack?

• Flexible: you control test cases and infrastructure
• Scalable: run 1 test or 100 in parallel
• Real-time: monitor test trends as they happen
• Open source: cost-effective and customizable

Summary

Each tool in this stack plays a key role:

• WDIO runs your test code
• Selenium Grid scales browser execution
• InfluxDB stores performance metrics
• Grafana shows the performance metrics in a graph

In module 2 we are going to install the demo project and showcase you can create a performance measurement using all tools installed