PM-10278 PM-10279 PM-10806 - Setup autofill screen for new onboarding flow #979

phil-livefront · 2024-09-26T22:00:55Z

🎟️ Tracking

PM-10278 - Draw Turn on Autofill Setup Screen
PM-10279 - Implement Turn on Autofill Later Confirmation Dialog
PM-10806 - Implement Autofill Help Link

📔 Objective

Setup the new PasswordAutoFillView so it can be used in the new onboarding flow and also from within the Settings menu. Also kept the legacy version around and is configured based on the feature flag native-create-account-flow
Added a gifView using a web view to render the gif. This allows for first party support and seemed simple enough for the one-off gif. If you think we should intro a 3rd party for this, I am happy to update but this felt better imo.
When navigating through the settings mode, kept the deep link to passwords but got rid of the turn on later button
Added some parameters to the fixedSized helper function to help with testing
Fixed a linter warning for line length on CompleteRegistrationProcessor
Used the link out navigation that is used elsewhere in the app. The Figma docs tho show an in-app web view so I kept the behavior as is since that could be a bigger change.

📸 Screenshots

Simulating a email verification link click via Reminders app

Simulator.Screen.Recording.-.iPhone.15.Pro.-.2024-09-26.at.17.54.16.mp4

⏰ Reminders before review

Contributor guidelines followed
All formatters and local linters executed and passed
Written new unit and / or integration tests where applicable
Protected functional changes with optionality (feature flags)
Used internationalization (i18n) for all UI strings
CI builds passed
Communicated to DevOps any deployment requirements
Updated any necessary documentation (Confluence, contributing docs) or informed the documentation team

🦮 Reviewer guidelines

👍 (:+1:) or similar for great changes
📝 (:memo:) or ℹ️ (:information_source:) for notes or general info
❓ (:question:) for questions
🤔 (:thinking:) or 💭 (:thought_balloon:) for more open inquiry that's not quite a confirmed issue and could potentially benefit from discussion
🎨 (:art:) for suggestions / improvements
❌ (:x:) or ⚠️ (:warning:) for more significant problems or concerns needing attention
🌱 (:seedling:) or ♻️ (:recycle:) for future improvements or indications of technical debt
⛏ (:pick:) for minor or nitpick changes

github-actions · 2024-09-26T22:16:48Z

Checkmarx One – Scan Summary & Details – a909f9e4-f71d-4915-8786-981f8b2fe958

No New Or Fixed Issues Found

codecov · 2024-09-27T00:58:53Z

Codecov Report

Attention: Patch coverage is 95.81590% with 10 lines in your changes missing coverage. Please review.

Project coverage is 88.97%. Comparing base (d94c5a3) to head (2aa2947).
Report is 2 commits behind head on main.

Files with missing lines	Patch %	Lines
...toFill/PasswordAutoFill/PasswordAutoFillView.swift	91.93%	10 Missing ⚠️

Additional details and impacted files

@@            Coverage Diff             @@
##             main     #979      +/-   ##
==========================================
+ Coverage   88.91%   88.97%   +0.05%     
==========================================
  Files         647      650       +3     
  Lines       40559    40805     +246     
==========================================
+ Hits        36064    36306     +242     
- Misses       4495     4499       +4

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

phil-livefront · 2024-09-27T02:46:29Z

...pshots__/PasswordAutoFillViewTests/test_view_rendersWithFeatureFlag_withOnboardingMode.1.png

I added a placeholder image to display while the GIF loads. This ensures there is always something visible, which is especially helpful for snapshots since the GIF wasn't loading quickly enough before the snapshot was taken. The placeholder is the first frame of the GIF. Happy to remove but this felt like a good call.

Nice! I like having a placeholder, please confirm with Product to see if that image is ok or if they'd prefer another one.

fedemkr · 2024-09-27T16:24:43Z

BitwardenShared/UI/Platform/Application/Support/Localizations/en.lproj/Localizable.strings

