How can I see ChromeLogger output in the Postman console when debugging an API?

Question

I have set up ChromeLogger, the browser extension and the backend library, which works fine.

However I am developing an API which I test in Postman not in the browser so I want to see the same debug logs in Postman in the console or somewhere in the response previews.

Is there any way of installing an extension into Postman, the same as the browser extension?

Answer 1

After reading this article, which explains how the debug logs are encoded in a header, I thought I could just write a post-response "test" in Postman to unpack the header and log it into the Postman console.

This Postman article explains how you can set a "test" globally by editing the test suite itself or folders, so you can make this work pretty much like an extension without having to add it to each request. Click the '...' ellipsis next to the test suite, click Edit, choose the Tests tab and enter the JavaScript code below.

I tried three ways of outputting the data, each with their strengths and weaknesses, as noted in the comments.

// Decode any ChromeLogger data
var chromelogger = postman.getResponseHeader("X-ChromeLogger-Data");
if(chromelogger){
    chromelogger = JSON.parse(atob(chromelogger));
    if(chromelogger){

        // Native objects - well structured, but you have to expand all the rows every time... tedious!
        //console.log(chromelogger); 

        // Raw JSON - always visible but can be hard to read
        // console.log(atob(postman.getResponseHeader("X-ChromeLogger-Data"))); 

        // For known structures, you can display it yourself
        chromelogger.rows.forEach( row => {
            console.log(row[1]); // display source line
            row[0].forEach(log => {
                console.log(log);
            })
        })
    }
}

Now when you run any test, all the Chromelogger debug is displayed in the Postman Console.