Comments (3)
@leewes thanks for filing this! I have to admit I’m a noob when it comes to IME’s of any kind and a bit unsure how to even begin testing them. Perhaps you could assist me somewhat. The mask input uses the beforeinput
event — do you have any thoughts on how I could simulate an IME interaction to test what kind of events we are receiving at that event?
from formkit.
The mask input uses the beforeinput event — do you have any thoughts on how I could simulate an IME interaction to test what kind of events we are receiving at that event?
@justin-schroeder certainly! Though granted I'm also a bit new at this as well, so bear with me 😅
I'm not sure if there's a good way to simulate them without an IME.. From what I could tell by monitoring the element, IME inputs trigger composition
events in addition to the key press, beforeInput
, and input
events.
Not sure if this might help, but I created a somewhat incomplete example in sandbox:
that generates an composition event with the data
of the v-model
-ed value of a Dispatched Event Data field and fires the set of events in order when the buttons below are clicked. Each button represents a key press in IME and fires them in the order observed from monitoring the input.
Example:
Generally the events are fired in this sort of sequence
- start -> update (x times) -> end (from enter or clicking out)
for a string input like テスト
it's
- composition start, the dispatched data is
t
on first key press in IME (key code isT
) - composition updates
- The dispatched event
data
values on each following key press
i.テ
on second key press (key code isE
)
ii.テs
on third key press (key code isS
)
iii.テス
on fourth key press (key code isU
)
iv.テスt
on fifth key press (key code isT
)
v.テスト
on sixth key press (key code isO
)
- composition end, the value in the field is
テスト
on 'Enter' key press
from formkit.
For reference, a true ime input on a simpler string input like aa
-> ああ
looks like this on the events fired:
from formkit.
Related Issues (20)
- [BUG] SSR + v-model + local Storage HOT 3
- Select element remains in placeholder state when option selected using option groups with placeholder set
- valid state only correctly changes when other inputs are present HOT 1
- Repeater sortability not functioning properly HOT 1
- It is impossible to add a new tag if there is already a tag in the options with the same root or a part that matches the text of the new tag in taglist field HOT 2
- Clicking on this area will not trigger the Select menu
- formkit/i18n: Validation rule's message is incorrect when using array syntax for the validation
- `autocomplete`: Async options not filterable HOT 5
- Mask input and autocomplete failing validation HOT 1
- Errors don't show with more groups HOT 3
- Repeater should consistently render when the default slot is empty HOT 1
- Mixed order of identical items in dynamic list
- <FormKit type="mask"> renders <input type="mask"> HOT 3
- datetime-local field with initial value resets itself in firefox after the entry of a 0
- FormKit datepicker component: enter key submits the form and display the calendar popup
- `childRemoved` event not triggered for type list HOT 1
- setting Buddist locale breaks datepicker HOT 2
- Changing `datepicker` value makes it to autofocus on Safari
- Pro Inputs - Potential Memory Leak Issue HOT 1
- blur() doesn't remove focused attributes such as highlighted border and text inputs remain focused.
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from formkit.