search

nextcloud / forms

📝 Simple form & survey app for Nextcloud
https://apps.nextcloud.com/apps/forms
GNU Affero General Public License v3.0
316 stars 97 forks source link

incompatible to some input method like Japanese or Chinese #2220

Closed weichenlin closed 1 month ago

weichenlin commented 3 months ago

Please use the 👍 reaction to show that you are affected by the same issue. Please don't comment if you have no relevant information to add!

Describe the bug when add a checkbox or select options, if i type any char, a new empty input item will appear below. this behavior will interrupt some input method like Chinese or Japanese, that one character needs multiple type, and cause error message "There was an issue deleting this option", also the option value is incorrect.

To Reproduce Steps to reproduce the behavior:

  1. Click "new form"
  2. Click "add a question", select "Dropdown"
  3. Click "add a new answer" input field
  4. use Japanese input method, type "sa" for char さ

Expected behavior the char "さ" appear in the answer

Screenshots Screenshot_20240622_155814s

Nextcloud (please complete the following information):

Desktop (please complete the following information):

Browser log

NcSettingsSection-B0-LmypW-DDIm67GF.mjs:2     DELETE https://nc2.mysite.net/ocs/v2.php/apps/forms/api/v2.4/option/cbrrt 400
(anonymous) @ NcSettingsSection-B0-LmypW-DDIm67GF.mjs:2
xhr @ NcSettingsSection-B0-LmypW-DDIm67GF.mjs:2
qi @ NcSettingsSection-B0-LmypW-DDIm67GF.mjs:2
_request @ NcSettingsSection-B0-LmypW-DDIm67GF.mjs:2
request @ NcSettingsSection-B0-LmypW-DDIm67GF.mjs:2
bs.<computed> @ NcSettingsSection-B0-LmypW-DDIm67GF.mjs:2
(anonymous) @ NcSettingsSection-B0-LmypW-DDIm67GF.mjs:2
deleteOptionFromDatabase @ Submit-DWdudiQx.mjs:2
deleteOption @ Submit-DWdudiQx.mjs:2
(anonymous) @ Submit-DWdudiQx.mjs:2
checkValidOption @ Submit-DWdudiQx.mjs:2
me @ vendor-DFuGXkIP.mjs:2
t @ vendor-DFuGXkIP.mjs:2
me @ vendor-DFuGXkIP.mjs:2
e.$emit @ vendor-DFuGXkIP.mjs:2
handleTabbing @ Submit-DWdudiQx.mjs:2
me @ vendor-DFuGXkIP.mjs:2
t @ vendor-DFuGXkIP.mjs:2
Yc.i._wrapper @ vendor-DFuGXkIP.mjs:2
focus @ Submit-DWdudiQx.mjs:2
focusIndex @ Submit-DWdudiQx.mjs:2
(anonymous) @ Submit-DWdudiQx.mjs:2
(anonymous) @ vendor-DFuGXkIP.mjs:2
Cn @ vendor-DFuGXkIP.mjs:2
Promise.then (async)
an @ vendor-DFuGXkIP.mjs:2
er @ vendor-DFuGXkIP.mjs:2
Ga.e.$nextTick @ vendor-DFuGXkIP.mjs:2
render @ NcSettingsSection-B0-LmypW-DDIm67GF.mjs:2
Ga.e._render @ vendor-DFuGXkIP.mjs:2
r @ vendor-DFuGXkIP.mjs:2
e.get @ vendor-DFuGXkIP.mjs:2
e.run @ vendor-DFuGXkIP.mjs:2
ws @ vendor-DFuGXkIP.mjs:2
(anonymous) @ vendor-DFuGXkIP.mjs:2
Cn @ vendor-DFuGXkIP.mjs:2
Promise.then (async)
an @ vendor-DFuGXkIP.mjs:2
er @ vendor-DFuGXkIP.mjs:2
Rt @ vendor-DFuGXkIP.mjs:2
e.update @ vendor-DFuGXkIP.mjs:2
e.notify @ vendor-DFuGXkIP.mjs:2
set @ vendor-DFuGXkIP.mjs:2
m.<computed> @ vendor-DFuGXkIP.mjs:2
me @ vendor-DFuGXkIP.mjs:2
t @ vendor-DFuGXkIP.mjs:2
me @ vendor-DFuGXkIP.mjs:2
e.$emit @ vendor-DFuGXkIP.mjs:2
updateOptions @ Submit-DWdudiQx.mjs:2
addNewEntry @ Submit-DWdudiQx.mjs:2
me @ vendor-DFuGXkIP.mjs:2
t @ vendor-DFuGXkIP.mjs:2
Yc.i._wrapper @ vendor-DFuGXkIP.mjs:2
NcSettingsSection-B0-LmypW-DDIm67GF.mjs:2 [ERROR] forms: Error while deleting an option {app: 'forms', uid: 'admin', level: 2, option: {…}, error: V}
value @ NcSettingsSection-B0-LmypW-DDIm67GF.mjs:2
value @ NcSettingsSection-B0-LmypW-DDIm67GF.mjs:2
(anonymous) @ Submit-DWdudiQx.mjs:2
Promise.catch (async)
deleteOptionFromDatabase @ Submit-DWdudiQx.mjs:2
deleteOption @ Submit-DWdudiQx.mjs:2
(anonymous) @ Submit-DWdudiQx.mjs:2
checkValidOption @ Submit-DWdudiQx.mjs:2
me @ vendor-DFuGXkIP.mjs:2
t @ vendor-DFuGXkIP.mjs:2
me @ vendor-DFuGXkIP.mjs:2
e.$emit @ vendor-DFuGXkIP.mjs:2
handleTabbing @ Submit-DWdudiQx.mjs:2
me @ vendor-DFuGXkIP.mjs:2
t @ vendor-DFuGXkIP.mjs:2
Yc.i._wrapper @ vendor-DFuGXkIP.mjs:2
focus @ Submit-DWdudiQx.mjs:2
focusIndex @ Submit-DWdudiQx.mjs:2
(anonymous) @ Submit-DWdudiQx.mjs:2
(anonymous) @ vendor-DFuGXkIP.mjs:2
Cn @ vendor-DFuGXkIP.mjs:2
Promise.then (async)
an @ vendor-DFuGXkIP.mjs:2
er @ vendor-DFuGXkIP.mjs:2
Ga.e.$nextTick @ vendor-DFuGXkIP.mjs:2
render @ NcSettingsSection-B0-LmypW-DDIm67GF.mjs:2
Ga.e._render @ vendor-DFuGXkIP.mjs:2
r @ vendor-DFuGXkIP.mjs:2
e.get @ vendor-DFuGXkIP.mjs:2
e.run @ vendor-DFuGXkIP.mjs:2
ws @ vendor-DFuGXkIP.mjs:2
(anonymous) @ vendor-DFuGXkIP.mjs:2
Cn @ vendor-DFuGXkIP.mjs:2
Promise.then (async)
an @ vendor-DFuGXkIP.mjs:2
er @ vendor-DFuGXkIP.mjs:2
Rt @ vendor-DFuGXkIP.mjs:2
e.update @ vendor-DFuGXkIP.mjs:2
e.notify @ vendor-DFuGXkIP.mjs:2
set @ vendor-DFuGXkIP.mjs:2
m.<computed> @ vendor-DFuGXkIP.mjs:2
me @ vendor-DFuGXkIP.mjs:2
t @ vendor-DFuGXkIP.mjs:2
me @ vendor-DFuGXkIP.mjs:2
e.$emit @ vendor-DFuGXkIP.mjs:2
updateOptions @ Submit-DWdudiQx.mjs:2
addNewEntry @ Submit-DWdudiQx.mjs:2
me @ vendor-DFuGXkIP.mjs:2
t @ vendor-DFuGXkIP.mjs:2
Yc.i._wrapper @ vendor-DFuGXkIP.mjs:2
Submit-DWdudiQx.mjs:2 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'value')
    at s.onInput (Submit-DWdudiQx.mjs:2:293202)
