[PR #4890] [MERGED] fix: resolve issues around rendering HTML response previews #4980

New issue

Closed

opened 2026-03-17 02:28:07 +03:00 by kerem · 0 comments

kerem commented

2026-03-17 02:28:07 +03:00

Owner

📋 Pull Request Information

Original PR: https://github.com/hoppscotch/hoppscotch/pull/4890
Author: @nivedin
Created: 3/14/2025
Status: ✅ Merged
Merged: 3/18/2025
Merged by: @jamesgeorge007

Base: patch ← Head: fix/html-preview-bug

📝 Commits (4)

4593a32 fix: html preview bug
228bc33 chore: code cleanup
8d3fe9f chore: add warning for iframe sandbox issue
c50cb20 refactor: remove redundant state variables

📊 Changes

2 files changed (+35 additions, -14 deletions)

View changed files

📝 packages/hoppscotch-common/src/components/lenses/renderers/HTMLLensRenderer.vue (+7 -2)
📝 packages/hoppscotch-common/src/composables/lens-actions.ts (+28 -12)

📄 Description

Closes #4862, HFE-776.

This PR fixes the issue where the html preview was not working as expected.

What's changed

The defaultPreview has been changed to a computedAsync variable since the persistenceService.getLocalConfig is an async function.

Before

After

Note to reviewers

There was already a bug where the iframe sometimes didn't load due to sandbox error

This can be fixed by allowing allow-scripts allow-same-origin in the sandbox attribute of the iframe but have some security issues that follows. This can be tackled separately if necessery

_{🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.}

## 📋 Pull Request Information **Original PR:** https://github.com/hoppscotch/hoppscotch/pull/4890 **Author:** [@nivedin](https://github.com/nivedin) **Created:** 3/14/2025 **Status:** ✅ Merged **Merged:** 3/18/2025 **Merged by:** [@jamesgeorge007](https://github.com/jamesgeorge007) **Base:** `patch` ← **Head:** `fix/html-preview-bug` --- ### 📝 Commits (4) - [`4593a32`](https://github.com/hoppscotch/hoppscotch/commit/4593a322ac2b57552359cfa6313fb08d47b2b542) fix: html preview bug - [`228bc33`](https://github.com/hoppscotch/hoppscotch/commit/228bc3313b85869b6e931acdace0f22f73a429db) chore: code cleanup - [`8d3fe9f`](https://github.com/hoppscotch/hoppscotch/commit/8d3fe9fcf860950e73df73a196a569c3229f36b9) chore: add warning for iframe sandbox issue - [`c50cb20`](https://github.com/hoppscotch/hoppscotch/commit/c50cb205f7262dfc2513bc9ac364eab09cbaf110) refactor: remove redundant state variables ### 📊 Changes **2 files changed** (+35 additions, -14 deletions) <details> <summary>View changed files</summary> 📝 `packages/hoppscotch-common/src/components/lenses/renderers/HTMLLensRenderer.vue` (+7 -2) 📝 `packages/hoppscotch-common/src/composables/lens-actions.ts` (+28 -12) </details> ### 📄 Description Closes #4862, HFE-776. This PR fixes the issue where the html preview was not working as expected. ### What's changed The defaultPreview has been changed to a computedAsync variable since the persistenceService.getLocalConfig is an async function. ### Before ![image](https://github.com/user-attachments/assets/bb8dc925-8c65-4b1a-8f89-43c54ed36651) ### After ![image](https://github.com/user-attachments/assets/ce1a2e1a-5bf7-49bb-8378-1deb2e3b7c58) ### Note to reviewers There was already a bug where the iframe sometimes didn't load due to sandbox error ![image](https://github.com/user-attachments/assets/0a17cef7-8c1d-4282-bc4b-bcd8df123a49) This can be fixed by allowing `allow-scripts allow-same-origin` in the sandbox attribute of the iframe but have some security issues that follows. This can be tackled separately if necessery --- <sub>🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.</sub>