---
title: "Test the Template"
url: https://docs.catalyst.zoho.com/en/tutorials/payslip-generator-app/nodejs/test-template/
description: "Build a basic web app that uses Catalyst components to generate a PDF document from a dynamic custom payslip template, and email the generated document to the end-user."
last_updated: 2026-08-17T12:16:04Z
service: All Services
type: tutorial
related_links:
  - name: "Catalyst SmartBrowz"
    url: /en/smartbrowz/getting-started/introduction/
  - name: "Templates"
    url: /en/smartbrowz/help/templates/create-templates/
---

# Test Your Template

Now that you have created your template, let's test it with sample JSON data to ensure that all of the data renders properly.

To test the template:

1. Click **PDF & Screenshot** under *Convert* in the *SmartBrowz* side menu bar to access the component.
![smartbrowz_tutorial_payslip_template_test_pdfnscreen_first](https://catalyst-docs-development.zohostratus.in/images/tutorials/payslip-generator/payslip-generator-smartbrowz-pdf.webp)

2. Click **Playground**, and choose **Template** as the *Input Type*.
![smartbrowz_tutorial_payslip_template_test_pdfnscreen_template](https://catalyst-docs-development.zohostratus.in/images/tutorials/payslip-generator/smartbrowz_tutorial_payslip_template_test_pdfnscreen_template.webp)

3. Select the custom template you have created from the *Template* drop-down.
![smartbrowz_tutorial_payslip_template_test_template_select](https://catalyst-docs-development.zohostratus.in/images/tutorials/payslip-generator/template-dropdown-payslip-generator.webp)

4. Paste the following JSON snippet as the template data in the editor.

**Sample JSON Data**

```json
{
    "company": "Zylker Technologies",
    "employeeName": "Amelia Burrows",
    "employeeId": "ZT-789",
    "designation": "QA Analyst",
    "basicSalary": 10000,
    "allowances": 4500,
    "deductions": 1450,
    "totalEarnings": 14500,
    "netSalary": 13050,
    "paymentMethod": "Bank Transfer",
    "month": "September",
    "year": "2023"
}

```

> **Note:** The sample JSON data above is only applicable for the template design that we have provided. If you have used your own custom design, you will need to provide a suitable JSON data as the input.

<!-- 5. Ensure **Default Settings** is set as the *Template Settings*. You can find out more on the functionality of Custom Settings from this [help document](https://docs.catalyst.zoho.com/en/smartbrowz/help/pdfnscreenshot/implementation/#templates).
![smartbrowz_tutorial_payslip_template_test_default_setting](https://catalyst-docs-development.zohostratus.in/images/tutorials/payslip-generator/smartbrowz_tutorial_payslip_template_test_default_setting.webp)
 -->

6. Click **Generate**.
![smartbrowz_tutorial_payslip_template_test_preview](https://catalyst-docs-development.zohostratus.in/images/tutorials/payslip-generator/click-generate-payslip-generator.webp)

A preview window will open, and you can view your custom template with the JSON data rendered. You can click **Download** to save the visual document to your local system.