onInput @ Submit-DWdudiQx.mjs:2
await in onInput (async)
(anonymous) @ Submit-DWdudiQx.mjs:2
(anonymous) @ vendor-DFuGXkIP.mjs:2
Cn @ vendor-DFuGXkIP.mjs:2
Promise.then (async)
an @ vendor-DFuGXkIP.mjs:2
er @ vendor-DFuGXkIP.mjs:2
Ga.e.$nextTick @ vendor-DFuGXkIP.mjs:2
render @ NcSettingsSection-B0-LmypW-DDIm67GF.mjs:2
Ga.e._render @ vendor-DFuGXkIP.mjs:2
r @ vendor-DFuGXkIP.mjs:2
e.get @ vendor-DFuGXkIP.mjs:2
e.run @ vendor-DFuGXkIP.mjs:2
ws @ vendor-DFuGXkIP.mjs:2
(anonymous) @ vendor-DFuGXkIP.mjs:2
Cn @ vendor-DFuGXkIP.mjs:2
Promise.then (async)
an @ vendor-DFuGXkIP.mjs:2
er @ vendor-DFuGXkIP.mjs:2
Rt @ vendor-DFuGXkIP.mjs:2
e.update @ vendor-DFuGXkIP.mjs:2
e.notify @ vendor-DFuGXkIP.mjs:2
set @ vendor-DFuGXkIP.mjs:2
m.<computed> @ vendor-DFuGXkIP.mjs:2
me @ vendor-DFuGXkIP.mjs:2
t @ vendor-DFuGXkIP.mjs:2
me @ vendor-DFuGXkIP.mjs:2
e.$emit @ vendor-DFuGXkIP.mjs:2
updateOptions @ Submit-DWdudiQx.mjs:2
addNewEntry @ Submit-DWdudiQx.mjs:2
me @ vendor-DFuGXkIP.mjs:2
t @ vendor-DFuGXkIP.mjs:2
Yc.i._wrapper @ vendor-DFuGXkIP.mjs:2
TUCAOEVER commented 2 months ago

