Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Chrome Code Coverage Automation
import * as fs from "fs";
import { createSession } from "chrome-debugging-client";
createSession(async (session) => {
let browser = await session.spawnBrowser("canary");
let api = await session.createAPIClient("localhost", browser.remoteDebuggingPort);
let tabs = await api.listTabs();
let tab = tabs[0];
let client = await session.openDebuggingProtocol(tab.webSocketDebuggerUrl);
await client.send("Profiler.enable");
await client.send("Page.enable");
// cookies.json [{ name: string, value: string }, ...]
let cookies = JSON.parse(fs.readFileSync("cookies.json", "utf8"));
for (let i = 0; i < cookies.length; i++) {
let cookie = cookies[i];
await client.send("Network.setCookie", {
"url": "https://linkedin.com",
"name": cookie.name,
"value": cookie.value,
"domain": ".linkedin.com"
});
}
await client.send("Profiler.startPreciseCoverage", {
callCount: true
});
await client.send("Page.navigate", {
url: "https://linkedin.com/feed/"
});
await new Promise((resolve) => client.on("Page.loadEventFired", resolve));
await new Promise((resolve) => setTimeout(resolve, 1000));
let result = await client.send("Profiler.takePreciseCoverage");
fs.writeFileSync("coverage.json", JSON.stringify(result, null, 2));
}).catch(err => {
console.error(err);
});
@svg7

This comment has been minimized.

Copy link

@svg7 svg7 commented May 29, 2017

Hi krisselden,

Came across this piece of code for the JS code coverage and could not get it working, do you have a sample test code on how to use this above as this would be of great help !

Thanks !

@krisselden

This comment has been minimized.

Copy link
Owner Author

@krisselden krisselden commented Aug 3, 2017

@svg7 didn't see your message earlier I would need more details about what didn't work.

@olegdovger

This comment has been minimized.

Copy link

@olegdovger olegdovger commented Sep 24, 2017

Hi krisselden.

I got "coverage.json"

Could you tell how can I analyze this report file? It would be nice to create HTML report

@sk003cs

This comment has been minimized.

Copy link

@sk003cs sk003cs commented Jul 31, 2018

Chrome Extension to generate a code coverage report of unused CSS and JS -- https://chrome.google.com/webstore/detail/css-and-js-code-coverage/gfdcbeanlpkgbkagoejiiojahaehhbno

Find unused CSS and JS code
When you load or run a page, the app tells you how much code was used, versus how much was loaded. You can reduce the size of your pages by only shipping the code that you need

How to use??

Step 1 : Install 'npm i code-coverage-client'
Step 2 : Start node app 'node index.js'
Step 3 : Start chrome browser in remote debug mode
3.1: Ubuntu: google-chrome --remote-debugging-port=9222
3.1: Windows: chrome.exe --remote-debugging-port=9222
Step 4 : Enter website address and Click on 'START' button
Step 5: Start testing
Step 6: Click on 'GET REPORT' button to receive a report

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.