starred/hoppscotch

Fork 0

mirror of https://github.com/hoppscotch/hoppscotch.git synced 2026-04-25 08:45:58 +03:00

[GH-ISSUE #1891] Html preview view area is not full height #602

New issue

Closed

opened 2026-03-16 16:19:31 +03:00 by kerem · 11 comments

kerem commented

2026-03-16 16:19:31 +03:00

Owner

Originally created by @iagormoraes on GitHub (Oct 21, 2021).
Original GitHub issue: https://github.com/hoppscotch/hoppscotch/issues/1891

Originally assigned to: @rishabhkalra96, @iagormoraes on GitHub.

Describe the bug
By getting a HTML response from any endpoint call, the preview is not getting the full height of available space as shown in the screenshot.

To Reproduce
Steps to reproduce the behavior:

Make request to https://github.com/hoppscotch/hoppscotch/issues
Click on Show Preview
You should see the height of the preview not fitting the available space

Expected behavior
The users should be able to see the preview in full height of available space.

Screenshots
Screen Shot 2021-10-21 at 08 18 35

Desktop (please complete the following information):

OS: MacOS
Browser Safari
Version 2.0

Smartphone (please complete the following information):

Device: [e.g. iPhone6]
OS: [e.g. iOS8.1]
Browser [e.g. stock browser, safari]
Version [e.g. 22]

Additional context
Add any other context about the problem here.

Originally created by @iagormoraes on GitHub (Oct 21, 2021). Original GitHub issue: https://github.com/hoppscotch/hoppscotch/issues/1891 Originally assigned to: @rishabhkalra96, @iagormoraes on GitHub. **Describe the bug** By getting a HTML response from any endpoint call, the preview is not getting the full height of available space as shown in the screenshot. **To Reproduce** Steps to reproduce the behavior: 1. Make request to `https://github.com/hoppscotch/hoppscotch/issues` 2. Click on `Show Preview` 3. You should see the height of the preview not fitting the available space **Expected behavior** The users should be able to see the preview in full height of available space. **Screenshots** <img width="1679" alt="Screen Shot 2021-10-21 at 08 18 35" src="https://user-images.githubusercontent.com/13892132/138268136-4dd0953e-34cb-4d35-8837-deed57b40e57.png"> **Desktop (please complete the following information):** - OS: MacOS - Browser Safari - Version 2.0 **Smartphone (please complete the following information):** - Device: [e.g. iPhone6] - OS: [e.g. iOS8.1] - Browser [e.g. stock browser, safari] - Version [e.g. 22] **Additional context** Add any other context about the problem here.

kerem

2026-03-16 16:19:31 +03:00

closed this issue
added the
good first issue

hacktoberfest
labels

kerem commented

2026-03-16 16:19:48 +03:00

Author

Owner

@liyasthomas commented on GitHub (Oct 21, 2021):

Hi @iagormoraes, thanks for reporting this behavior. We'll look into fixing this as soon as possible.

@liyasthomas commented on GitHub (Oct 21, 2021): Hi @iagormoraes, thanks for reporting this behavior. We'll look into fixing this as soon as possible.

kerem commented

2026-03-16 16:19:54 +03:00

Author

Owner

@rishabhkalra96 commented on GitHub (Oct 22, 2021):

hi @liyasthomas , would like to take up this issue.

@rishabhkalra96 commented on GitHub (Oct 22, 2021): hi @liyasthomas , would like to take up this issue.

kerem commented

2026-03-16 16:19:59 +03:00

Author

Owner

@liyasthomas commented on GitHub (Oct 22, 2021):

Hi @rishabhkalra96, feel free to pick this up. Assigning it to you.

@liyasthomas commented on GitHub (Oct 22, 2021): Hi @rishabhkalra96, feel free to pick this up. Assigning it to you.

kerem commented

2026-03-16 16:20:04 +03:00

Author

Owner

@liyasthomas commented on GitHub (Nov 3, 2021):

Hi @rishabhkalra96, let me know if you've any trouble with this issue. Would love to help you out.

@liyasthomas commented on GitHub (Nov 3, 2021): Hi @rishabhkalra96, let me know if you've any trouble with this issue. Would love to help you out.

kerem commented

2026-03-16 16:20:09 +03:00

Author

Owner

@iagormoraes commented on GitHub (Nov 3, 2021):

I can help also in this issue, just let me know 🙂

@iagormoraes commented on GitHub (Nov 3, 2021): I can help also in this issue, just let me know 🙂

kerem commented

2026-03-16 16:20:14 +03:00

Author

Owner

@AndrewBastin commented on GitHub (Nov 3, 2021):

@iagormoraes sure you can work on this!

@AndrewBastin commented on GitHub (Nov 3, 2021): @iagormoraes sure you can work on this!

kerem commented

2026-03-16 16:20:19 +03:00

Author

Owner

@iagormoraes commented on GitHub (Nov 3, 2021):

I can't run dev due to some error of package, followed the development steps to setup the project, I saw we use workspaces for it but it seems to be not recognizing it:

packages/hoppscotch-app do-dev$ pnpm run dev
[99 lines collapsed]
│ [dev:nuxt       ]  WARN  in /workspace/hoppscotch/node_modules/.pnpm/yargs-parser@20.2.9/node_modules/yargs-parser/build/lib/index.js
│ [dev:nuxt       ] 
│ [dev:nuxt       ] 
│ [dev:nuxt       ]  ERROR  Failed to compile with 1 errors
│ [dev:nuxt       ] 
│ [dev:nuxt       ] This dependency was not found:
│ [dev:nuxt       ] 
│ [dev:nuxt       ] * @hoppscotch/js-sandbox in ./helpers/RequestRunner.ts
│ [dev:nuxt       ] 
│ [dev:nuxt       ] To install it, you can run: npm install --save @hoppscotch/js-sandbox
└─ Running...

It happens both local and in cloud with Gitpod, someone knows that?

@iagormoraes commented on GitHub (Nov 3, 2021): I can't run dev due to some error of package, followed the development steps to setup the project, I saw we use workspaces for it but it seems to be not recognizing it: ``` packages/hoppscotch-app do-dev$ pnpm run dev [99 lines collapsed] │ [dev:nuxt ] WARN in /workspace/hoppscotch/node_modules/.pnpm/yargs-parser@20.2.9/node_modules/yargs-parser/build/lib/index.js │ [dev:nuxt ] │ [dev:nuxt ] │ [dev:nuxt ] ERROR Failed to compile with 1 errors │ [dev:nuxt ] │ [dev:nuxt ] This dependency was not found: │ [dev:nuxt ] │ [dev:nuxt ] * @hoppscotch/js-sandbox in ./helpers/RequestRunner.ts │ [dev:nuxt ] │ [dev:nuxt ] To install it, you can run: npm install --save @hoppscotch/js-sandbox └─ Running... ``` It happens both local and in cloud with Gitpod, someone knows that?

kerem commented

2026-03-16 16:20:24 +03:00

Author

Owner

@liyasthomas commented on GitHub (Nov 4, 2021):

This seems like an issue with the Node environment. To set up Hoppscotch development you might need to upgrade the Node version to v14.x or above. Let me know if this doesn't help - try cleaning the node_modules directory and reinstalling dependencies.

EDIT:
By the way, you'll need to install the dependencies and run pnpm run dev from root directory probably hoppscotch, not hoppscotch/packages/hoppscotch-app.

@liyasthomas commented on GitHub (Nov 4, 2021): This seems like an issue with the Node environment. To set up Hoppscotch development you might need to upgrade the Node version to v14.x or above. Let me know if this doesn't help - try cleaning the `node_modules` directory and reinstalling dependencies. EDIT: By the way, you'll need to install the dependencies and run `pnpm run dev` from root directory probably `hoppscotch`, not `hoppscotch/packages/hoppscotch-app`.

kerem commented

2026-03-16 16:20:29 +03:00

Author

Owner

@iagormoraes commented on GitHub (Nov 4, 2021):

This seems like an issue with the Node environment. To set up Hoppscotch development you might need to upgrade the Node version to v14.x or above. Let me know if this doesn't help - try cleaning the node_modules directory and reinstalling dependencies.

EDIT: By the way, you'll need to install the dependencies and run pnpm run dev from root directory probably hoppscotch, not hoppscotch/packages/hoppscotch-app.

Hey @liyasthomas I've just tried that and still complains the missing package, is interesting because in node_modules I can see the folder there but it seems to not being recognized, even in Webstorm IDE, any tips?

I'm using node 16.13.0 LTS

@iagormoraes commented on GitHub (Nov 4, 2021): > This seems like an issue with the Node environment. To set up Hoppscotch development you might need to upgrade the Node version to v14.x or above. Let me know if this doesn't help - try cleaning the `node_modules` directory and reinstalling dependencies. > > EDIT: By the way, you'll need to install the dependencies and run `pnpm run dev` from root directory probably `hoppscotch`, not `hoppscotch/packages/hoppscotch-app`. Hey @liyasthomas I've just tried that and still complains the missing package, is interesting because in `node_modules` I can see the folder there but it seems to not being recognized, even in Webstorm IDE, any tips? I'm using node 16.13.0 LTS

kerem commented

2026-03-16 16:20:34 +03:00

Author

Owner

@liyasthomas commented on GitHub (Nov 4, 2021):

There was an issue in Windows OS which might've caused this behavior. This has been patched - pull the latest main branch or reclone the repository and try again. Let us know if the issue persists.

@liyasthomas commented on GitHub (Nov 4, 2021): There was an issue in Windows OS which might've caused this behavior. This has been patched - pull the latest `main` branch or reclone the repository and try again. Let us know if the issue persists.

kerem commented

2026-03-16 16:20:39 +03:00

Author

Owner

@iagormoraes commented on GitHub (Nov 4, 2021):

There was an issue in Windows OS which might've caused this behavior. This has been patched - pull the latest main branch or reclone the repository and try again. Let us know if the issue persists.

I pulled and is working now.

@iagormoraes commented on GitHub (Nov 4, 2021): > There was an issue in Windows OS which might've caused this behavior. This has been patched - pull the latest `main` branch or reclone the repository and try again. Let us know if the issue persists. I pulled and is working now.

kerem referenced this issue

2026-03-17 00:24:57 +03:00

[PR #602] [MERGED] GraphQL page improvements, and more #2739