Page MenuHomePhabricator

vector-user-links should accommodate longer user names
Closed, ResolvedPublic1 Estimated Story Points

Description

Steps to reproduce:

  1. A user with more than 32 chars in a user name logs in
  2. A user name is displayed overlapping other control icons in user links menus:

Screen Shot 2024-01-26 at 1.06.26 PM.png (170×938 px, 20 KB)

Note: Wikipedia:Naming conventions (technical restrictions)#Restrictions on usernames allows user names to be up to 85 bytes long.

QA Results - Beta

ACStatusDetails
1T356349#9530904

QA Results - Prod

ACStatusDetails
1T356349#9567878

Details

Event Timeline

I think just adding overflow: hidden; text-overflow: ellipsis; to #pt-userpage-2 would be sufficient here.

While we're here would should probably add max-width's to other supported skins, such as Vector classic and monobook:

image.png (90×938 px, 22 KB)

image.png (91×892 px, 19 KB)

Jdlrobson subscribed.

Truncating with an ellipsis seems appropriate here.

Change 995091 had a related patch set uploaded (by Esanders; author: Esanders):

[mediawiki/skins/Vector@master] Truncate long usernames with an ellipsis

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

Change 995091 merged by jenkins-bot:

[mediawiki/skins/Vector@master] Truncate long usernames with an ellipsis

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

Edtadros subscribed.

Test Result - Beta

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

Test Artifact(s):

QA Steps

A user with more than 32 chars in a user name logs in
✅ AC1: A user name is displayed without overlapping other control icons in user links menus

screenshot 470.png (295×1 px, 58 KB)

screenshot 471.png (634×728 px, 232 KB)

ovasileva claimed this task.

Test Result - Prod

Status: ✅ PASS
Environment: enwiki
OS: macOS Sonoma
Browser: Chrome
Device: MBA
Emulated Device:NA

Test Artifact(s):

QA Steps

A user with more than 32 chars in a user name logs in
✅ AC1: A user name is displayed without overlapping other control icons in user links menus

screenshot 544.png (312×1 px, 211 KB)

screenshot 545.png (271×731 px, 70 KB)