Pretty, raw, and preview views in Postman - Practice Problems & Coding Challenges

Challenge - 5 Problems

🧠 Conceptual

intermediate

Understanding Postman Response Views

In Postman, when you receive a response, you can view it in different tabs: Pretty, Raw, and Preview. Which statement correctly describes the Pretty view?

A It displays the response exactly as received, including all headers and raw bytes.

B It only shows the HTTP status code and response time without the body content.

C It renders the response as a live webpage, executing any scripts or styles included.

D It shows the response formatted with syntax highlighting and indentation for easier reading.

💡 Hint

Think about which view helps you read JSON or XML responses clearly.

The Pretty view formats the response body with colors and indentation, making it easier to read structured data like JSON or XML. The Raw view shows the exact response text, and Preview renders HTML content.

❓ Predict Output

intermediate

Output of Raw View for JSON Response

You send a GET request that returns this JSON response body:

{"name":"Alice","age":30,"city":"Paris"}

What will the Raw view display?

A <html><body>{"name":"Alice","age":30,"city":"Paris"}</body></html>

B

{
  "name": "Alice",
  "age": 30,
  "city": "Paris"
}

C {"name":"Alice","age":30,"city":"Paris"}

D Name: Alice, Age: 30, City: Paris

💡 Hint

The Raw view shows the exact response text without formatting.

The Raw view displays the response exactly as received, so the JSON string is shown without added spaces or line breaks.

❓ assertion

advanced

Validating Preview View Behavior

You receive an HTTP response with Content-Type text/html containing a simple webpage. Which assertion correctly verifies that the Preview tab in Postman will render the page?

A Assert that the response body is valid JSON format.

B Assert that the response body contains valid HTML tags like <code>&lt;html&gt;</code> and <code>&lt;body&gt;</code>.

C Assert that the response headers include <code>Content-Type: application/json</code>.

D Assert that the response body is empty.

💡 Hint

Preview renders HTML content visually.

The Preview tab renders HTML content as a webpage. To verify this, the response body must contain valid HTML tags. JSON or empty bodies won't render as a webpage.

🔧 Debug

advanced

Troubleshooting Raw View Showing Unexpected Content

You notice that in Postman, the Raw view of a response shows garbled characters instead of readable text. What is the most likely cause?

A The response is compressed (e.g., gzip) but Postman did not decompress it.

B The request method was POST instead of GET.

C The Pretty view is enabled, causing Raw view to change output.

D The response body is empty, so Postman shows random characters.

💡 Hint

Think about how servers send compressed data and how clients handle it.

If the server sends compressed data but Postman does not decompress it, the Raw view will show unreadable characters. This is a common issue with compressed responses.

❓ framework

expert

Automating Validation of Pretty View Formatting

You want to write a Postman test script that automatically checks if the response body is valid JSON and thus will display correctly in the Pretty view. Which script snippet correctly performs this check?

Postman

pm.test('Response is valid JSON', () => {
  // Your code here
});

A

pm.test('Response is valid JSON', () => {
  pm.expect(() => JSON.parse(pm.response.text())).not.to.throw();
});

B

pm.test('Response is valid JSON', () => {
  pm.expect(pm.response.text()).to.be.json;
});

C

pm.test('Response is valid JSON', () => {
  pm.expect(pm.response.json()).to.be.a('string');
});

D

pm.test('Response is valid JSON', () => {
  pm.expect(pm.response.code).to.equal(200);
});

💡 Hint

Try parsing the response text and check if it throws an error.

Option A tries to parse the response text as JSON and asserts that no error is thrown. This confirms valid JSON. Option A uses a non-existent assertion, A wrongly expects JSON to be a string, and D only checks status code.

Practice

1. Which Postman view shows the API response formatted with colors and indentation for easy reading?

easy

A. Raw view

B. Pretty view

C. Preview view

D. Headers view

Solution

1. Step 1: Understand the purpose of Pretty view

   The Pretty view formats JSON, XML, or HTML responses with colors and indentation to make them easier to read.

2. Step 2: Compare with other views

   Raw view shows the exact text without formatting, and Preview renders HTML content visually. Headers view shows response headers, not body.

