Skip to content

Fix 2FA management on Safari

What does this MR do and why?

Related to #342792 (closed)

Fixes a bug in Safari that prevents users from disabling 2FA or regenerating recovery codes. This bug is due to the fact that event.submitter is not supported in Safari. This MR refactors how we submit the form to fix this issue.

As side effects of this fix and to improve the UX this MR also makes the following changes

  1. Switches from using window.confirm to GlModal when disabling 2FA
  2. Switches from using HTML5 validation to GitLab UI validation
  3. Improves the mobile layout

Screenshots or screen recordings

Safari (bug fixed)

Before After
Untitled__1_ Screen_Recording_2021-10-28_at_2.00.04_PM

Chrome (to show GitLab UI changes)

Before After
Untitled__2_ Untitled

Mobile

Before After
Screen_Shot_2021-10-28_at_3.22.35_PM Screen_Shot_2021-10-28_at_3.19.44_PM

How to set up and validate locally

  1. Navigate to /-/profile/two_factor_auth and setup 2FA using 1Password or some other 2FA device
  2. Click Manage two-factor authentication
  3. Enter your password and click Regenerate recovery codes. Follow the steps
  4. Click Disable two-factor authentication and confirm in the modal.

MR acceptance checklist

This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.

Edited by Peter Hegman

Merge request reports