https://github.com/nextcloud/forms/assets/43756134/ea26374b-6d27-44fe-a5bf-e4cc68003ebf

To imporve understanding, i made a vedio about this issue.

Chartman123 commented 2 months ago

Ok, thank you. I've already got a solution for it in mind :) Let's see if it really works...

Chartman123 commented 2 months ago

@weichenlin @TUCAOEVER do you have a development environment where you could check my PR?

TUCAOEVER commented 2 months ago

@weichenlin @TUCAOEVER do you have a development environment where you could check my PR?

Sorry, I don't have it. Could you possibly pack it as an app so I can try to install it manually and test how it works?

Chartman123 commented 2 months ago

Yes, I can, but please be aware that there are some other changes included, that are not yet released and that might change your database structure for Forms. So it's not possible to go back to the currently released version without manually adjusting your database again.

TUCAOEVER commented 2 months ago

Yes, I can, but please be aware that there are some other changes included, that are not yet released and that might change your database structure for Forms. So it's not possible to go back to the currently released version without manually adjusting your database again.

Don't worry about that, i have set up a individual docker for testing, so it doesn't matter if it changed the db structure.

Chartman123 commented 2 months ago

Ok, fine... Just wanted to make sure. 😉

For all others: Please only download and install it if you really know what you do!

forms.tar.gz

@TUCAOEVER please test in different browsers. So far I found differences in handling the input events between Firefox and Chromium based browsers.

Chartman123 commented 2 months ago

@TUCAOEVER I uploaded a new version to the link above... You could try again, I think I tackled the remaining inconsistencies

TUCAOEVER commented 2 months ago

But meanwhile i found someting weired about the new feature about "Upload file" option, and you can see in screenshots below

image

In editor view, there is spacing between the option and answer.

image

In preview page, there is spacing under the upload file button, which may related to the layout issue. Though it doen't effect using but really looks not that perfect, hope you could double check it.

TUCAOEVER commented 2 months ago

Sry for late reply, busy doing my job last week, i just have time to test it, the dropdown or checkbox works fine but have a little detail which i don't know if it a bug or your designed:

https://github.com/nextcloud/forms/assets/43756134/526dc268-f436-4456-b441-6dfcbf721382

when u start typing the first answer, right before entering, the new option will be automaticlly created, but the second option doesn't look like the first one, as u can see in the vedio, only after i have typed something in the box, the third option can be created, expect for that, nice work!

Chartman123 commented 2 months ago

Could you please create a new issue for that file question stuff?

Glad to hear that the IME things are working now :) And I'll have to investigate the use case with the first option of a question... I currently only tested it with questions where other options already existed.

Chartman123 commented 2 months ago

@TUCAOEVER ok, I did another check... there's a slight difference in how the first option is handled... when you create a new question, the "Add a new answer" field is shown, which is more just like a dummy field. as soon as you enter some text, it will move the text to a new field (answer number 1), and so on.

When you delete all existing answers/options, the last field (answer number 1) will stay there. This is then just like every other answer field. it will show the "Add a new answer" dummy field as soon as some text is added to field 1.

So basically everything "as expected". 👍🏻

TUCAOEVER commented 2 months ago

Could you please create a new issue for that file question stuff?

Glad to hear that the IME things are working now :) And I'll have to investigate the use case with the first option of a question... I currently only tested it with questions where other options already existed.

Of course!