Show "keep me logged in" checkbox for users on login page without Javascript
Closed, ResolvedPublic1 Story Points

Description

From: https://en.wikipedia.org/wiki/Wikipedia:Village_pump_(technical)#Mobile_site_broke_on_Windows_Phone

When a user has JavaScript enabled on a mobile device with a display less than 721px wide, we automatically mark them as "keep me logged in" and don't give them the option to untick the box.

Although this is convenient for those users with JavaScript, users without JavaScript get an annoying experience (see T196893)

Acceptance criteria

  • If JS is disabled I see the remember me checkbox and I can select or unselect it
  • If JS is enabled I do not see the remember me checkbox and it is ticked by default.

Note: Logging out will forgot users across all devices so provided a user remembers to logout there should be no need to check this checkbox.

Design

  • 10px padding/margin between the checkbox and password field
  • 23px padding/margin between the checkbox and the login button

QA step

Goal 1: Check no change in behaviour for modern devices

Goal 2: Check new behaviour in old devices
We should test in as many versions of Opera Mini as possible (can we test version4?) as well as other grade C browsers such as Windows Phones, Android 2.

Restricted Application added a subscriber: Aklapper. · View Herald TranscriptJun 11 2018, 8:27 PM
Jdlrobson added a subscriber: ovasileva.

I believe Windows Phone 8 has the user agent "Mozilla/5.0 (compatible; MSIE 10.0; Windows Phone 8.0; Trident/6.0; IEMobile/10.0; ARM; Touch; NOKIA; Lumia 520)" which makes it a grade B/C browser. Traffic is too low on this browser to upgrade it to a grade A browser.

Because JavaScript does not run, there's no way for us to automatically mark the user to have their login remembered. It's trivial for us to restore the checkbox for non-logged in users like so:

@ovasileva sound good?

I believe Windows Phone 8 has the user agent "Mozilla/5.0 (compatible; MSIE 10.0; Windows Phone 8.0; Trident/6.0; IEMobile/10.0; ARM; Touch; NOKIA; Lumia 520)" which makes it a grade B/C browser. Traffic is too low on this browser to upgrade it to a grade A browser.

Because JavaScript does not run, there's no way for us to automatically mark the user to have their login remembered. It's trivial for us to restore the checkbox for non-logged in users like so:

@ovasileva sound good?

Sounds good to me.

ovasileva triaged this task as Normal priority.Jun 12 2018, 3:46 PM

@Jdlrobson

  • 10px padding/margin between the checkbox and password field
  • 23px padding/margin between the checkbox and the login button

Jdlrobson updated the task description. (Show Details)Jun 15 2018, 8:02 PM
Jdlrobson set the point value for this task to 1.Jun 19 2018, 4:18 PM
Jdlrobson added a subscriber: Volker_E.

As always with a 1 pointer I've found a snag.
@Volker_E looks like mediawiki.ui.checkbox does not style non-JavaScript clients.

Looking at CSS inside core this code was introduced in I0b9691daa61fddb484b6adff759f4413d201ae03 sadly without a corresponding task

// We also disable this styling on JavaScript disabled devices. This fixes the issue with
// Opera Mini where checking/unchecking doesn't apply styling but potentially leaves other
// more capable browsers with unstyled checkboxes.
.client-js .mw-ui-checkbox:not( #noop ) {

I'm tempted to drop support for older devices Opera Mini provided we can verify this works correctly on the latest version.

Change 441148 had a related patch set uploaded (by Jdlrobson; owner: Jdlrobson):
[mediawiki/core@master] Checkboxes should be styled on non-JS browsers

https://gerrit.wikimedia.org/r/441148

Change 441246 had a related patch set uploaded (by Jdlrobson; owner: Jdlrobson):
[mediawiki/skins/MinervaNeue@master] Allow non-js users to remember login on grade C browsers

https://gerrit.wikimedia.org/r/441246

Niedzielski updated the task description. (Show Details)Jun 25 2018, 5:54 PM

@Jdlrobson, this change looks good to me but has a big impact. Is there any deprecation policy we need to go through or is this acceptable to push through based on our compatibility matrix alone?

Nope. This can just be merged.

Change 441148 merged by jenkins-bot:
[mediawiki/core@master] Checkboxes should be styled on non-JS browsers

https://gerrit.wikimedia.org/r/441148

Change 441246 merged by jenkins-bot:
[mediawiki/skins/MinervaNeue@master] Allow non-js users to remember login on grade C browsers

https://gerrit.wikimedia.org/r/441246

Jdlrobson updated the task description. (Show Details)Jun 26 2018, 5:55 PM
Jdlrobson reassigned this task from Niedzielski to alexhollender.

Have added QA steps. Test on the beta cluster please (https://en.m.wikipedia.beta.wmflabs.org/wiki/Special:UserLogin)

Passing this over to Anthony. As far as I can tell this is all set, but I don't have the necessary devices to test this properly.

Looks good to me on Beta. Tried a bunch of opera mini versions. It looks like Android 4.x with opera mini 28 (or older) shows the checkbox as expected. Newer versions of Opera mini (version 30+) show no checkbox even on older android, but I think that's ok too.
w/o checkbox




w/ checkbox


Looks good! Also tested in latest Opera Mini with extreme mode - checkbox appears (@ABorbaWMF - extreme mode turns javascript off for Opera mini)

ovasileva closed this task as Resolved.Jun 29 2018, 11:12 AM
Vvjjkkii renamed this task from Show "keep me logged in" checkbox for users on login page without Javascript to k8aaaaaaaa.Jul 1 2018, 1:04 AM
Vvjjkkii reopened this task as Open.
Vvjjkkii raised the priority of this task from Normal to High.
Vvjjkkii removed ABorbaWMF as the assignee of this task.
Vvjjkkii updated the task description. (Show Details)
Vvjjkkii removed the point value for this task.
Vvjjkkii edited subscribers, added: ABorbaWMF; removed: gerritbot, Aklapper.
CommunityTechBot set the point value for this task to 1.Jul 2 2018, 9:18 AM
CommunityTechBot updated the task description. (Show Details)
CommunityTechBot assigned this task to ABorbaWMF.
CommunityTechBot lowered the priority of this task from High to Normal.
CommunityTechBot closed this task as Resolved.
CommunityTechBot renamed this task from k8aaaaaaaa to Show "keep me logged in" checkbox for users on login page without Javascript.
CommunityTechBot edited subscribers, added: gerritbot, Aklapper; removed: ABorbaWMF.
Tgr added a subscriber: Tgr.Jul 24 2018, 10:13 AM

What is the goal here? If you just want to hide the keep logged in checkbox, that should be done in a way that works with or without Javascript (probably by checking and hiding it in the AuthChangeFormFields hook).