JetBrains / compose-multiplatform

Compose Multiplatform, a modern UI framework for Kotlin that makes building performant and beautiful user interfaces easy and enjoyable.
https://jetbrains.com/lp/compose-multiplatform
Apache License 2.0
16.15k stars 1.17k forks source link

Enter/Return doesn't work as expected in a single line TextField #4255

Closed luludevmuniz closed 6 months ago

luludevmuniz commented 8 months ago

Describe the bug After setting the TextField parameter singleLine to true or maxLines to 1 and writing some text in it, pressing Enter/Return causes the cursor to return to the start of the TextField and the user can write some invisible text behind the text.

Affected platforms

Versions

To Reproduce Steps and/or the code snippet to reproduce the behavior:

  1. Go to kmp.jetbrains.com
  2. Selected Wasm option
  3. Download the project
  4. Replace the App() function for the codesnippet below
  5. Run the app in your browser
  6. Write some text in the TextField
  7. Press Enter/Return
  8. Text something and then you'll notice it will take a few deletes to reach the original text again.

Code Snippet:

import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.material.MaterialTheme
import androidx.compose.material.OutlinedTextField
import androidx.compose.runtime.*
import androidx.compose.ui.Modifier
import androidx.compose.ui.unit.dp

@Composable
fun App() {
    MaterialTheme {
        var value by remember { mutableStateOf("") }
            OutlinedTextField(
                modifier = Modifier
                    .fillMaxWidth()
                    .padding(top = 16.dp),
                value = value,
                onValueChange = {
                    value = it
                },
                singleLine = true
            )
        }
}

Expected behavior Don't allow the cursor to go back to the start of the composable.

Additional Context For some reason, the cursor is vanishing when I write the first text, so it's harder to see.

eymar commented 8 months ago

More info:

pressing Enter causes the cursor to go on the next line (TextField just doesn't show it)

adding a println shows in the logs that the actual text value has more lines

onValueChange = {
                value = it
                println("Value = $it")
            },

On desktop, the cursor never gets removed from the first (single) line.

luludevmuniz commented 6 months ago

Could not reproduce it on 1.6.10-beta02.

okushnikov commented 3 months ago

Please check the following ticket on YouTrack for follow-ups to this issue. GitHub issues will be closed in the coming weeks.