/csv-visualizer

A visualizer that parses CSV data and renders it in a table in Postman or in a browser.

Primary LanguageJavaScriptCreative Commons Zero v1.0 UniversalCC0-1.0

npm

Postman CSV Visualizer

A visualizer that parses CSV data and renders it in a table in Postman or in a browser.

  1. Example
  2. Using the Visualizer in Postman
  3. Reference

Example

The following code...

<script src="https://unpkg.com/csv-visualizer@1.0.0/dist/csv-vizualizer.min.js"></script>
<script>
    const CSV = '"h1","h2","h3"\n"r1c1","r1c2","r1c3"\n"r2c1","r2c2","r2c3"';
    CsvVisualizer.visualize(CSV);
</script>

...generates a table like this:

Standalone HTML table

Complete example available in example.html.

Using the Visualizer in Postman

  1. Pick a request that returns CSV data

  2. Copy the following code in the Tests tab:

    const template = `<script src="https://unpkg.com/csv-visualizer@latest/dist/csv-visualizer.min.js"></script>
    <script>
    pm.getData((err, data) => {
        CsvVisualizer.visualize(data.csvString);
    });
    </script>`;
    const csvString = pm.response.text();
    pm.visualizer.set(template, { csvString });
  3. Run the request and open the response's Visualize tab

Postman visualizer

Reference

CsvVisualizer.visualize(
    csvString,
    (rootElement = document.body),
    (options = {})
);

csvString - the CSV string that holds the table data

rootElement - optional, the root DOM element to witch the content is appended. If not specified, document.body is used.

options - optional, an object that contains the table and parser options:

Property Type Default Description
showHeader boolean true Whether the table should have a header that indicates the number of rows.
parserOptions Object {} CSV parser options. See Papa Parse Config.

Credits/Licenses

This project uses Papa Parse (MIT License) for CSV parsing.