[GH-ISSUE #2039] [bug]: 参数无法填写中文 使用搜狗输入法会把拼音和中文都添加上 #666

Closed
opened 2026-03-16 16:35:22 +03:00 by kerem · 23 comments
Owner

Originally created by @maidou883 on GitHub (Dec 23, 2021).
Original GitHub issue: https://github.com/hoppscotch/hoppscotch/issues/2039

Is there an existing issue for this?

  • I have searched the existing issues

Current behavior

输入中文时会把拼音也输入上去
image
image

Steps to reproduce

1.打开hoppscotch
2.填写参数
3.使用输入法填写中文
4.会出现拼音也输入上去

Environment

Release

Version

v2.1.0 Latest

Originally created by @maidou883 on GitHub (Dec 23, 2021). Original GitHub issue: https://github.com/hoppscotch/hoppscotch/issues/2039 ### Is there an existing issue for this? - [x] I have searched the existing issues ### Current behavior 输入中文时会把拼音也输入上去 ![image](https://user-images.githubusercontent.com/48854556/147205733-46666505-919d-4c4d-ac09-00af18359cd2.png) ![image](https://user-images.githubusercontent.com/48854556/147205775-9baaeba8-980f-46df-9511-77398bdb91c6.png) ### Steps to reproduce 1.打开hoppscotch 2.填写参数 3.使用输入法填写中文 4.会出现拼音也输入上去 ### Environment Release ### Version v2.1.0 Latest
kerem 2026-03-16 16:35:22 +03:00
Author
Owner

@liyasthomas commented on GitHub (Dec 23, 2021):

@maidou883, what I've understood is: "Parameters cannot be filled in Chinese. Using Sogou input method will add both Pinyin and Chinese."

Since I don't have access to Chinese or Pinyin input tools, I am afraid I can't reproduce this behavior at my end.

Let me know if this behavior is true to all input fields in Hoppscotch or just for Parameters?

<!-- gh-comment-id:1000161338 --> @liyasthomas commented on GitHub (Dec 23, 2021): @maidou883, what I've understood is: "Parameters cannot be filled in Chinese. Using Sogou input method will add both Pinyin and Chinese." Since I don't have access to Chinese or Pinyin input tools, I am afraid I can't reproduce this behavior at my end. Let me know if this behavior is true to all input fields in Hoppscotch or just for Parameters?
Author
Owner

@maidou883 commented on GitHub (Dec 23, 2021):

@liyasthomas Try to fill in other parameters, you will encounter the same problem.
The correct approach should be to retain only Chinese, not Pinyin (English letters).
image
Using the input field here should solve this problem.

<!-- gh-comment-id:1000171750 --> @maidou883 commented on GitHub (Dec 23, 2021): @liyasthomas Try to fill in other parameters, you will encounter the same problem. The correct approach should be to retain only Chinese, not Pinyin (English letters). ![image](https://user-images.githubusercontent.com/48854556/147222727-acb93d22-f3fa-4d19-839c-3db89cc0bb46.png) Using the input field here should solve this problem.
Author
Owner

@liyasthomas commented on GitHub (Dec 23, 2021):

May I know if this happens in other input fields like URL, Headers sections etc?

<!-- gh-comment-id:1000187978 --> @liyasthomas commented on GitHub (Dec 23, 2021): May I know if this happens in other input fields like `URL`, `Headers` sections etc?
Author
Owner

@maidou883 commented on GitHub (Dec 23, 2021):

@liyasthomas
URL, HeadersSame error.
All positions that can be entered are this error.
I don't know if the same error will occur in other languages.
This error occurs when you enter Chinese, It is OK to enter English only.
Changing the div tag to the input tag should fix this bug.

<!-- gh-comment-id:1000368446 --> @maidou883 commented on GitHub (Dec 23, 2021): @liyasthomas `URL`, `Headers`Same error. All positions that can be entered are this error. I don't know if the same error will occur in other languages. This error occurs when you enter Chinese, It is OK to enter English only. Changing the div tag to the input tag should fix this bug.
Author
Owner

@liyasthomas commented on GitHub (Dec 23, 2021):

@maidou883 I can't find any evidence of why this is happening. Hoppscotch doesn't have any such functions to auto-translate/parse any of the user's inputs. Either this got something to do with your browser (any 3rd party extensions maybe?) or your input tool.

I am afraid I can't provide any help with the behavior I cannot reproduce at my end. Moreover, I haven't received any such bug reports from our users.

Let me know if you can reproduce this issue on any other device just to confirm it got something to do with Hoppscotch.

May I know what this component is:

screely-1640273064648

<!-- gh-comment-id:1000373819 --> @liyasthomas commented on GitHub (Dec 23, 2021): @maidou883 I can't find any evidence of why this is happening. Hoppscotch doesn't have any such functions to auto-translate/parse any of the user's inputs. Either this got something to do with your browser (any 3rd party extensions maybe?) or your input tool. I am afraid I can't provide any help with the behavior I cannot reproduce at my end. Moreover, I haven't received any such bug reports from our users. Let me know if you can reproduce this issue on any other device just to confirm it got something to do with Hoppscotch. May I know what this component is: ![screely-1640273064648](https://user-images.githubusercontent.com/10395817/147260576-6f0fd057-fb4d-42c6-ad28-798fea504f9b.png)
Author
Owner

@maidou883 commented on GitHub (Dec 23, 2021):

@liyasthomas
It's OK to enter Chinese in Google and GitHub, but hopscotch can't. I can't input it when I open it on other computers. You can find a Chinese who should help you reproduce your mistakes.

<!-- gh-comment-id:1000376498 --> @maidou883 commented on GitHub (Dec 23, 2021): @liyasthomas It's OK to enter Chinese in Google and GitHub, but hopscotch can't. I can't input it when I open it on other computers. You can find a Chinese who should help you reproduce your mistakes.
Author
Owner

@maidou883 commented on GitHub (Dec 23, 2021):

@liyasthomas
image
The content in the red box is redundant. When I input the content in the green box, I will automatically fill in the content in the red box. I only need the content in the green box, not the content in the red box

<!-- gh-comment-id:1000380278 --> @maidou883 commented on GitHub (Dec 23, 2021): @liyasthomas ![image](https://user-images.githubusercontent.com/48854556/147261293-8d819ec6-6932-4a39-99a1-264158bdac50.png) The content in the red box is redundant. When I input the content in the green box, I will automatically fill in the content in the red box. I only need the content in the green box, not the content in the red box
Author
Owner

@maidou883 commented on GitHub (Dec 24, 2021):

Why use div instead of input here?

<!-- gh-comment-id:1000601432 --> @maidou883 commented on GitHub (Dec 24, 2021): Why use div instead of input here?
Author
Owner

@liyasthomas commented on GitHub (Dec 24, 2021):

Native input fields don't support enabling features like style for environments etc.

Screenshot 2021-12-24 at 7 11 34 AM
<!-- gh-comment-id:1000602646 --> @liyasthomas commented on GitHub (Dec 24, 2021): Native `input` fields don't support enabling features like style for environments etc. <img width="1098" alt="Screenshot 2021-12-24 at 7 11 34 AM" src="https://user-images.githubusercontent.com/10395817/147305486-171c47ab-1d76-4659-a58c-2367c8e84aa4.png">
Author
Owner

@maidou883 commented on GitHub (Dec 24, 2021):

I'll send you an email and a video later. You'll see the recurrence of the error.

<!-- gh-comment-id:1000605165 --> @maidou883 commented on GitHub (Dec 24, 2021): I'll send you an email and a video later. You'll see the recurrence of the error.
Author
Owner

@maidou883 commented on GitHub (Dec 24, 2021):

@liyasthomas The mail has been sent successfully.
Title Recurrence error.

<!-- gh-comment-id:1000609609 --> @maidou883 commented on GitHub (Dec 24, 2021): @liyasthomas The mail has been sent successfully. Title Recurrence error.
Author
Owner

@zsxeee commented on GitHub (Dec 24, 2021):

Reproduced with Microsoft IME with Chinese and Japanese.
image
image

<!-- gh-comment-id:1000617876 --> @zsxeee commented on GitHub (Dec 24, 2021): Reproduced with Microsoft IME with Chinese and Japanese. ![image](https://user-images.githubusercontent.com/18413220/147308834-c68f48f2-3faf-4664-b334-2e6bc10476d5.png) ![image](https://user-images.githubusercontent.com/18413220/147309008-da33ebb9-a1c5-4f30-8802-b6268eecd5fc.png)
Author
Owner

@liyasthomas commented on GitHub (Dec 24, 2021):

@liyasthomas The mail has been sent successfully. Title Recurrence error.

I've not received the mail. You can share the video here in comments or send it to support@hoppscotch.io

<!-- gh-comment-id:1000620202 --> @liyasthomas commented on GitHub (Dec 24, 2021): > @liyasthomas The mail has been sent successfully. Title Recurrence error. I've not received the mail. You can share the video here in comments or send it to support@hoppscotch.io
Author
Owner

@liyasthomas commented on GitHub (Dec 24, 2021):

Reproduced with Microsoft IME with Chinese and Japanese. image image

I'd appreciate if you can give proper steps to reproduce it.

<!-- gh-comment-id:1000620340 --> @liyasthomas commented on GitHub (Dec 24, 2021): > Reproduced with Microsoft IME with Chinese and Japanese. ![image](https://user-images.githubusercontent.com/18413220/147308834-c68f48f2-3faf-4664-b334-2e6bc10476d5.png) ![image](https://user-images.githubusercontent.com/18413220/147309008-da33ebb9-a1c5-4f30-8802-b6268eecd5fc.png) I'd appreciate if you can give proper steps to reproduce it.
Author
Owner

@maidou883 commented on GitHub (Dec 24, 2021):

Sent successfully support@hoppscotch.io

<!-- gh-comment-id:1000622146 --> @maidou883 commented on GitHub (Dec 24, 2021): Sent successfully support@hoppscotch.io
Author
Owner

@zsxeee commented on GitHub (Dec 24, 2021):

Reproduced with Microsoft IME with Chinese and Japanese. image image

I'd appreciate if you can give proper steps to reproduce it.

If you are using Windows, you can add a keyboard with:

Windows Settings | Time & Language | Language | Add a Language | Search & select "Chinese(Any)" or "Japanese"
Change keyboard with Win + Space, then input with "中" mode in Chinese or "あ"/"ア" mode in Japanese.
Use shift switch mode in Chinese.

<!-- gh-comment-id:1000623671 --> @zsxeee commented on GitHub (Dec 24, 2021): > > Reproduced with Microsoft IME with Chinese and Japanese. ![image](https://user-images.githubusercontent.com/18413220/147308834-c68f48f2-3faf-4664-b334-2e6bc10476d5.png) ![image](https://user-images.githubusercontent.com/18413220/147309008-da33ebb9-a1c5-4f30-8802-b6268eecd5fc.png) > > I'd appreciate if you can give proper steps to reproduce it. If you are using Windows, you can add a keyboard with: Windows Settings | Time & Language | Language | Add a Language | Search & select "Chinese(Any)" or "Japanese" Change keyboard with `Win + Space`, then input with "中" mode in Chinese or "あ"/"ア" mode in Japanese. Use shift switch mode in Chinese.
Author
Owner

@liyasthomas commented on GitHub (Dec 24, 2021):

cc @AndrewBastin can you check if it's reproducible at your end? Refer above steps.

If it's reproducible, then it got something to do with the EnvInputcomment and the way we parse UTF-8 characters in it.

<!-- gh-comment-id:1000680729 --> @liyasthomas commented on GitHub (Dec 24, 2021): cc @AndrewBastin can you check if it's reproducible at your end? Refer above steps. If it's reproducible, then it got something to do with the `EnvInput`comment and the way we parse UTF-8 characters in it.
Author
Owner

@kidonng commented on GitHub (Dec 28, 2021):

I was about to report the same issue and almost ignored this one due to its title being written in Chinese but for I can read it.

Back to the topic, this seems to be related to the fact that <SmartEnvInput> does some transformation to its input. This interferes with IMEs which expect the inputed text to stay as-is.

The solution would be checking KeyboardEvent.isComposing and making transformations only after the user finishes inputting.

<!-- gh-comment-id:1001867110 --> @kidonng commented on GitHub (Dec 28, 2021): I was about to report the same issue and almost ignored this one due to its title being written in Chinese but for I can read it. Back to the topic, this seems to be related to the fact that [`<SmartEnvInput>`](https://github.com/hoppscotch/hoppscotch/blob/724e1e4c8f8e60d7e7e381cc0f1f7cb7e8388221/packages/hoppscotch-app/components/smart/EnvInput.vue) does some transformation to its input. This interferes with [IMEs](https://developer.mozilla.org/en-US/docs/Glossary/Input_method_editor) which expect the inputed text to stay as-is. The solution would be checking [`KeyboardEvent.isComposing`](https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/isComposing) and making transformations only after the user finishes inputting.
Author
Owner

@kidonng commented on GitHub (Dec 28, 2021):

FYI, CJK IMEs are not required to reproduce the bug. Regular IMEs on mobile should be able to trigger it pretty easily.

This is how the prediction/pre-edit/composition should look like normally:

https://user-images.githubusercontent.com/44045911/147529525-37406a43-ce3b-46af-ab78-6f40a72ffd87.mp4

In <SmartEnvInput>, the prediction is interruptted and resumed on every keystroke, and it can even result in inputted texts being duplicated:

https://user-images.githubusercontent.com/44045911/147529692-110ca73d-1d6f-4761-b2d8-0dff5aa796e4.mp4

<!-- gh-comment-id:1001869333 --> @kidonng commented on GitHub (Dec 28, 2021): FYI, CJK IMEs are not required to reproduce the bug. Regular IMEs on mobile should be able to trigger it pretty easily. This is how the prediction/pre-edit/composition should look like normally: https://user-images.githubusercontent.com/44045911/147529525-37406a43-ce3b-46af-ab78-6f40a72ffd87.mp4 In `<SmartEnvInput>`, the prediction is interruptted and resumed on every keystroke, and it can even result in inputted texts being duplicated: https://user-images.githubusercontent.com/44045911/147529692-110ca73d-1d6f-4761-b2d8-0dff5aa796e4.mp4
Author
Owner

@AndrewBastin commented on GitHub (Dec 28, 2021):

@kidonng thank you for the detailed info!

The EnvInput system is a bit complex system so this might take a bit of time to get fixed.

Meanwhile will a toggle setting to disable EnvInput suffice for the meantime ? (cc: @liyasthomas)

Also, we would really love help if you are able to fix it as I personally don't have experience working with IMEs.

<!-- gh-comment-id:1002199565 --> @AndrewBastin commented on GitHub (Dec 28, 2021): @kidonng thank you for the detailed info! The EnvInput system is a bit complex system so this might take a bit of time to get fixed. Meanwhile will a toggle setting to disable EnvInput suffice for the meantime ? (cc: @liyasthomas) Also, we would really love help if you are able to fix it as I personally don't have experience working with IMEs.
Author
Owner

@liyasthomas commented on GitHub (Jan 6, 2022):

It would be great if you can test this deploy preview and see if the error persists or not: https://deploy-preview-2057--hoppscotch.netlify.app

cc: @maidou883, @zsxeee, @kidonng

<!-- gh-comment-id:1006526493 --> @liyasthomas commented on GitHub (Jan 6, 2022): It would be great if you can test this deploy preview and see if the error persists or not: https://deploy-preview-2057--hoppscotch.netlify.app cc: @maidou883, @zsxeee, @kidonng
Author
Owner

@zsxeee commented on GitHub (Jan 6, 2022):

It would be great if you can test this deploy preview and see if the error persists or not: https://deploy-preview-2057--hoppscotch.netlify.app

LGTM on Microsoft IMEs

<!-- gh-comment-id:1006586977 --> @zsxeee commented on GitHub (Jan 6, 2022): > It would be great if you can test this deploy preview and see if the error persists or not: https://deploy-preview-2057--hoppscotch.netlify.app LGTM on Microsoft IMEs
Author
Owner

@kidonng commented on GitHub (Jan 7, 2022):

Late for replying but unfortunately I was busy and didn't got the time to submit a fix myself.

The related PR works great, however one issue still remains: backspace key on IMEs can still be funky:

https://user-images.githubusercontent.com/44045911/148494668-7e0f693d-da80-491f-b5d8-0a1f4897d37d.mp4

<!-- gh-comment-id:1007143604 --> @kidonng commented on GitHub (Jan 7, 2022): Late for replying but unfortunately I was busy and didn't got the time to submit a fix myself. The related PR works great, however one issue still remains: backspace key on IMEs can still be funky: https://user-images.githubusercontent.com/44045911/148494668-7e0f693d-da80-491f-b5d8-0a1f4897d37d.mp4
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#666
No description provided.