Save password prompt dismiss is pushing UI up and down #112281

rsp-84 · 2022-09-23T16:15:58Z

Steps to Reproduce

Launch a flutter application with a login form (email/pw).
Fill out the form, submit and navigate to another page.
On iOS (I observed this on iOS 15+), dismiss the prompt.
** On the machine I ran, it currently has flutter 2 however, when upgraded to flutter 3, the same behavior is present. And appears only to affect iOS.

Expected results: The prompt should dismiss from the widget leaving the underlying page unmodified.

Actual results: After being dismissed, the contents on the widget is being pushed up and down.

Code sample

Simplified widgets to show the issue:

import 'package:exampleapp/widgets/simple_page.dart';
import 'package:flutter/material.dart';

class AutoFillPwWork extends StatefulWidget {
  const AutoFillPwWork({Key? key}) : super(key: key);

  @override
  State<AutoFillPwWork> createState() => _AutoFillPwWorkState();
}

class _AutoFillPwWorkState extends State<AutoFillPwWork> {
  final TextEditingController email = TextEditingController();
  final TextEditingController password = TextEditingController();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: const Text('Save PW iOS'),
        ),
        body: ListView(
          children: <Widget>[
            const Text('Login'),
            AutofillGroup(
              child: Column(
                children: <Widget>[
                  TextField(
                    controller: email,
                    autofillHints: const <String>[AutofillHints.email],
                  ),
                  TextField(
                    controller: password,
                    autofillHints: const <String>[AutofillHints.password],
                  ),
                ],
              ),
            ),
            ElevatedButton(
              onPressed: () {
                Navigator.push(
                  context,
                  MaterialPageRoute(builder: (context) => const SimplePage()),
                );
              },
              child: const Text('Push SimplePage'),
            ),
          ],
        ));
  }
}

import 'package:flutter/material.dart';

class SimplePage extends StatelessWidget {
  const SimplePage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.red,
      appBar: AppBar(
        title: const Text('Simple Page'),
      ),
      body: Center(
        child: Container(
          color: Colors.blue,
          child: const Text('Simple Page'),
        ),
      ),
    );
  }
}

Flutter (Channel unknown, 2.10.1, on macOS 11.6.8 20G730 darwin-x64, locale en-US) • Flutter version 2.10.1 at /Users/user/Development/flutter • Upstream repository unknown • Framework revision db747aa (8 months ago), 2022-02-09 13:57:35 -0600 • Engine revision ab46186 • Dart version 2.16.1 • DevTools version 2.9.2

[✓] Android toolchain - develop for Android devices (Android SDK version 31.0.0)
• Android SDK at /Users/user/Library/Android/sdk
• Platform android-31, build-tools 31.0.0
• Java binary at: /Applications/Android Studio.app/Contents/jre/Contents/Home/bin/java
• Java version OpenJDK Runtime Environment (build 11.0.10+0-b96-7281165)
• All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 13.2.1)
• Xcode at /Applications/Xcode.app/Contents/Developer
• CocoaPods version 1.11.3

[✓] Chrome - develop for the web
• Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 2020.3)
• Android Studio at /Applications/Android Studio.app/Contents
• Flutter plugin can be installed from:
🔨 https://plugins.jetbrains.com/plugin/9212-flutter
• Dart plugin can be installed from:
🔨 https://plugins.jetbrains.com/plugin/6351-dart
• Java version OpenJDK Runtime Environment (build 11.0.10+0-b96-7281165)

[✓] VS Code (version 1.71.0)
• VS Code at /Applications/Visual Studio Code.app/Contents
• Flutter extension version 3.48.0

[✓] Connected device (2 available)
• iPhone (mobile) • ios • iOS 15.7 19H12
• Chrome (web) • chrome • web-javascript • Google Chrome 105.0.5195.125

[✓] HTTP Host Availability
• All required HTTP hosts are available

save_pw_issue.MP4

The text was updated successfully, but these errors were encountered:

darshankawar · 2022-09-26T07:53:43Z

Thanks for the report @rsp-84
I think there's an animation taking place when after entering password and you directly tap on push simplePage button, with virtual keyboard still open which might be impacting the UI as you described.

Can you try, after entering password, tap on done button from virtual keyboard and then tap on push simplePage and see if you still get same UI behavior on next page or not ?