+"FromYourDeviceSettingsToggleOnAutoFillPasswordsAndPasskeys" = "From your device settings, **toggle on autofill Passwords and Passkeys.**";
+"ToggleOffICloudToMakeBitwardenYourDefaultAutoFillSource" = "**Toggle off iCloud Keychain** to make Bitwarden your default autofill source.";
+"ToggleOnBitwardenToUseYourSavedPasswordsToLogIntoYourAccounts" = "**Toggle on Bitwarden** to use your saved passwords to log into your accounts.";
+"TurnOnAutoFill"= "Turn on autofill";
+"UseAutoFillToLogIntoYourAccountsWithASingleTap" = "Use autofill to log into your accounts with a single tap.";
+"NeedHelpCheckOutAutofillHelp" = "Need help? Check out **[autofill help](%1$@)**";
+"TurnOnLater" = "Turn on later";
+"TurnOnAutoFillLaterQuestion" = "Turn on autofill later?";
+"YouCanReturnToCompleteThisStepAnytimeInSettings" = "You can return to complete this step anytime in Settings.";


🤔 Could you confirm with product on the use of autofill string instead of auto-fill? I see there are a lot of resources using auto-fill so wanted to check if this changed.

Good call out. I just confirmed with the livefront designer that "autofill" is correct but lmk if this is something we should escalate up to the BW team?

fedemkr · 2024-09-27T16:34:06Z

...denShared/UI/Platform/Settings/Settings/AutoFill/PasswordAutoFill/PasswordAutoFillView.swift

+            ZStack {
+                gifViewPlaceholder
+                    .frame(width: 230, height: 278)
+                    .background(.red)
+                    .padding(.top, 32)
+
+                gifView
+                    .frame(width: 230, height: 280)
+                    .padding(.top, 32)
+            }


🤔 Does the gif gets displayed correctly on a really small device like iPhone 6s or iPhone SE? What about landscape mode?

yeah it does! I am going to do some work here on this ticket to have it match the figma designs so I can make sure everything is good on that PR if thats cool with you?

fedemkr · 2024-09-27T16:36:16Z

...pshots__/PasswordAutoFillViewTests/test_view_rendersWithFeatureFlag_withOnboardingMode.1.png

Nice! I like having a placeholder, please confirm with Product to see if that image is ok or if they'd prefer another one.

fedemkr · 2024-09-27T16:39:21Z

...denShared/UI/Platform/Settings/Settings/AutoFill/PasswordAutoFill/PasswordAutoFillView.swift