3. Final Answer:

   Pretty view -> Option B

4. Quick Check:

   Formatted response = Pretty view [OK]

Hint: Pretty = formatted and colored response for easy reading [OK]

Common Mistakes:

• Confusing Raw view with Pretty view
• Thinking Preview shows formatted text instead of rendered content
• Mixing Headers view with body views

2. Which of the following is the correct way to switch to the Raw view in Postman after receiving a response?

easy

A. Go to Settings and enable Raw mode

B. Right-click the response and select 'Raw view'

C. Click the 'Raw' tab next to 'Pretty' in the response section

D. Double-click the response body

Solution

1. Step 1: Locate the response view tabs

   In Postman, response views like Pretty, Raw, and Preview appear as tabs above the response body.

2. Step 2: Identify how to switch views

   Clicking the 'Raw' tab directly switches the view to show the exact response text without formatting.

3. Final Answer:

   Click the 'Raw' tab next to 'Pretty' in the response section -> Option C

4. Quick Check:

   Switch views by clicking tabs = Click the 'Raw' tab next to 'Pretty' in the response section [OK]

Hint: Switch views by clicking tabs: Pretty, Raw, Preview [OK]

Common Mistakes:

• Trying to right-click for Raw view (no such option)
• Looking in Settings instead of response tabs
• Double-clicking does not change views

3. Given an HTML API response, what will you see in the Preview view of Postman?

medium

A. A rendered HTML page if the response contains HTML

B. A formatted and colored JSON with indentation

C. The raw JSON text exactly as received

D. Only the response headers without body

Solution

1. Step 1: Understand Preview view purpose

   The Preview view renders HTML content visually, like a browser would, showing the page layout and images.

2. Step 2: Consider JSON response in Preview

   If the response is JSON, Preview does not format or show it as text; it tries to render it, which usually results in a blank or raw display.

3. Final Answer:

   A rendered HTML page if the response contains HTML -> Option A

4. Quick Check:

   Preview = rendered HTML content [OK]

Hint: Preview shows rendered HTML, not raw or formatted JSON [OK]

Common Mistakes:

• Thinking Preview formats JSON like Pretty view
• Confusing Raw view with Preview
• Expecting headers in Preview

4. You switched to the Preview view in Postman but see a blank screen instead of your expected HTML page. What is the most likely reason?

medium

A. The response is JSON, not HTML, so Preview cannot render it

B. You forgot to click the Pretty tab first

C. Postman does not support Preview view

D. The Raw view is disabled in settings

Solution

1. Step 1: Identify response content type

   Preview view renders HTML visually. If the response is JSON or plain text, Preview cannot render it as a page.

2. Step 2: Understand why blank appears

   Since JSON is not HTML, Preview shows blank or raw text, not a formatted page.

3. Final Answer:

   The response is JSON, not HTML, so Preview cannot render it -> Option A

4. Quick Check:

   Preview blank = non-HTML response [OK]

Hint: Preview blank? Check if response is HTML or not [OK]

Common Mistakes:

• Thinking Pretty tab must be clicked first
• Believing Postman lacks Preview support
• Assuming Raw view settings affect Preview

5. You receive an API response with HTML content that includes CSS. Which Postman view should you use to verify the page visually as a user would see it, and why?

hard

A. Pretty view, because it formats HTML with colors and indentation

B. Raw view, because it shows the exact source code including scripts

C. Headers view, because it shows content type and length

D. Preview view, because it renders HTML and CSS like a browser

Solution

1. Step 1: Understand the content type and views

   HTML with JavaScript and CSS needs to be rendered to see the actual page as a user would.

2. Step 2: Identify the view that renders content

   Preview view renders HTML, applies CSS styles, showing the page visually.

3. Step 3: Compare with other views

   Pretty view only formats the source code text, Raw shows unformatted source, Headers show metadata only.

4. Final Answer:

   Preview view, because it renders HTML and CSS like a browser -> Option D

5. Quick Check:

   Visual page check = Preview view [OK]

Hint: Use Preview to see rendered page with CSS and styles [OK]

Common Mistakes:

• Choosing Pretty view expecting visual rendering
• Confusing Raw view with rendered output
• Expecting source code views to show visual layout