Feat: enhance recaptcha user experience
What does this MR do and why?
- Related to #4538
- Auto trigger the captcha for user when visiting
/users/sign_up
page. - Trigger the captcha for the other tab automatically when user tries to use other registration type.
To enable auto filling reCaptcha, we need to change settings at the vendor website for enabling "interact-less reCaptcha"
Feat: enhance recaptcha user experience
- Trigger user captcha verification when loaded.
- Trigger user captcha verfication when changing tab.
MR acceptance checklist
Please evaluate this MR against the MR acceptance checklist. It helps you analyze changes to reduce risks in quality, performance, reliability, security, and maintainability.
Screenshots or screen recordings
Screenshots are required for UI changes, and strongly recommended for all other merge requests.
Default
CleanShot_2024-10-12_at_09.50.32
When registration link is opened with specific registration type
CleanShot_2024-10-12_at_09.55.09
When registration with cellphone number has been disabled
CleanShot_2024-10-12_at_09.56.45
How to set up and validate locally
- Setup shell events
export TC_ID=<TC_ID>
export TC_KEY=<TC_KEY>
export TC_CAPTCHA_ID=<TC_CAPTCHA_ID>
export TC_CAPTCHA_KEY=<TC_CAPTCHA_KEY>
export TC_CAPTCHA_APP_ID=<TC_CAPTCHA_APP_ID>
export TC_CAPTCHA_APP_SECRET_KEY=<GC_CAPTCHA_APP_SECRET>
Boot your GDK
- After GDK successfully booted, in the terminal
$ rails c
After the rails console booted up, type the following
settings = ::Gitlab::CurrentSettings.current_application_settings
settings.phone_verification_code_enabled = true
settings.save!
# enable tencent_captcha feature flag
::Feature.enabled?(:tencent_captcha)
- login as
admin
go to /admin
find Reporting tab as screenshot shows below, then check the Enable reCaptcha checkbox, fill in the secret and app id with any value, then click Save.
Logout or start a new session to sign up page.
Numbered steps to set up and validate the change are strongly suggested.