Select all text on focus with TextField in Flutter

Question

I have a TextField here :

class ScoreInputField extends StatefulWidget {
final TextEditingController controller;
final Function(String)? onSubmit;
final Function(String)? onChanged;
final bool isHome;

const ScoreInputField(
    {super.key,
    required this.controller,
    this.onSubmit,
    this.onChanged,
    required this.isHome});

@override
_ScoreInputFieldState createState() => _ScoreInputFieldState();
}

class _ScoreInputFieldState extends State<ScoreInputField> {
final FocusNode _focusNode = FocusNode();

@override
void initState() {
  super.initState();
  _focusNode.addListener(_handleFocusChange);
}

void _handleFocusChange() {
  if (_focusNode.hasFocus) {
    widget.controller.selection = TextSelection(
      baseOffset: 0,
      extentOffset: widget.controller.text.length,
    );
  }
}

@override
void dispose() {
  _focusNode.dispose();
  super.dispose();
}

@override
Widget build(BuildContext context) {
  return Container(
    height: 45,
    width: 45,
    decoration: BoxDecoration(color: Colors.white, borderRadius: radius5),
    child: TextField(
      onSubmitted: widget.onSubmit,
      textInputAction:
          widget.isHome ? TextInputAction.next : TextInputAction.done,
      maxLength: 1,
      enableInteractiveSelection: false,
      keyboardType: TextInputType.number,
      showCursor: false,
      textAlign: TextAlign.center,
      focusNode: _focusNode,
      onChanged: widget.onChanged,
      cursorColor: Colors.transparent,
      controller: widget.controller,
      decoration: InputDecoration(
          border: OutlineInputBorder(
            borderSide: const BorderSide(color: Colors.black38),
            borderRadius: radius5, // Bordures carrées
          ),
          focusedBorder: OutlineInputBorder(
            borderSide: const BorderSide(color: Colors.black, width: 1),
            borderRadius: radius5, // Bordures carrées
          ),
          counterText: "",
          contentPadding: const EdgeInsets.only(bottom: 8, left: 3)),
      style: const TextStyle(
        fontSize: 25,
        fontWeight: FontWeight.w500,
      ),
    ),
  );
}
}

Also, I use this TextField like this :

ScoreInputField(
                                      isHome: false,
                                      onSubmit: (value) {
                                        if (_awayScoreController
                                                .text.isNotEmpty &&
                                            _homeScoreController
                                                .text.isNotEmpty) {
                                          _submitBet();
                                        }
                                      },
                                      onChanged: (value) {
                                        if (_awayScoreController
                                                .text.isNotEmpty &&
                                            _homeScoreController
                                                .text.isNotEmpty) {
                                          if (_awayScoreController
                                                  .text.length ==
                                              1) {
                                            _submitBet();
                                          }
                                        }
                                      },
                                      controller: _awayScoreController),

I have 2 TextField in a Row. My problem is that I want to autoselect TextField's content (1 number in my case) when clicking on it. But when first click, nothing happend, I need to click on the other TextField to make the autoselect work. The focus works well because I see the border change when clicking the first time.

Any help will be appreciate.

EDIT : After some test, it does not work on real iOS device only.