1787123 - The "Skip this step" label from the secondary CTA button is too small on higher resolutions

Status: VERIFIED FIXED

(Firefox :: Messaging System, defect, P2)

Description

[Marius Coman [:mcoman], Ecosystem QA]

Attachment: ss of the issue.png

[Affected versions]:

• Firefox Nightly 106.0a1 - Build ID: 20220824213405

[Affected Platforms]:

• Windows 10 x64

[Prerequisites]:

• Have the following prefs in the "about:config" page:
• "devtools.chrome.enabled" set to "true";
• "browser.aboutwelcome.templateMR" set to "true".
• Have a screen with a 2560x1440 resolution set (scaling 100%).

[Steps to reproduce]:

1. Open the browser with the profile from the prerequisites.
2. Navigate to the "about:welcome" page.
3. Observe the label from the "Skip this step" secondary button.

[Expected result]:

• The label is correctly displayed and visible.

[Actual result]:

• The "Skip this step" label is too small.

[Notes]:

• This issue is also reproducible with the "Skip this step" button from the existing users modals.
• This issue is less visible on macOS, Linux Mint 20.2 x64, or normal resolutions.
• Attached a screenshot of the issue.

Comment 1

[Punam Dahiya [:pdahiya]]

NI @Ania for product and UX feedback on this edge case Thanks

Comment 2

[Gabrielle Lussier [:glussier]]

(In reply to Punam Dahiya [:pdahiya] from comment #1)

NI @Ania for product and UX feedback on this edge case Thanks

Would it be possible to double the size of the modal on super-huge monitors? I'll attach a photo.

Comment 3

[Gabrielle Lussier [:glussier]]

Attachment: dell ultrasharp 49inch curved.png

Normal sized modal on huge monitor

Comment 4

[Gabrielle Lussier [:glussier]]

Attachment: dell ultrasharp 49inch curved2.png

Modal x2 size on large monitor

Comment 5

[Punam Dahiya [:pdahiya]]

Thanks @glussier. For priortizing this work it will help to confirm if issue is replicable on our most used resolutions — 1920x1080 — 1366x768

https://data.firefox.com/dashboard/hardware

@mcoman can you please confirm if secondary CTA is legible for 1920x1080 and 1366x768 and what's the breakpoint after which screen is too small to comprehend. As per above data dashboard 2560x1440 resolution is used by 2.35% users. Thanks!

Comment 6

[Ania]

I'd consider it a P2 (acceptable defect for 106).

This is purely speculative, but I think users on higher screen resolutions tend to be more advanced users, hence:

• new users with large resolutions will be more likely to skip the onboarding,
• existing users with large screen resolutions are more likely to be core actives, and their positive experience of the spotlight modal is important to us.

The second consideration has more weight for me as we won't show the spotlight modal with the same number of screens on every upgrade after MR. So if the cost of addressing this is on the smaller side, it would be nice to address sooner rather than later.

Comment 7

[Marius Coman [:mcoman], Ecosystem QA]

Hi, Punam! I have tested this and I can confirm that the "Skip this step" label is legible for 1920x1080 and 1366x768 resolutions.

Looping in @cmuresan to help me with testing on bigger resolutions

Comment 8

[Ciprian Muresan [:cmuresan], Ecosystem QA]

I've looked at all my available resolutions over 1920x1080 and I've made screenshots of the New User Onboarding as well as the Existing User Onboarding at 100% scaling. The resolutions I have available are as follows : 1920x1200, 1920x1440, 2560x1440, and 3620x2036 (Dynamic Super Resolution).

1920x1200 starts being a bit smaller than 1080p resolution, 1920x1440 looks as small as the 2560x1440, and 3620x2036 looks a bit better, but that might be caused by the fact that it's a supersampled resolution.

Here's a link to all the screenshots I've made: link. I've appended all the Existing Users Onboarding screenshots with a c.

Comment 9

[Emily McMinn :emcminn]

Attachment: Bug 1787123 - Switch to em instead of px on secondary CTA to maintain text size

Comment 10

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/34cbc2e4dccb
Switch to em instead of px on secondary CTA to maintain text size r=jprickett

Comment 11

[Sandor Molnar[:smolnar]]

https://hg.mozilla.org/mozilla-central/rev/34cbc2e4dccb

Comment 12

[Marius Coman [:mcoman], Ecosystem QA]

I have verified that this issue is no longer reproducible with the latest Firefox Nightly (106.0a1 Build ID - 20220914213649) installed on Windows 10 x64. Now, I can confirm that the "Skip this step" label is visible on a 2560x1440 resolution.