rsp-84 · 2022-09-26T14:56:13Z

@darshankawar – When pressing done the issue still seems to persist.

In this simplified example, I have removed almost everything to display the issue with the base Flutter elements. When pressing done to simulate submitting a login form and then proceeding to the next page, the issue still occurs. This would probably be the most common user flow: fill out the login form, submit it, and proceed directly to the logged-in page.

Here is another video using the Done button. The only modification to the example would be to add an onSubmitted value to the password text field.

TextField(
                    controller: password,
                    autofillHints: const <String>[AutofillHints.password],
                    onSubmitted: (_) => Navigator.push(
                      context,
                      MaterialPageRoute(builder: (context) => const SimplePage()),
                    ),
                  ),
                  ```

rsp-84 · 2022-09-26T14:57:31Z

save_pw_issue_2.MP4

darshankawar · 2022-09-27T05:57:43Z

@rsp-84
I am unable to replicate it on iPhone 6s running on 15.3.1 using latest master version.

3. ** On the machine I ran, it currently has flutter 2 however, when upgraded to flutter 3, the same behavior is present. And appears only to affect iOS.

Can you provide updated flutter doctor -v along with device details and also try on latest master to see if same behavior is present ?

rsp-84 · 2022-09-29T18:47:01Z

@darshankawar –

[✓] Flutter (Channel unknown, 3.3.0, on macOS 11.6.8 20G730 darwin-x64, locale en-US)
    • Flutter version 3.3.0 at /Users/user/Development/flutter
    • Upstream repository unknown
    • Framework revision ffccd96b62 (4 weeks ago), 2022-08-29 17:28:57 -0700
    • Engine revision 5e9e0e0aa8
    • Dart version 2.18.0
    • DevTools version 2.15.0

[✓] Android toolchain - develop for Android devices (Android SDK version 31.0.0)
    • Android SDK at /Users/user/Library/Android/sdk
    • Platform android-31, build-tools 31.0.0
    • Java binary at: /Applications/Android Studio.app/Contents/jre/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 11.0.10+0-b96-7281165)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 13.2.1)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Build 13C100
    • CocoaPods version 1.11.3

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 2020.3)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build 11.0.10+0-b96-7281165)

[✓] VS Code (version 1.71.0)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.48.0

[✓] Connected device (3 available)
    • iPhone (mobile)  • ios            • iOS 15.7 19H12
    • macOS (desktop)        • macos                     • darwin-x64     • macOS 11.6.8 20G730 darwin-x64
    • Chrome (web)           • chrome                    • web-javascript • Google Chrome 105.0.5195.125

[✓] HTTP Host Availability
    • All required HTTP hosts are available

• No issues found!

Device: It is an iPhone X on iOS 15.7

darshankawar · 2022-09-30T06:04:41Z

Thanks for the update @rsp-84. For some reason, I am unable to see the save password option on next screen as shown below even though I have autofill passwords and icloud keychain settings enabled.

RPReplay-Final1664517627.MP4

One of my colleagues is also seeing same behavior on different iOS device:

RPReplay_Final1664516765.MP4

I am going ahead and keeping this issue open based on the report.

darshankawar · 2022-09-30T06:04:48Z

/cc @LongCatIsLooong

rsp-84 · 2022-09-30T15:06:14Z

@darshankawar I believe in order for it to work on iOS and receive the prompt, you need to have an Assoicated Domains set in your Xcode project.

darshankawar · 2022-10-03T07:25:59Z

Thanks for the tip @rsp-84. Yes, that was missing from my project. Adding it and then running the code sample, on latest stable and master, with which I am now able to replicate the behavior.

RPReplay-Final1664781279.MP4

stable, master flutter doctor -v


[✓] Flutter (Channel stable, 3.3.3, on macOS 12.2.1 21D62 darwin-x64, locale
    en-GB)
    • Flutter version 3.3.3 on channel stable at
      /Users/dhs/documents/fluttersdk/flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 18a827f393 (2 days ago), 2022-09-28 10:03:14 -0700
    • Engine revision 5c984c26eb
    • Dart version 2.18.2
    • DevTools version 2.15.0

[!] Xcode - develop for iOS and macOS (Xcode 12.3)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    ! Flutter recommends a minimum Xcode version of 13.
      Download the latest version or update via the Mac App Store.
    • CocoaPods version 1.11.2

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] VS Code (version 1.62.0)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.21.0

[✓] Connected device (5 available)
    • SM G975F (mobile)       • RZ8M802WY0X • android-arm64   • Android 11 (API 30)
    • Darshan's iphone (mobile)  • 21150b119064aecc249dfcfe05e259197461ce23 •
      ios            • iOS 14.4.1 18D61
    • iPhone 12 Pro Max (mobile) • A5473606-0213-4FD8-BA16-553433949729     •
      ios            • com.apple.CoreSimulator.SimRuntime.iOS-14-3 (simulator)
    • macOS (desktop)            • macos                                    •
      darwin-x64     • Mac OS X 10.15.4 19E2269 darwin-x64
    • Chrome (web)               • chrome                                   •
      web-javascript • Google Chrome 98.0.4758.80

[✓] HTTP Host Availability
    • All required HTTP hosts are available

! Doctor found issues in 1 category.

[✓] Flutter (Channel master, 3.4.0-36.0.pre.3, on macOS 12.2.1 21D62 darwin-x64,
    locale en-GB)
    • Flutter version 3.4.0-36.0.pre.3 on channel master at
      /Users/dhs/documents/fluttersdk/flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 5cd15fd224 (4 hours ago), 2022-10-02 21:21:39 -0400
    • Engine revision a7785c48cd
    • Dart version 2.19.0 (build 2.19.0-265.0.dev)
    • DevTools version 2.17.0
    
[!] Xcode - develop for iOS and macOS (Xcode 12.3)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    ! Flutter recommends a minimum Xcode version of 13.
      Download the latest version or update via the Mac App Store.
    • CocoaPods version 1.11.2

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] VS Code (version 1.62.0)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.21.0

[✓] Connected device (5 available)
    • SM G975F (mobile)       • RZ8M802WY0X • android-arm64   • Android 11 (API 30)
    • Darshan's iphone (mobile)  • 21150b119064aecc249dfcfe05e259197461ce23 •
      ios            • iOS 14.4.1 18D61
    • iPhone 12 Pro Max (mobile) • A5473606-0213-4FD8-BA16-553433949729     •
      ios            • com.apple.CoreSimulator.SimRuntime.iOS-14-3 (simulator)
    • macOS (desktop)            • macos                                    •
      darwin-x64     • Mac OS X 10.15.4 19E2269 darwin-x64
    • Chrome (web)               • chrome                                   •
      web-javascript • Google Chrome 98.0.4758.80

[✓] HTTP Host Availability
    • All required HTTP hosts are available

! Doctor found issues in 1 category.

arashgm · 2022-11-23T13:29:37Z

we are facing the same issue too , its happening when resizeToAvoidBottomInset for scaffold is set to true

daniloapr · 2023-05-30T21:27:59Z

I'm also facing this with Flutter 3.10.1 and iOS 16.4.1 in all situations where AutofillGroup is used, making the app look really buggy.

TahaTesser · 2024-01-26T13:45:30Z

resizeToAvoidBottomInset seems to be the cause of this issue. When the Scaffold or CupertinoPageScaffold is allowed to resize to avoid bottom inset, iOS popup produces a 300 pixels of bottom padding after being dismissed,

flutter: MediaQuery.of(context).viewInsets.bottom: 300.921851335732
flutter: MediaQuery.of(context).viewInsets.bottom: 0.0

TahaTesser · 2024-01-31T08:48:27Z

This regressed in flutter/engine#29281. I'm working on a fix.

@OverRide

…50364) fixes [Save password prompt dismiss is pushing UI up and down](flutter/flutter#112281) ### Code sample <details> <summary>expand to view the code sample</summary> ```dart import 'package:flutter/material.dart'; void main() => runApp(const MyApp()); class MyApp extends StatelessWidget { const MyApp({super.key}); @OverRide Widget build(BuildContext context) { return const MaterialApp( debugShowCheckedModeBanner: false, home: HomePage(), ); } } class HomePage extends StatefulWidget { const HomePage({super.key}); @OverRide State<HomePage> createState() => _HomePageState(); } class _HomePageState extends State<HomePage> { final TextEditingController controller1 = TextEditingController(); final TextEditingController controller2 = TextEditingController(); @OverRide void dispose() { controller1.dispose(); controller2.dispose(); super.dispose(); } @OverRide Widget build(BuildContext context) { return Scaffold( // Replace Scaffold with Material to fix glitch. body: Center( child: Column( mainAxisSize: MainAxisSize.min, children: <Widget>[ const Text('Login (Without Scaffold)'), AutofillGroup( child: Column( children: <Widget>[ TextField( controller: controller1, autofillHints: const <String>[AutofillHints.username], ), TextField( controller: controller2, autofillHints: const <String>[AutofillHints.password], ), ], ), ), ], ), ), ); } } ``` </details> ### Before https://github.com/flutter/engine/assets/48603081/dfe36616-e1dd-4c6c-95b0-e4bd89bd3a6a ### After https://github.com/flutter/engine/assets/48603081/cfb15252-10cd-4521-a1ef-2cace0004588 [C++, Objective-C, Java style guides]: https://github.com/flutter/engine/blob/main/CONTRIBUTING.md#style

TahaTesser · 2024-02-19T09:37:12Z

Unfortunately, the fix for this issue is reverted in flutter/engine#50760 as it is causing a regression for keyboard created by a third-party package.

I might work on a new fix which would address third-party package keyboards in the future.

If anyone wants to takeover and fix this in the meantime, please feel free.

Xoka74 · 2024-04-16T13:33:57Z

@TahaTesser Hello! Could you please provide more explanation about issues with third-parties? I think now if anyone wants to fix this, they can't be sure that it won't break something again.

Den-creator · 2025-01-27T13:55:41Z

@cka29 workaround

import 'package:flutter/material.dart';
import 'package:flutter_keyboard_visibility/flutter_keyboard_visibility.dart';

class ScaffoldWithKeyboardVisibilityBuilder extends StatelessWidget {
  const ScaffoldWithKeyboardVisibilityBuilder({
    super.key,
    required this.body,
    this.appBar,
    this.backgroundColor,
  });
  final Widget body;
  final PreferredSizeWidget? appBar;
  final Color? backgroundColor;

  @override
  Widget build(BuildContext context) {
    return KeyboardVisibilityBuilder(builder: (context, isKeyboardVisible) {
      return Scaffold(
        // Fi for UI glitch issue - https://github.com/flutter/flutter/issues/112281
        resizeToAvoidBottomInset: isKeyboardVisible,
        appBar: appBar,
        body: body,
        backgroundColor: backgroundColor,
      );
    });
  }
}

darshankawar added the in triage Presently being triaged by the triage team label Sep 26, 2022

darshankawar added the waiting for customer response The Flutter team cannot make further progress on this issue until the original reporter responds label Sep 26, 2022

github-actions bot removed the waiting for customer response The Flutter team cannot make further progress on this issue until the original reporter responds label Sep 26, 2022

darshankawar added the waiting for customer response The Flutter team cannot make further progress on this issue until the original reporter responds label Sep 27, 2022

github-actions bot removed the waiting for customer response The Flutter team cannot make further progress on this issue until the original reporter responds label Sep 29, 2022

darshankawar added has reproducible steps The issue has been confirmed reproducible and is ready to work on found in release: 3.3 Found to occur in 3.3 found in release: 3.4 Found to occur in 3.4 labels Oct 3, 2022

huycozy mentioned this issue Jan 5, 2023

AutofillGroup not working as expected #118030

Closed

darshankawar mentioned this issue Feb 17, 2023

[iOS ]When external keyboard on iPad resizeToAvoidBottomInset resizes scaffold by keyboard/dictionary popup #120873

Open

This comment was marked as off-topic.

Sign in to view

dam-ease mentioned this issue May 26, 2023

Autofill feature causing weird UI resizing effects on iOS #127618

Closed

2 tasks

This comment was marked as duplicate.

Sign in to view

TahaTesser self-assigned this Jan 26, 2024

TahaTesser added this to Nevercode Jan 26, 2024

github-project-automation bot moved this to To do in Nevercode Jan 26, 2024

TahaTesser changed the title ~~iOS 15+ save password prompt dismiss is pushing UI up and down~~ Save password prompt dismiss is pushing UI up and down Jan 29, 2024

TahaTesser added the engine flutter/engine repository. See also e: labels. label Jan 31, 2024

TahaTesser moved this from To do to In progress in Nevercode Jan 31, 2024

TahaTesser added the c: regression It was better in the past than it is now label Jan 31, 2024

justinmc added the P2 Important issues not at the top of the work list label Feb 1, 2024

TahaTesser mentioned this issue Feb 5, 2024

Fix iOS password autofill prompt dismissal causes layout to resize flutter/engine#50364

Merged

8 tasks

TahaTesser moved this from In progress to PR submitted in Nevercode Feb 5, 2024

auto-submit bot closed this as completed in flutter/engine#50364 Feb 5, 2024

github-project-automation bot moved this from PR submitted to Done (PR merged) in Nevercode Feb 5, 2024

TahaTesser added the r: fixed Issue is closed as already fixed in a newer version label Feb 5, 2024

TahaTesser reopened this Feb 19, 2024

github-project-automation bot moved this from Done (PR merged) to In progress in Nevercode Feb 19, 2024

TahaTesser removed the r: fixed Issue is closed as already fixed in a newer version label Feb 19, 2024

TahaTesser removed their assignment Feb 19, 2024

TahaTesser removed this from Nevercode Feb 19, 2024

huycozy mentioned this issue Aug 23, 2024

[Autofill] Empty Action Sheet displaying after declining to save password #153930

Closed

This comment has been minimized.

Sign in to view

koji-1009 mentioned this issue Mar 9, 2025

[Engine][iOS] Cancel animation when recieved UIKeyboardWillHideNotification with duration 0.0 #164884

Merged

9 tasks

auto-submit bot closed this as completed in #164884 Mar 31, 2025

darshankawar added the r: fixed Issue is closed as already fixed in a newer version label Apr 1, 2025

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Save password prompt dismiss is pushing UI up and down #112281

Save password prompt dismiss is pushing UI up and down #112281

rsp-84 commented Sep 23, 2022

darshankawar commented Sep 26, 2022

rsp-84 commented Sep 26, 2022 •

edited

Loading

rsp-84 commented Sep 26, 2022 •

edited

Loading

darshankawar commented Sep 27, 2022

rsp-84 commented Sep 29, 2022

darshankawar commented Sep 30, 2022

darshankawar commented Sep 30, 2022

rsp-84 commented Sep 30, 2022

darshankawar commented Oct 3, 2022

arashgm commented Nov 23, 2022 •

edited

Loading

This comment was marked as off-topic.

This comment was marked as duplicate.

daniloapr commented May 30, 2023

TahaTesser commented Jan 26, 2024

TahaTesser commented Jan 31, 2024

TahaTesser commented Feb 19, 2024 •

edited

Loading

Xoka74 commented Apr 16, 2024 •

edited

Loading

This comment has been minimized.

Den-creator commented Jan 27, 2025 •

edited

Loading

Save password prompt dismiss is pushing UI up and down #112281

Save password prompt dismiss is pushing UI up and down #112281

Comments

rsp-84 commented Sep 23, 2022

Steps to Reproduce

darshankawar commented Sep 26, 2022

rsp-84 commented Sep 26, 2022 • edited Loading

rsp-84 commented Sep 26, 2022 • edited Loading

darshankawar commented Sep 27, 2022

rsp-84 commented Sep 29, 2022

darshankawar commented Sep 30, 2022

darshankawar commented Sep 30, 2022

rsp-84 commented Sep 30, 2022

darshankawar commented Oct 3, 2022

arashgm commented Nov 23, 2022 • edited Loading

This comment was marked as off-topic.

This comment was marked as duplicate.

daniloapr commented May 30, 2023

TahaTesser commented Jan 26, 2024

TahaTesser commented Jan 31, 2024

TahaTesser commented Feb 19, 2024 • edited Loading

Xoka74 commented Apr 16, 2024 • edited Loading

This comment has been minimized.

Den-creator commented Jan 27, 2025 • edited Loading

rsp-84 commented Sep 26, 2022 •

edited

Loading

rsp-84 commented Sep 26, 2022 •

edited

Loading

arashgm commented Nov 23, 2022 •

edited

Loading

TahaTesser commented Feb 19, 2024 •

edited

Loading

Xoka74 commented Apr 16, 2024 •

edited

Loading

Den-creator commented Jan 27, 2025 •

edited

Loading