Skip to content

/ hoppscotch

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Collapsed Editor can be resized and dragging down doesn't increase code view #1110

Open
JoelJacobStephen opened this issue Aug 24, 2020 · 4 comments
Open

Collapsed Editor can be resized and dragging down doesn't increase code view #1110

JoelJacobStephen opened this issue Aug 24, 2020 · 4 comments
Labels
bug good first issue hacktoberfest

Comments

@JoelJacobStephen
Copy link

@JoelJacobStephen JoelJacobStephen commented Aug 24, 2020

Describe the bug
When I pull the resize button of the code editor, it doesn't the resize the code in the editor.

To Reproduce
Steps to reproduce the behavior:

  1. Click the resize button on the code editor and drag it down
  2. The code doesn't resize

Expected behavior
I expected the code to resize as I drag down the button.

Screenshots
If applicable, add screenshots to help explain your problem.
Capture

Desktop (please complete the following information):

  • OS: Windows 10
  • Browser: Firefox

Additional context
When I press the expand button, it works though.
@AndrewBastin AndrewBastin added the bug label Aug 24, 2020
@AndrewBastin AndrewBastin changed the title Resize Issue Collapsed Editor can be resized and dragging down doesn't increase code view Aug 24, 2020
@liyasthomas
Copy link
Member

@liyasthomas liyasthomas commented Aug 24, 2020 •
edited

I'll look into it.

refer:
https://jsfiddle.net/6b2tfspe/1/
https://stackoverflow.com/questions/27534263/making-ace-editor-resizable
https://stackoverflow.com/questions/28785588/how-to-get-the-ace-editor-to-adjust-to-its-parent-div
@AndrewBastin
Copy link
Member

@AndrewBastin AndrewBastin commented Aug 26, 2020

I played around a bit to see what is causing it and found that the maxLines property might be relevant

Here is a snippet from JSON Lens Renderer:

hoppscotch/components/lenses/renderers/JSONLensRenderer.vue

Lines 43 to 57 in 3cd2a2a

<div id="response-details-wrapper">
<ace-editor
:value="jsonBodyText"
:lang="'json'"
:options="{
maxLines: responseBodyMaxLines,
minLines: '16',
fontSize: '16px',
autoScrollEditorIntoView: true,
readOnly: true,
showPrintMargin: false,
useWorker: false,
}"
/>
</div>

@AndrewBastin
Copy link
Member

@AndrewBastin AndrewBastin commented Aug 30, 2020

Another possible option is to restart the efforts for moving to CodeMirror. I had attempted before, just that the only issue was that editor expanded the response panel.

Ace is really difficult to work with and pretty much impossible to test the functionality of due to its weird Webpack Resolution thingy and the codebase feels really legacy.

CodeMirror is pretty modern, supports mobile devices and we already have a sorta working implementation going.

You can check out the stale branch in my fork. https://github.com/AndrewBastin/hoppscotch/tree/feat/move-to-codemirror
@liyasthomas
Copy link
Member

@liyasthomas liyasthomas commented Aug 30, 2020

Let me check.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
bug good first issue hacktoberfest
Projects
None yet
Milestone
No milestone
Linked pull requests

Successfully merging a pull request may close this issue.

None yet
3 participants
@AndrewBastin @liyasthomas @JoelJacobStephen
You can’t perform that action at this time.