Skip to content

christian-bromann/webdriverio-performance-testing

Repository files navigation

Automated Performance Testing With WebDriver

This project contains an example test suite written in WebdriverIO to showcase performance tests using WebDriver. It uses an example application based on the tutorial "Optimize Website Speed With Chrome DevTools" from the Google Developers page. After you've followed the steps on how to optimize the loading speed for that application you can run the test suite and will notice that all test pass. After that you can undo the changes and see how this affects the performance metrics and causes the test to fail.

Video to the tutorial

Setup

To run this demo you need to have Node.js (v8 or higher) installed on your machine. Then clone the repo and install dependencies:

$ git clone git@github.com:christian-bromann/webdriverio-performance-testing.git
$ cd webdriverio-performance-testing
$ npm install

Now you are good to go to run the scenarios.

To run all the scenarios, use the below command

$ npm run test:local

Page Weight Scenario

To optimize for page weight the tutorial author did the following steps:

  • in server.js add compression to your Express.js server so images are being served compressed:

    const compression = require('compression');
    app.use(compression())
  • in src/model.js change the variable dir in line 3 from big to small in order to load optimized images

  • in webpack.config.js change the mode from development to production to enable tree shaking and serve less script payload

To run the test call:

$ npm run test:local -- --spec pageWeight

Script Blocking Scenario

To optimize the page load speed further the author did some optimizations to the application logic:

  • in template.html remove the LoDash and jQuery scripts since they are not used at all and block the page from being loaded
  • in src/App.jsx remove the function call this.mineBitcoin(1500); in the constructor which was responsible for a lot of CPU heavy computation during page load.

To run the test call:

$ npm run test:local -- --spec scriptBlocking

This project is a demo for my talk at #NodeJSInteractive on "Automated Performance Testing With WebDriver".

About

A small showcase on how to test performance using WebdriverIO

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published