[GH-ISSUE #1840] Control arrow right and left still bind to change history #585

Closed
opened 2026-03-16 16:08:50 +03:00 by kerem · 12 comments
Owner

Originally created by @mandaputtra on GitHub (Sep 27, 2021).
Original GitHub issue: https://github.com/hoppscotch/hoppscotch/issues/1840

Describe the bug
Mostly when I navigate the text, I use CTRL + <- or CTRL + -> to navigate per word, but when I use it on the body editor it navigate through my browser history not per word.

To Reproduce
Steps to reproduce the behavior:

  1. Open Hoppsctoot
  2. Go to body
  3. Change content type to application/json,
  4. Write stuff,
  5. Navigate using CTRL + Right or CTRL + Left

Expected behavior
Navigating per word

Desktop (please complete the following information):

  • OS: Ubuntu 20.10
  • Browser: Brave latest, Chromium (94) latest.
  • Version V1.29.81 (Sep 14, 2021)

Additional context
I thik I can contribute to solve this issue. Tell me If this is necessary I'll work on it.

Originally created by @mandaputtra on GitHub (Sep 27, 2021). Original GitHub issue: https://github.com/hoppscotch/hoppscotch/issues/1840 **Describe the bug** Mostly when I navigate the text, I use `CTRL + <-` or `CTRL + ->` to navigate per word, but when I use it on the body editor it navigate through my browser history not per word. **To Reproduce** Steps to reproduce the behavior: 1. Open Hoppsctoot 2. Go to body 3. Change content type to application/json, 4. Write stuff, 5. Navigate using CTRL + Right or CTRL + Left **Expected behavior** Navigating per word **Desktop (please complete the following information):** - OS: Ubuntu 20.10 - Browser: Brave latest, Chromium (94) latest. - Version V1.29.81 (Sep 14, 2021) **Additional context** I thik I can contribute to solve this issue. Tell me If this is necessary I'll work on it.
Author
Owner

@liyasthomas commented on GitHub (Sep 27, 2021):

hi @mandaputtra, thanks for reporting this behavior. We'd be happy if you can figure out a fix to this.

I'd like to mention our universal action handler and resolver logic which is probably the root cause of this behavior.

actions.ts defines the key bindings and their corresponding action keywords.
Here it's navigation.jump.back and navigation.jump.forward
github.com/hoppscotch/hoppscotch@728515c225/packages/hoppscotch-app/helpers/actions.ts (L30-L31)

default.vue defines the corresponding action handlers.

github.com/hoppscotch/hoppscotch@dcbb17b164/packages/hoppscotch-app/layouts/default.vue (L127-L132)

A universal fix to actions interfering with the native behaviors like navigating per word is to disable them when the focus is in textareas, input, contenteditable etc. This has been already implemented in isTypableElement() in dom.ts but doesn't seem to be working :(. Fixing this should resolve the reported issue.

github.com/hoppscotch/hoppscotch@dcbb17b164/packages/hoppscotch-app/helpers/utils/dom.ts (L5-L19)

Guess this will be helpful.

<!-- gh-comment-id:927520470 --> @liyasthomas commented on GitHub (Sep 27, 2021): hi @mandaputtra, thanks for reporting this behavior. We'd be happy if you can figure out a fix to this. I'd like to mention our universal action handler and resolver logic which is probably the root cause of this behavior. `actions.ts` defines the key bindings and their corresponding action keywords. Here it's `navigation.jump.back` and `navigation.jump.forward` https://github.com/hoppscotch/hoppscotch/blob/728515c2255692f8a6a2cbe8866bd8d5e418d2cf/packages/hoppscotch-app/helpers/actions.ts#L30-L31 `default.vue` defines the corresponding action handlers. https://github.com/hoppscotch/hoppscotch/blob/dcbb17b1642d07da0a22ef3171e4572dd82dd93d/packages/hoppscotch-app/layouts/default.vue#L127-L132 A universal fix to actions interfering with the native behaviors like navigating per word is to disable them when the focus is in `textareas`, `input`, `contenteditable` etc. This has been already implemented in `isTypableElement()` in `dom.ts` but doesn't seem to be working :(. Fixing this should resolve the reported issue. https://github.com/hoppscotch/hoppscotch/blob/dcbb17b1642d07da0a22ef3171e4572dd82dd93d/packages/hoppscotch-app/helpers/utils/dom.ts#L5-L19 Guess this will be helpful.
Author
Owner

@deepto98 commented on GitHub (Sep 30, 2021):

@liyasthomas Hi, I'd like to work on this issue. If it isn't assigned already, can you please assign this to me?

<!-- gh-comment-id:930799284 --> @deepto98 commented on GitHub (Sep 30, 2021): @liyasthomas Hi, I'd like to work on this issue. If it isn't assigned already, can you please assign this to me?
Author
Owner

@mandaputtra commented on GitHub (Sep 30, 2021):

Go ahead if you want. I actually want to work on this weekend. Got so much to do on weekday :((

<!-- gh-comment-id:930801545 --> @mandaputtra commented on GitHub (Sep 30, 2021): Go ahead if you want. I actually want to work on this weekend. Got so much to do on weekday :((
Author
Owner

@deepto98 commented on GitHub (Sep 30, 2021):

@mandaputtra Okay, sure. I also have some work during the week . Will try to work on this once I'm free and keep you updated.

<!-- gh-comment-id:930803429 --> @deepto98 commented on GitHub (Sep 30, 2021): @mandaputtra Okay, sure. I also have some work during the week . Will try to work on this once I'm free and keep you updated.
Author
Owner

@JeremyJaydan commented on GitHub (Oct 1, 2021):

Was about to make an issue on this, I'm keen for a solution! :)

<!-- gh-comment-id:931835283 --> @JeremyJaydan commented on GitHub (Oct 1, 2021): Was about to make an issue on this, I'm keen for a solution! :)
Author
Owner

@Sayan-dev commented on GitHub (Oct 4, 2021):

I can finish this up on weekdays I hope and if you don't mind @deepto98
@liyasthomas How about I work on it now

<!-- gh-comment-id:933088208 --> @Sayan-dev commented on GitHub (Oct 4, 2021): I can finish this up on weekdays I hope and if you don't mind @deepto98 @liyasthomas How about I work on it now
Author
Owner

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

@deepto98 @Sayan-dev @liyasthomas is anyone looking into this issue anymore ? If not, i can look into it and provide a fix.

<!-- gh-comment-id:938362596 --> @rishabhkalra96 commented on GitHub (Oct 8, 2021): @deepto98 @Sayan-dev @liyasthomas is anyone looking into this issue anymore ? If not, i can look into it and provide a fix.
Author
Owner

@mandaputtra commented on GitHub (Oct 8, 2021):

@rishabhkalra96 go ahead, the fix is simple actually.

<!-- gh-comment-id:938363951 --> @mandaputtra commented on GitHub (Oct 8, 2021): @rishabhkalra96 go ahead, the fix is simple actually.
Author
Owner

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

@rishabhkalra96 go ahead, the fix is simple actually.

Hi @mandaputtra , It might sound kinda absurd but which branch should i start looking into ? I am currently reproducing the issue on main using mac and the behaviour is same. On using cmd + left arrow either on url bar or body, it routes instead of skipping a word.

<!-- gh-comment-id:938759614 --> @rishabhkalra96 commented on GitHub (Oct 8, 2021): > @rishabhkalra96 go ahead, the fix is simple actually. Hi @mandaputtra , It might sound kinda absurd but which branch should i start looking into ? I am currently reproducing the issue on main using mac and the behaviour is same. On using cmd + left arrow either on url bar or body, it routes instead of skipping a word.
Author
Owner

@mandaputtra commented on GitHub (Oct 8, 2021):

on branch main, I don't own mac so i don't know if that is a preferred or not. Just make sure whenever you're on body or input ctrl + arrow right/left doesn't change routes

<!-- gh-comment-id:938811876 --> @mandaputtra commented on GitHub (Oct 8, 2021): on branch main, I don't own mac so i don't know if that is a preferred or not. Just make sure whenever you're on body or input ctrl + arrow right/left doesn't change routes
Author
Owner

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

on branch main, I don't own mac so i don't know if that is a preferred or not. Just make sure whenever you're on body or input ctrl + arrow right/left doesn't change routes

thanks for the reply. I looked into the changes and found out that the below conditions on line 99 are letting the meta + event reach default jumpActions. Removing the not conditions fixed the issue.

github.com/hoppscotch/hoppscotch@d2b39976ba/packages/hoppscotch-app/helpers/keybindings.ts (L93-L111)

github.com/hoppscotch/hoppscotch@d2b39976ba/packages/hoppscotch-app/layouts/default.vue (L109-L133)

Also, note that the issue is not just in linux, its consistent with all browsers. Since i don't own windows, so cant really tell about it but on mac its reproducible as in ubuntu (both on chrome and brave).

<!-- gh-comment-id:938940733 --> @rishabhkalra96 commented on GitHub (Oct 8, 2021): > on branch main, I don't own mac so i don't know if that is a preferred or not. Just make sure whenever you're on body or input ctrl + arrow right/left doesn't change routes thanks for the reply. I looked into the changes and found out that the below conditions on line 99 are letting the meta + event reach default jumpActions. Removing the **not conditions** fixed the issue. https://github.com/hoppscotch/hoppscotch/blob/d2b39976ba270ed3fb4c729f4782ae591260b741/packages/hoppscotch-app/helpers/keybindings.ts#L93-L111 https://github.com/hoppscotch/hoppscotch/blob/d2b39976ba270ed3fb4c729f4782ae591260b741/packages/hoppscotch-app/layouts/default.vue#L109-L133 Also, note that the issue is not just in linux, its consistent with all browsers. Since i don't own windows, so cant really tell about it but on mac its reproducible as in ubuntu (both on chrome and brave).
Author
Owner

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

@mandaputtra please verify if the deploy preview resolves this issue.

<!-- gh-comment-id:938966757 --> @liyasthomas commented on GitHub (Oct 8, 2021): @mandaputtra please verify if the [deploy preview](https://deploy-preview-1862--hoppscotch.netlify.app) resolves this issue.
Sign in to join this conversation.
No milestone
No project
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference
starred/hoppscotch#585
No description provided.