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.
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:
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.