+            .padding(.top, 32)
+
+            Button(Localizations.continue) {
+                openURL(ExternalLinksConstants.passwordOptions)


ℹ️ On iOS 17+ there's a more direct way to go there if I'm understanding correctly where this should be headed with the ASSettingsHelper

...ared/UI/Platform/Settings/Settings/AutoFill/PasswordAutoFill/PasswordAutoFillProcessor.swift

...UI/Platform/Settings/Settings/AutoFill/PasswordAutoFill/PasswordAutoFillProcessorTests.swift

...denShared/UI/Platform/Settings/Settings/AutoFill/PasswordAutoFill/PasswordAutoFillView.swift

...ared/UI/Platform/Settings/Settings/AutoFill/PasswordAutoFill/PasswordAutoFillViewTests.swift

...cation/Support/Images.xcassets/Images/temp_auto_fill_image.imageset/temp_auto_fill_image.pdf

BitwardenShared/UI/Auth/Extensions/Alert+Auth.swift

…o the app after turning on autofill

BitwardenShared/Core/Auth/Services/AuthServiceTests.swift

matt-livefront

👍

phil-livefront added 3 commits September 26, 2024 17:41

PM-10278 PM-10279 PM-10806 - Password Autofill View for onboarding flow

600fb91

Merge branch 'main' into phil/PM-10278-PM-10279-PM-10806-autofill-view

96f8a77

fix compiler error after changing variable name and added miss comment

4e50dcf

phil-livefront requested review from fedemkr and KatherineInCode September 26, 2024 22:00

phil-livefront requested review from matt-livefront, victor-livefront, brant-livefront and a team as code owners September 26, 2024 22:00

fix tests

01d4a4d

fix horizontal padding of subtitle

ffdc336

phil-livefront commented Sep 27, 2024

View reviewed changes

phil-livefront added 2 commits September 26, 2024 22:55

add unit tests in AuthCoordinatorTests and AuthRouterTests

50ac0c3

attempting to fix tests on CI

ee6ee70

fedemkr reviewed Sep 27, 2024

View reviewed changes

matt-livefront reviewed Sep 27, 2024

View reviewed changes

phil-livefront added 5 commits September 30, 2024 16:00

Fix issue with auto fill screen not dismissing when navigating back t…

107190d

…o the app after turning on autofill

Merge branch 'main' into phil/PM-10278-PM-10279-PM-10806-autofill-view

9485a93

using ASSettingsHelper for iOS 17+

cd462b8

Merge branch 'main' into phil/PM-10278-PM-10279-PM-10806-autofill-view

837d17e

fix tests

b9516c1

phil-livefront commented Sep 30, 2024

View reviewed changes

BitwardenShared/Core/Auth/Services/AuthServiceTests.swift Outdated Show resolved Hide resolved

phil-livefront added 6 commits September 30, 2024 17:39

Merge branch 'main' into phil/PM-10278-PM-10279-PM-10806-autofill-view

a4f1091

fix testing issue that was causing an infinite loop

5621900

Merge branch 'main' into phil/PM-10278-PM-10279-PM-10806-autofill-view

b819541

Merge branch 'main' into phil/PM-10278-PM-10279-PM-10806-autofill-view

a9f687a

Merge branch 'main' into phil/PM-10278-PM-10279-PM-10806-autofill-view

9ddb5a8

Merge branch 'main' into phil/PM-10278-PM-10279-PM-10806-autofill-view

2aa2947

matt-livefront approved these changes Oct 1, 2024

View reviewed changes

phil-livefront merged commit 59c7e1a into main Oct 1, 2024
9 checks passed

phil-livefront deleted the phil/PM-10278-PM-10279-PM-10806-autofill-view branch October 1, 2024 17:19

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

PM-10278 PM-10279 PM-10806 - Setup autofill screen for new onboarding flow #979

PM-10278 PM-10279 PM-10806 - Setup autofill screen for new onboarding flow #979

phil-livefront commented Sep 26, 2024 •

edited

Loading

github-actions bot commented Sep 26, 2024 •

edited

Loading

codecov bot commented Sep 27, 2024 •

edited

Loading

phil-livefront Sep 27, 2024 •

edited

Loading

fedemkr Sep 27, 2024

fedemkr Sep 27, 2024

phil-livefront Sep 30, 2024

fedemkr Sep 27, 2024

phil-livefront Sep 30, 2024

fedemkr Sep 27, 2024

fedemkr Sep 27, 2024

matt-livefront left a comment

PM-10278 PM-10279 PM-10806 - Setup autofill screen for new onboarding flow #979

PM-10278 PM-10279 PM-10806 - Setup autofill screen for new onboarding flow #979

Conversation

phil-livefront commented Sep 26, 2024 • edited Loading

🎟️ Tracking

📔 Objective

📸 Screenshots

Simulating a email verification link click via Reminders app

⏰ Reminders before review

🦮 Reviewer guidelines

github-actions bot commented Sep 26, 2024 • edited Loading

No New Or Fixed Issues Found

codecov bot commented Sep 27, 2024 • edited Loading

Codecov Report

phil-livefront Sep 27, 2024 • edited Loading

Choose a reason for hiding this comment

fedemkr Sep 27, 2024

Choose a reason for hiding this comment

fedemkr Sep 27, 2024

Choose a reason for hiding this comment

phil-livefront Sep 30, 2024

Choose a reason for hiding this comment

fedemkr Sep 27, 2024

Choose a reason for hiding this comment

phil-livefront Sep 30, 2024

Choose a reason for hiding this comment

fedemkr Sep 27, 2024

Choose a reason for hiding this comment

fedemkr Sep 27, 2024

Choose a reason for hiding this comment

matt-livefront left a comment

Choose a reason for hiding this comment

phil-livefront commented Sep 26, 2024 •

edited

Loading

github-actions bot commented Sep 26, 2024 •

edited

Loading

codecov bot commented Sep 27, 2024 •

edited

Loading

phil-livefront Sep 27, 2024 •

edited

Loading