Learn about more WebPageTest API Integrations in our docs

Visual Studio Code Extension For WebPageTest

The Visual Studio Code(Vscode) Extension for WebPageTest lets you run tests against WebPageTest from within Vscode. Once the tests are complete, some of the performance metrics, a copy of the waterfall, screenshot, and a link to the full results will be displayed in Vscode, right where you are developing, helping you to easily troubleshoot and diagnose performance issues directly from Vscode and possibly refactor the code if needed.

Features:

• Run WebPageTest from within Vscode, and get the results back in Vscode

Updating Vscode Settings

To update the settings for Vscode, we need to open settings.json file on Vscode. Open your command palette on Vscode (command/ctrl + shift + P) and start typing "Settings", click on 'Preferences: Open Settings (JSON)' from the command palette.

You'll need an API key to run the extension. Get yours here

The following properties are configurable in your settings.json file:

// Your WebPageTest API key. REQUIRED
"WebPageTest.apiKey": "YOUR_API_KEY",

// The URL to test. If left out of settings.json, the extension will prompt you for a URL when run.
"WebPageTest.urlToTest": null,

// The location to test from. The location is comprised of the location of the testing agent, the browser to test on, and the connectivity in the following format: location:browser.connectivity.
"WebPageTest.location": "Dulles:Chrome.Cable",

// The number of tests to run
"WebPageTest.runs": 1,

// The interval (in seconds) to poll the API for test results
"WebPageTest.pollResults": 5,

// The maximum time (in seconds) to wait for test results
"WebPageTest.timeout": 240,

Find all the supported locations here.

Running The Test

In the new window of Vscode, open the command palette(command/ctrl + shift + P) and start typing WebPageTest, you should see a WebPageTest command in it. Run the command.

If you had not entered the URL before you get an option to enter it, the test requires an URL to run. Below option is only asked if you had not entered an URL in settings.json

Once the test is submitted, you get the below response on Vscode.

And, when the test has successfully run, you get the metrics, waterfall and screenshot from the test.