Two key accented letters don't work in IText

[alisspers]

Accented letters that are combined in two separate keystrokes, where you first press the accent key (like ^) and then your vowel, don't work in IText.

Accented letters added programmatically or ones with the accent already added with one keystroke (like ÅÄÖ on a Swedish keyboard) work fine.

[kangax]

Hm, it seems to work just fine for me. Testing in http://fabricjs.com/kitchensink/ on Chrome 34, Mac OS X (english keyboard). Alt + a produces å, and so on.

[alisspers]

Can you also input characters like â and ü? I'm not sure how they're input on an english keyboard, but on my swe keyboard they are: ^, then a = â and ¨, then u = ü. It's the two-step input of a character that can't be performed.

Even a standalone ^ or ´ can't be input since they are a ^ key, then Space key, combination.

[kangax]

@alisspers Yeah, I'm able to.

Pressing alt + a creates å and so on.

[alisspers]

Yes, but those arent the type of characters I'm talking about I'm afraid. Those characters are produced by pressing, and holding the Alt key while pressing another key.

The type of character that don't work are the ones that you first press an accent character key like ^, and then (without holding any modifier key) you press a letter to produce i.e. â (hence ^ + a = â). In normal text boxes, clicking the accent key produces kind of a "shadow character" that is waiting to be applied to which ever letter comes next.

I realise now that this might be a feature that doesn't exist on your keyboard, and thus it'll quite difficult to troubleshoot. I'll try to find a way to have a look and see if I can produce a PR.

[kangax]

Actually, on my mac, in order to type "â", I need to hold "a", then wait for suggestion box to pop up and press right key couple times (or number 3) to chose "â". This is obviously not possible with iText since we don't have textarea there and implementing this kind of suggestion box is just waaay out of Fabric's scope. It's one of the disadvantages of not using native text controls in a browser, when we rely on canvas instead.

[kangax]

I'm closing this since there's nothing I can think of to solve this issue.

[MikyKuroneko]

I think the issue has been misunderstood. We are not talking about "holding the letter" and waiting for OS X's suggestions, nor "holding a modifier and then the letter" to input a different character. In non-english keyboards special characters (like á, è, ü) are written hitting ONE time the accent key and then ONE time the letter key. This is not currently working in IText, and I can confirm this with Chrome (last version) on OS X Mavericks with a MacBook Pro with spanish keyboard.

Edit: For what it's worth, it seems like the browser is actually sending you the characters, as hitting the accent key and the letter key does not produce anything (not even the non-accentuated letter). If you press the letter again (without hitting first the accent key) the letter is written just fine.

[MikyKuroneko]

Follow up: Tracked down the code in Fabric and I think I've found the problem. Apparently, the KeyPress event is not being fired on the hiddenTextarea component when the user presses the accent key. Not sure if it's a browser bug, thought.

[MikyKuroneko]

Sorry to spam too much, but I've identified a couple of things that can help solve this problem. First, this problem only appears on Mac OS X due to the way the OS handles accents. Second, because of this the textarea does not trigger the keypress event when the accent key is pressed, but it does trigger the KeyUp event, complete with keyCode. What I've done is add an additional event in the Fabric.js code to handle the KeyUp event in the hiddenTextarea, check whether the key is one of the accents keys and manually replace the appropriate letters on the KeyPress event based on a flag I stablished on the KeyUp event. It's far from perfect, but at least it works.

[vamo89]

@alisspers, @MikyKuroneko. I started a pull request #1625 trying to solve this problem.

[marcospassos]

I'm facing the same issue. I can't use ~ + a to inset ã, for instance.