Skip to content

Safari/Firefox browser: keyboard not working for TextFields within SelectionArea + Dialog #157579

@xvrh

Description

@xvrh

Steps to reproduce

  • Run the given code with Flutter Web in the Safari or Firefox browser
  • Open the dialog
  • Try to write some text in each field

Expected results

The keyboard should work correctly

Actual results

Half of the time the keyboard doesn't work. If you focus an other field, sometime it works and sometime it just doesn't.
It works for the Chrome browser but not for Firefox or Safari (on macOS)

Code sample

Code sample
import 'package:flutter/material.dart';

void main() => runApp(App());

class App extends StatelessWidget {
  const App({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: SelectionArea(
        child: Scaffold(
          body: Builder(
            builder: (context) {
              return Center(
                child: FilledButton(
                  onPressed: () {
                    showDialog(
                        context: context, builder: (context) => EditDialog());
                  },
                  child: Text('Open dialog'),
                ),
              );
            },
          ),
        ),
      ),
    );
  }
}

class EditDialog extends StatelessWidget {
  const EditDialog({super.key});

  @override
  Widget build(BuildContext context) {
    return AlertDialog(
      scrollable: true,
      title: Text('Dialog'),
      content: Column(
        mainAxisSize: MainAxisSize.min,
        children: [
          for (var i = 0; i < 8; i++)
            TextField(
              decoration: InputDecoration(labelText: 'Enter text'),
            ),
        ],
      ),
      actions: [
        FilledButton(
          onPressed: () {
            Navigator.pop(context);
          },
          child: Text('OK'),
        )
      ],
    );
  }
}

Screenshots or Video

Screenshots / Video demonstration

[Upload media here]

Logs

Logs
[Paste your logs here]

Flutter Doctor output

Doctor output
[✓] Flutter (Channel beta, 3.27.0-0.1.pre, on macOS 14.5 23F79 darwin-arm64, locale en-BE)
[✓] Android toolchain - develop for Android devices (Android SDK version 35.0.0)
[✓] Xcode - develop for iOS and macOS (Xcode 15.4)
[✓] Chrome - develop for the web
[✓] Android Studio (version 2024.2)
[✓] IntelliJ IDEA Ultimate Edition (version 2024.2.3)
[✓] VS Code (version 1.93.0)

Metadata

Metadata

Assignees

No one assigned

    Labels

    P2Important issues not at the top of the work lista: text inputEntering text in a text field or keyboard related problemsbrowser: firefoxonly manifests in Firefoxbrowser: safari-macosonly manifests in Safari on macOSf: selectionSelectableRegion, SelectionArea, SelectionContainer, Selectable, and related APIsfound in release: 3.24Found to occur in 3.24found in release: 3.27Found to occur in 3.27frameworkflutter/packages/flutter repository. See also f: labels.has reproducible stepsThe issue has been confirmed reproducible and is ready to work onplatform-webWeb applications specificallyr: fixedIssue is closed as already fixed in a newer versionteam-webOwned by Web platform teamtriaged-webTriaged by Web platform team

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions