Page MenuHomePhabricator
Create Task
Maniphest T343928

Add a simple feature flag to Vector for font size
Closed, ResolvedPublic3 Estimated Story Points
Actions

Assigned To
None
Authored By
Jdlrobson
Aug 9 2023, 8:27 PM
Tags
Referenced Files
F37670710: Untitled.mov.gif
Sep 7 2023, 11:59 PM
F37670706: screenshot 3.png
Sep 7 2023, 11:56 PM
F37670705: screenshot 4.png
Sep 7 2023, 11:56 PM
F37670704: screenshot 1.mov.gif
Sep 7 2023, 11:56 PM
F37667671: screenshot.mov.gif
Sep 6 2023, 4:45 PM
F37639587: Screenshot 2023-08-28 at 6.30.03 PM.png
Aug 29 2023, 1:34 AM
F37639586: Screenshot 2023-08-28 at 6.25.07 PM.png
Aug 29 2023, 1:34 AM
F37638847: Screenshot 2023-08-28 at 9.38.08 AM.png
Aug 28 2023, 4:45 PM
View All 10 Files
Subscribers
Aklapper
Edtadros
Jdlrobson
Jdrewniak
KSarabia-WMF
ppelberg

Description

Currently the font size for articles is 14px. We would like to eventually bump it to 16px. As a starting point we'd like to introduce a feature flag that allows us to do extensive QA of the site and determine what breaks.

Acceptance criteria

  • For now the feature flag will support 2 states: Current font-size, New font-size
  • The default font size is the current font size
  • When the feature flag is enabled, instead of font-size 14px apply font-size 16px. Do not worry about optimizing any feature. The goal is to see what breaks.
  • It should be possible to increase the font size using the code mw.user.clientPrefs.set('vector-feature-custom-font-size', 'enabled') in a gadget or by running the code in the developer console.
  • It should be possible to increase font size using a query string parameter ?VectorCustomFontSize=1

QA steps

As an anonymous user run the following code in developer console and check the font size changes:

mw.user.clientPrefs.set('vector-feature-custom-font-size', 'enabled')

Sign off steps

  • Arrange a QA task to exploratory test the site with the new font size. T345756
  • Create a task for managing how the font-size can be changed for logged in user - T345664

QA Results - Beta

ACStatusDetails
1✅T343928#9124318
2✅T343928#9124318
3✅T343928#9124318
4✅T343928#9146959
5✅T343928#9124318

QA Results - Prod

ACStatusDetails
1✅T343928#9151372
2✅T343928#9151372
3✅T343928#9151372
4✅T343928#9151372
5✅T343928#9151372

Details

SubjectRepoBranchLines +/-
Make Vector feature flag compatible with clientPrefsmediawiki/skins/Vectormaster+2 -2
Add font size feature flagmediawiki/skins/Vectormaster+46 -0
Customize query in gerrit

Related Objects

Event Timeline

Jdlrobson created this task.Aug 9 2023, 8:27 PM
Restricted Application added a subscriber: Aklapper. · View Herald TranscriptAug 9 2023, 8:27 PM
Jdlrobson triaged this task as High priority.Aug 9 2023, 8:28 PM
Jdlrobson renamed this task from Add a simple feature flag for font size to Add a simple feature flag to Vector for font size.Aug 9 2023, 9:03 PM
Jdlrobson updated the task description. (Show Details)Aug 10 2023, 4:32 PM
ovasileva set the point value for this task to 3.Aug 10 2023, 5:10 PM
ovasileva moved this task from Incoming to Ready for Development on the Web-Team-Backlog (Web Team FY2023-24 Q1 Sprint 4) board.
Jdlrobson mentioned this in T316060: [anon prefs] TOC pinned / unpinned status should persist across page views for anonymous users.Aug 11 2023, 4:30 PM
KSarabia-WMF claimed this task.Aug 15 2023, 6:50 PM
gerritbot added a comment.Aug 15 2023, 10:51 PM

Change 949137 had a related patch set uploaded (by Kimberly Sarabia; author: Kimberly Sarabia):

[mediawiki/skins/Vector@master] Add font size feature flag

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

gerritbot added a project: Patch-For-Review.Aug 15 2023, 10:51 PM
KSarabia-WMF moved this task from Ready for Development to Doing on the Web-Team-Backlog (Web Team FY2023-24 Q1 Sprint 4) board.Aug 17 2023, 4:33 PM
KSarabia-WMF removed KSarabia-WMF as the assignee of this task.Aug 21 2023, 5:11 PM
KSarabia-WMF moved this task from Doing to Code Review on the Web-Team-Backlog (Web Team FY2023-24 Q1 Sprint 4) board.
KSarabia-WMF subscribed.
Jdrewniak claimed this task.Aug 21 2023, 5:12 PM
ovasileva added a project: FY2023-24-WE 2.1 Typography and palette customizations.Aug 22 2023, 4:50 PM
gerritbot added a comment.Aug 24 2023, 9:33 PM

Change 949137 merged by jenkins-bot:

[mediawiki/skins/Vector@master] Add font size feature flag

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

Maintenance_bot removed a project: Patch-For-Review.Aug 24 2023, 10:10 PM
Jdrewniak moved this task from Code Review to QA on the Web-Team-Backlog (Web Team FY2023-24 Q1 Sprint 4) board.Aug 25 2023, 5:05 PM
gerritbot added a comment.Aug 25 2023, 6:58 PM

Change 952490 had a related patch set uploaded (by Jdrewniak; author: Jdrewniak):

[mediawiki/skins/Vector@master] Make Vector feature flag compatible with clientPrefs

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

gerritbot added a project: Patch-For-Review.Aug 25 2023, 6:58 PM
gerritbot added a comment.Aug 25 2023, 8:19 PM

Change 952490 merged by jenkins-bot:

[mediawiki/skins/Vector@master] Make Vector feature flag compatible with clientPrefs

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

Maintenance_bot removed a project: Patch-For-Review.Aug 25 2023, 8:30 PM
Jdrewniak reassigned this task from Jdrewniak to Edtadros.Aug 28 2023, 3:55 PM
Jdrewniak subscribed.
Jdrewniak updated the task description. (Show Details)Aug 28 2023, 4:04 PM
Edtadros reassigned this task from Edtadros to Jdrewniak.EditedAug 28 2023, 4:45 PM
Edtadros subscribed.

Test Result - Beta

Status: ❓Need More Info
Environment: beta
OS: macOS Ventura
Browser: Chrome
Device: MBA
Emulated Device:NA

Test Artifact(s):

QA Steps

✅ AC1: For now the feature flag will support 2 states: Current font-size, New font-size
✅ AC2: The default font size is the current font size
✅ AC3When the feature flag is enabled, instead of font-size 14px apply font-size 16px. Do not worry about optimizing any feature. The goal is to see what breaks.
❓ AC4: It should be possible to increase the font size using the code mw.user.clientPref.set( 'vector-font-size', '1' ); in a gadget or by running the code in the developer console.
@Jdrewniak, I ran the code above in console and got an error. I changed it to clientPrefs and I no longer get the error, but it returns false and does nothing to the page. Not sure how to validate this.

Screenshot 2023-08-28 at 9.43.41 AM.png (125×554 px, 17 KB)

✅ AC5: It should be possible to increase font size using a query string parameter ?VectorCustomFontSize=1

Screenshot 2023-08-28 at 9.37.39 AM.png (641×1 px, 256 KB)

Screenshot 2023-08-28 at 9.38.08 AM.png (605×1 px, 238 KB)

Jdrewniak added a comment.EditedAug 28 2023, 5:10 PM

@Edtadros sorry my bad, the correct code is mw.user.clientPrefs.set( 'vector-font-size', '1' ); (clientPref with an 's' at the end) to turn the font-size feature on, and mw.user.clientPrefs.set( 'vector-font-size', '0' ); to turn it off.

Edtadros claimed this task.Aug 28 2023, 5:13 PM
Edtadros reassigned this task from Edtadros to Jdrewniak.Aug 29 2023, 1:34 AM

Test Result - Beta

Status: ❌ FAIL
Environment: beta
OS: macOS Ventura
Browser: Chrome
Device: MBA
Emulated Device:NA

Test Artifact(s):

QA Steps

❌ AC4: It should be possible to increase the font size using the code mw.user.clientPrefs.set( 'vector-font-size', '1' ); in a gadget or by running the code in the developer console.

@Jdrewniak The font in the body of the article doesn't change. The AC mentions gadgets. The only two gadgets are the UTC time that appears to the left of the user icon, and the [edit] link in the lead section. it doesn't appear any fonts changed when I ran the command in the console. I'm leaving this in QA since instead of moving it to "Needs more work" since it's not the current sprint.

Screenshot 2023-08-28 at 6.25.07 PM.png (983×1 px, 374 KB)

Screenshot 2023-08-28 at 6.30.03 PM.png (947×1 px, 413 KB)

ppelberg subscribed.Aug 29 2023, 5:44 PM
ReleaseTaggerBot added a project: MW-1.41-notes (1.41.0-wmf.25; 2023-09-05).Aug 30 2023, 2:01 AM
Jdlrobson updated the task description. (Show Details)Sep 5 2023, 5:33 PM
Jdlrobson updated the task description. (Show Details)
Jdlrobson updated the task description. (Show Details)
Edtadros claimed this task.Sep 5 2023, 5:40 PM
Jdlrobson mentioned this in T345664: How should client preferences work for logged in users?.Sep 5 2023, 9:02 PM
Jdlrobson updated the task description. (Show Details)
Jdlrobson updated the task description. (Show Details)
Edtadros removed Edtadros as the assignee of this task.Sep 6 2023, 4:45 PM
Edtadros moved this task from QA to Ready for Signoff on the Web-Team-Backlog (Web Team FY2023-24 Q1 Sprint 4) board.

Test Result - Beta

Status: ✅ PASS
Environment: beta
OS: macOS Ventura
Browser: Chrome
Device: MBA
Emulated Device:NA

Test Artifact(s):

QA Steps

✅ AC4: It should be possible to increase the font size using the code mw.user.clientPrefs.set('vector-feature-custom-font-size', 'enabled'); by running the code in the developer console.

screenshot.mov.gif (1×2 px, 843 KB)

Edtadros updated the task description. (Show Details)Sep 6 2023, 4:47 PM
Jdlrobson mentioned this in T345756: [SPIKE] Exploratory testing of new font size.Sep 6 2023, 4:58 PM
Jdlrobson updated the task description. (Show Details)
Jdlrobson moved this task from Ready for Signoff to QA in Production on the Web-Team-Backlog (Web Team FY2023-24 Q1 Sprint 4) board.
Jdlrobson assigned this task to Edtadros.Sep 7 2023, 3:03 PM
Edtadros closed this task as Resolved.EditedSep 7 2023, 11:56 PM
Edtadros removed Edtadros as the assignee of this task.

Test Result - Beta

Status: ✅ PASS
Environment: beta
OS: macOS Ventura
Browser: Chrome
Device: MBA
Emulated Device:NA

Test Artifact(s):

QA Steps

✅ AC1: For now the feature flag will support 2 states: Current font-size, New font-size
✅ AC2: The default font size is the current font size
✅ AC3: When the feature flag is enabled, instead of font-size 14px apply font-size 16px. Do not worry about optimizing any feature. The goal is to see what breaks.
✅ AC4: It should be possible to increase the font size using the code mw.user.clientPrefs.set('vector-feature-custom-font-size', 'enabled'); by running the code in the developer console.
✅ AC5: It should be possible to increase font size using a query string parameter ?VectorCustomFontSize=1

Untitled.mov.gif (1×2 px, 3 MB)

screenshot 4.png (1×2 px, 832 KB)

screenshot 3.png (1×2 px, 890 KB)

Edtadros updated the task description. (Show Details)Sep 8 2023, 12:00 AM
Edtadros attached a referenced file: F37670710: Untitled.mov.gif. (Show Details)
Jdlrobson mentioned this in T346987: Convert font size feature flag to hidden user preference.Sep 22 2023, 10:54 PM
Content licensed under Creative Commons Attribution-ShareAlike (CC BY-SA) 4.0 unless otherwise noted; code licensed under GNU General Public License (GPL) 2.0 or later and other open source licenses. By using this site, you agree to the Terms of Use, Privacy Policy, and Code of Conduct. · Wikimedia Foundation · Privacy Policy · Code of Conduct · Terms of Use · Disclaimer · CC-BY-SA · GPL