:valid Psuedo-selector Doesn't Work For Autofilled Password Inputs
Reported by
j.tim.no...@gmail.com,
Sep 6 2017
|
||||
Issue descriptionUserAgent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/60.0.3112.113 Safari/537.36 Steps to reproduce the problem: 1. Visit a site with a input type="password" that is using the :valid psuedo-selector and validating the password field with e.g. minlength or pattern 2. Save your data so that it will be autofilled upon coming back 3. Return to page, password field is autofilled but form is not :valid until page is interacted with What is the expected behavior? Both form and input should activate :valid pseudo-selector if the autofilled input is valid What went wrong? The password field does not register as :valid until the page is interacted with. This also causes the form not to be :valid, affecting UI elements that rely on it (such as a submit button being greyed out unless the form is :valid) Did this work before? Yes Not sure - I believe it was several years ago Does this work in other browsers? Yes Chrome version: 60.0.3112.113 Channel: stable OS Version: 10.0 Flash Version: I am aware that a version of this issue has been raised (perhaps several times) in relation to being able to get the value of the password field before interaction, such as in #669724. In the past this has been closed for being an intended security feature. However, I believe that, while this bug likely has the same root cause as that issue, it is both unrelated to security and not working as intended.
,
Sep 6 2017
You were probably unable to save your credentials because chrome won't let you unless you're connected to an https site. As for amazon/facebook, I do not think they are using the :valid pseudo-selector (though I admittedly did not spend that much time looking) I've hosted a slightly modified version of the example here for you to try: https://dev.jtimnolan.com/chromebug/ Steps to reproduce are similar: 1. Fill out form with an example username and password 2. Submit form and save credentials when prompted by chrome 3. Navigate back to the /chromebug page but DO NOT interact with it (refreshing the page does not seem to trigger the bug, you must go to the omnibar and type in the url and hit enter/go) You will see the text "Form is not valid" despite "not" having class .hide-valid, which is simply: form:valid .hide-valid { display: none; } Once you interact with the page, it will update to display correctly that the form is valid. Please let me know if you are still unable to reproduce, and I will provide a video. In the meantime, here is a screenshot. Thank you for your patience
,
Sep 6 2017
Thank you for providing more feedback. Adding requester "sc00335628@techmahindra.com" to the cc list and removing "Needs-Feedback" label. For more details visit https://www.chromium.org/issue-tracking/autotriage - Your friendly Sheriffbot
,
Sep 6 2017
,
Sep 7 2017
Tested on latest Chrome Stable #61.0.3163.79, Canary # 63.0.3207.0 and Chrome #50.0.2624.0 on Windows 10, Mac 10.12.6 and Ubuntu 14.04 and able to reproduce the issue. This is a non-regression issue and able to reproduce from M-50 #50.0.2624.0. Marking it as untriaged so that issue gets addressed. Observations: 1. Upon navigating to the provided link ‘https://dev.jtimnolan.com/chromebug/’, “Form is not valid” message is displayed. 2. After entering valid data across the fields, “Form is valid” message is displayed. 3. After clicking on “Submit” button and then coming back to the link ‘https://dev.jtimnolan.com/chromebug/’, “Form is not valid” message is displayed. 4. Now, if the user clicks on the “Submit” button or on any part of the screen, user notices that message is changed to “Form is valid”. Thanks.
,
Sep 7 2017
,
Sep 7 2017
|
||||
►
Sign in to add a comment |
||||
Comment 1 by sc00335...@techmahindra.com
, Sep 6 2017Components: -Blink>CSS UI>Browser>Autofill
Labels: -Type-Bug-Regression Triaged-ET Needs-Triage-M60 Needs-Feedback Type-Bug