Inspiration

Istanbul, a popular JavaScript code coverage tool

What it does

Puppeteer to Istanbul is part of the Istanbul GitHub organization and allows for a more elegant way to display code coverage that is pulled from Google Chrome using Puppeteer. This type of debugging makes it so that developers can test a variety of specific behaviors that involve DOM manipulation that can be impossible to test without Puppeteer. Without our tool, however, developers testing with Puppeteer could not test their code coverage to ensure they tested thoroughly.

How we built it

We converted from the Puppeteer coverage output to the V8 engine coverage format, and then integrates with an existing tool (V8toIstanbul) to take the V8 engine's code coverage format and convert it to Istanbul. Our project is a Node project with thorough testing and high code coverage as well as many example scripts to test our functionality, ensuring that it will work as intended.

Challenges we ran into

The code coverage processes of Puppeteer are complex and obscure, and it was hard to understand what the coverage output specifically meant, and how it could be best converted into the format that we needed.

Accomplishments that we're proud of

We completed a library that maps Puppeteer's code coverage output to Instanbul, and created a splash page for our project (found at https://hack-illinois-team-istanbul.herokuapp.com/).

What we learned

To document and test very thoroughly, and solve problems that are important to the open source community.

What's next for Puppeteer to Istanbul

We will be updating the Puppeteer documentation in order to reflect our better approach to coverage, and will be informing the Istanbul community (who requested a tool to convert from Puppeteer output to Istanbul).

Share this project:
×

Updates