Web: `TextField.focus()` after `on_submit` discards keys typed while the focus request is in flight

Abierto
  • ¿Algo no está bien?
#7,059 0 comentarios 0 reacciones 0 asignados Ver en GitHub

Los mantenedores suelen responder en 1 día

Nadie ha tomado este issue todavía.

Evaluación

Dificultad
4/5
Tiempo estimado
3-5 días
Aptitud para principiantes
45/100
Tipo de issue
Error
Claridad
Bastante claro
Estado de actividad
Activo
Stack tecnológico
flutter, python, web-dev
Área
frontend, mobile-dev

Línea de trabajo

Start by tracing how Enter affects TextField focus in the web client, then follow the client handling of the focus() method invoked from Python. The issue provides a minimal app and reproducible Playwright steps; use those to compare input value and active element around the focus request. Done means the retyped characters are preserved or Enter can keep focus, with the behavior verified against the reported cases.

Escrito por el modelo de indexación a partir del texto del issue.

Descripción

Flet: 1.0.3 (stock, no other code). Browser: Chromium headless shell (Playwright), mobile emulation 390x844
with touch; macOS host. Mode: web (ft.run(main, view=None, port=8772)).

What happens

On web, pressing Enter in a TextField takes focus away from it: the field's <input> is removed and focus moves to
flutter-view. This happens with or without an on_submit handler. To let the user retype without tapping the field
again, the handler calls await field.focus(). Keys the user types after the Enter and before that focus request
lands in the client are lost. Once focus is back, the field holds only the keys typed after it arrived.

Minimal app

import flet as ft

def main(page: ft.Page):
    password = ft.TextField(label="Password", password=True)

    async def on_submit(e):
        print("submit", "empty" if not e.data else "nonempty")
        if not e.data:
            await password.focus()   # let the user retype without tapping the field

    password.on_submit = on_submit
    page.add(password)

ft.run(main, view=None, port=8772)

Steps

Each run uses a fresh browser context.

  1. Click the field.
  2. Press Enter with the field empty.
  3. Type a 14-character value with no click.
  4. Press Enter.

Each run records the DOM value and document.activeElement after every key, and compares the second on_submit
value with the typed text: exact, prefix lost, or empty.

Results (n=20 per arm)

arm timing second submit
focus() in the handler typing starts at once after the Enter 0/20 exact, 20/20 prefix lost
focus() in the handler typing starts 250 ms after the handler ran, then 120 ms per key 19/20 exact, 1/20 prefix lost
focus() only, no other update in the handler at once 0/20 exact, 20/20 prefix lost
no focus(), the test clicks the field again right after the Enter at once 20/20 exact
no focus(), no click 0.3 s after the handler ran the keys go nowhere: no second submit in 20/20
no on_submit at all; Enter caught by page.on_keyboard_event at once the field loses focus within a few keys of the Enter in 20/20; the retype never reaches it (second submit empty in 20/20)
no on_submit, no keyboard handler at once the same: the field loses focus after the Enter in 20/20 and keeps none of the retype

TextField.focus() is only _invoke_method("focus") on the Python side, so the reset happens in the web client when
the focus request is handled. In 2 runs the DOM <input> was briefly absent as the focus landed: the editing element
appears to be recreated.

Expected

Either:

  • Enter on a TextField can keep its focus (an option, or no blur when on_submit does not ask for it); or
  • focus() on a field that the user is already typing into keeps the characters typed so far.

Caveat

Playwright key events are not a phone's soft keyboard. We have not measured a real device's Go key.

Lenguaje dominante
Python
Estrellas
17.5k
Forks
740
Merge medio
1 d 8 h
PR fusionados (30 d)
74

Preparar el entorno

Primeros pasos

  1. Lee el issue completo y luego la guía de contribución del proyecto.
  2. Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
  3. Haz un fork del repositorio y trabaja en una rama.
  4. Abre un pull request que haga referencia al número del issue.

Más de flet-dev/flet

Todos los issues de flet-dev/flet

Issues similares

Más issues de Python

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.