compose-multiplatform icon indicating copy to clipboard operation
compose-multiplatform copied to clipboard

Compose Web - KeyEvent mappings

Open sc941737 opened this issue 2 years ago • 3 comments

Describe the bug Observing KeyEvents via the Modifier.onKeyEvent (or the like) function shows that the key "t" is mapped to KEY_UNKNOWN, and the key "6" to KEY_T. As far as I can tell, other keys seem fine.

Affected platforms

  • Web (K/Wasm) - Canvas based API
  • Web (K/JS) - Canvas based API

Versions

  • Kotlin version*: 1.9.0
  • Compose Multiplatform version*: 1.5.0-beta02

To Reproduce

  1. Add onKeyEvent call to a modifier of any TextField or parent.
  2. Log the KeyEvent inside the lambda.
  3. Run the app, press buttons.
  4. Open browser console and see logs.

Expected behavior T key should map to KEY_T 6 key to KEY_6

sc941737 avatar Sep 08 '23 01:09 sc941737

Thanks for the report!

A reproducer:

import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.size
import androidx.compose.runtime.Composable
import androidx.compose.runtime.LaunchedEffect
import androidx.compose.runtime.remember
import androidx.compose.ui.Modifier
import androidx.compose.ui.focus.FocusRequester
import androidx.compose.ui.focus.focusRequester
import androidx.compose.ui.focus.focusTarget
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.input.key.key
import androidx.compose.ui.input.key.onKeyEvent
import androidx.compose.ui.input.key.type
import androidx.compose.ui.unit.dp

@Composable
fun Test() {
    val focusRequester = remember { FocusRequester() }
    Box(Modifier.size(1000.dp).background(Color.Red).focusRequester(focusRequester).focusTarget().onKeyEvent {
        println("" + it.key + " " + it.type)

        true
    }) {  }

    LaunchedEffect(Unit) {
        focusRequester.requestFocus()
    }
}

Reproduced in Chrome, Windows 11.

igordmn avatar Sep 08 '23 16:09 igordmn

We have 2 issues here:

  1. wrong mapped key codes for some keys in web.
  2. returning Key.Unknown instead of Key(keyCode). We should return Key(keyCode) even if there is no knowing mapping in Compose. Unknown should be returned only if the platform doesn't know about this key code.

igordmn avatar Sep 12 '23 23:09 igordmn

seem to be many issues with KeyEvents on web platform !

#2296

dhakehurst avatar Feb 07 '24 10:02 dhakehurst

Reproduced with 1.5.0 and 1.6.0.

But it works correctly in 1.6.10-dev1571 (which contains key events related changes).

eymar avatar Apr 09 '24 08:04 eymar