{"id":4675,"date":"2018-03-09T09:57:02","date_gmt":"2018-03-09T14:57:02","guid":{"rendered":"https:\/\/www.redline13.com\/blog\/?p=4675"},"modified":"2018-03-09T09:57:02","modified_gmt":"2018-03-09T14:57:02","slug":"capturing-api-performance-data-firefox-chrome-webdriver-test","status":"publish","type":"post","link":"https:\/\/www.redline13.com\/blog\/2018\/03\/capturing-api-performance-data-firefox-chrome-webdriver-test\/","title":{"rendered":"Capturing API Performance Data from Firefox or Chrome during Webdriver Test"},"content":{"rendered":"
In support of running selenium webdriver tests<\/a> at scale, we built a simple wrapper for webdriver.<\/div>\n
\n
The wrapper is\u00a0open source<\/a> and easy to run on a single machine, while RedLine13 can run it on 1,000 machines.<\/div>\n<\/div>\n
<\/div>\n

Initial support for performance metrics:<\/p>\n

Collecting real-time metrics by running via PhantomJS.<\/h3>\n
We injected javascript into PhantomJS to listen to onResourceRequested<\/a> and onResourceReceived<\/a>.\u00a0 We could also track errors and timeouts.\u00a0 You can see here<\/a> how we tracked and summarized this data.\u00a0 As well as emitting performance data to report back or write to\u00a0Apache JMeter JTL Performance file.<\/div>\n
<\/div>\n

Collecting metrics after test completed in Chrome<\/h3>\n
Chrome’s performance logs will give fine grain details of all events, however, accessing the log was easier when the test completed.\u00a0 This gave us full access to the log details.\u00a0 Enabling performance logs via webdriver is simple, just set the capabilities.builder.getCapabilities().setLoggingPrefs({'performance': 'ALL'});<\/code>\u00a0 \u00a0Read details of enabling Performance Log here<\/a>.\u00a0 \u00a0 Our code processes the log to summarize the API performance and convert to Apache JMeter JTL format.<\/div>\n
<\/div>\n

Firefox to run tests but no metrics support<\/h3>\n
Firefox does not have a built in\u00a0mechanism to collect performance metrics.\u00a0 You would need to write a plugin which monitored the streams.\u00a0 \u00a0We have a plugin to do that\u00a0https:\/\/github.com\/redline13\/selenium-jmeter but it was written to be a recorder that worked with Selenium IDE plugin.<\/div>\n
<\/div>\n

Adding support via Browser Performance APIs<\/h3>\n
However, we had not looked at how to use\u00a0Browser Performance APIs<\/a>\u00a0to collect metrics during a test.\u00a0 We realize that by executing a script in the browser at any given point we can return back all the performance data and process for reporting in real-time or writing to Apache JMeter JTL.<\/div>\n
Here is how we did it (source here<\/a>)<\/div>\n
\n
RedLineWebDriver.driver.executeScript(`\n  \/\/ PhantomJS does not support so don't execute if not available.\n  if ( ! window.performance || !window.performance.timeOrigin )\n    return null;\n\n  var data = {\n    \/\/ We need origin for timestamps\n    start : Math.round(window.performance.timeOrigin),\n    \/\/ The page we are on\n    navigation: window.performance.getEntriesByType('navigation'),\n    \/\/ All metrics available\n    resources: window.performance.getEntriesByType('resource')\n  };\n  \/\/ Clear so next time we get new data\n  window.performance.clearResourceTimings();\n  return data;\n`).then( function(metrics){ ... do things ... } );<\/pre>\n
We have further simplified this in our module<\/p>\n
To record metrics at any time in Chrome or Chrome-Headless<\/h3>\n
\/\/ include redline\nvar redline = require( 'redline13-webdriver' );\n\n\/\/ load your driver via redline13\n\/\/ redline13 library uses standard mechanism but presets some capabilities\n\/\/ browsers available - chrome, chrome-headless, firefox, firefox-headless, phantomjs\nvar browser = redline.loadBrowser('chrome');\n\n\/\/ You can require webdriver yourself or use redline13.webdriver\nvar By = redline.webdriver.By;\nvar until = redline.webdriver.until;\n\n\/\/ Start your script\nbrowser.get( \"http:\/\/example.com\" );\n\/\/ Do your normal operations\n\n\/\/ Record what is currently available\nbrowser.recordrecordMetrics( \"example\" );<\/pre>\n
Firefox and Firefox headless support<\/h3>\n
Since firefox had no metrics support we manipulate webdriver .get to automatically\u00a0collect performance data.\u00a0 The call to browser.recordMetrics can still be used to collect metrics at other points of your script.\u00a0 See how we override the function at the source of firefox-headless.js<\/a>.<\/p>\n<\/div>\n
Limitations<\/h3>\n
There are limitations to using this approach<\/div>\n