[USERSNAP] I can't register to become a DRep. It won't allow me to continue to the next page after I filled out the form.

[bosko-m]

Taken at: https://gov.tools/register_drep
Fields:

• Noticed an issue?: I can't register to become a DRep. It won't allow me to continue to the next page after I filled out the form.

Download original image

Browser: Chrome 135 (macOS Catalina)
Screen size: 1512x982
Browser size: 1496x772
Open #56 in Usersnap

Powered by Usersnap.

[kneerose]

The issue occurs when an invalid image URL is entered in the image field. An error message appears after pasting the link and focusing elsewhere. When the URL is cleared and focus, the error message disappears, but the "Continue" button remains disabled if any text is entered in the image field. The button is only enabled when a valid image URL is pasted or the field is empty.

Suggested Fixes:

1. Display the error message quickly after a short debounce period when an invalid URL is pasted or entered.
2. Since the image field is not required, enable the "Continue" button when the image URL is valid or the field is empty.

Steps to Reproduce:

1. Connect to the wallet.
2. Navigate to the dRep registration form.
3. Enter the dRep name (the "Continue" button is enabled at this point).
4. Enter text in the image URL field and focus elsewhere. An "Invalid image URL" message appears, and the "Continue" button is disabled.
5. Clear the image URL and focus elsewhere. Observe that the "Continue" button remains disabled.

https://www.loom.com/share/54af0257a6d24c2eb4197e41b044f740?sid=a74134b5-7461-463c-97f4-a48607a5573e

Missing testIds for image input

Also, please update the testId for the error message to invalid-image-url-error instead of the undefined-error

CC: @bosko-m

[kneerose]

Allure Report

• 3E_2. Should reject invalid data in DRep form
• 3M_2. Should reject invalid data in edit dRep form