1701586 - The click area of the "Learn more" and "View detailed Import Summary" links is too large

Status: VERIFIED FIXED

(Firefox :: about:logins, defect, P3)

Description

[Cosmin Muntean [:cmuntean], Ecosystem QA]

Attachment: large click area.gif

[Affected versions]:

• Firefox Nightly 89.0a1 (Build ID:20210328213901);
• Firefox Beta 88.0b (Build ID: 20210328185936)

[Affected Platforms]:

• Windows 10 x64;
• macOS 10.15.7;
• Linux Mint 20 x64;

[Prerequisites]:

• Have the latest Firefox Beta German build installed.
• Have a CSV file that contains multiple logins.

[Steps to reproduce]:

1. Open the Firefox browser with the profile from prerequisites.
2. Navigate to "about:logins" page.
3. Open the menu, click the "Import from a file..." option.
4. Select and import the CSV file described in perquisites.
5. Hover the white space beside the "View detailed Import Summary" link.
6. Click the "View detailed Import Summary" link.
7. Hover the white space beside the "Learn more" link from the "Import Summary" page.

[Expected result]:
Step 5 and Step 7: The link is not highlighted.

[Actual result]:
Step 5 and Step 7: The link is highlighted and if you click the withe space you are redirected to the specific link.

[Notes]:

• The issue is also reproducible for the "Learn more" link displayed in the "Import Error" modals.
• Attached a screen recording of the issue.

Comment 1

[Tim Giles [:tgiles] | OOO Nov 25-29]

To help Mozilla out with this bug, here's the steps:

1. Comment here on the bug that you want to volunteer to help.
   This will tell others that you're working on the next steps.
2. Download and build the Firefox source code
   • If you have any problems, please ask on
     Element/Matrix
     in the #introduction channel. They're there to help you get started.
   • You can also read the
     Developer Guide,
     which has answers to most development questions.
3. Start working on this bug.
   • You can solve this issue by adding an align-items: flex-start to the ".content" rule in import-summary-dialog.css and by adding an align-items: flex-start to the ".summary" rule in aboutLoginsImportReport.css
   • If you have any problems with this bug,
     please comment on this bug and set the needinfo flag for me.
     Also, you can find me and my teammates on the #lockwise-desktop channel on
     Element/Matrix
     most hours of most days.
4. Build your change with mach build and test your change with
   mach test browser/components/aboutlogins/ --headless.
   Also check your changes for adherence to our style guidelines by using mach lint
5. Submit the patch (including an automated test, if applicable) for review.
   Mark me as a reviewer so I'll get an email to come look at your code.
   • How to Submit a Patch
   • This is when the bug will be assigned to you.
6. After a series of reviews and changes to your patch,
   I'll mark it for checkin or push it to autoland.
   Your code will soon be shipping to Firefox users worldwide!
7. ...now you get to think about what kind of bug you'd like to work on next.
   Let me know what you're interested in and I can help you find your next contribution.

Comment 2

[Sonia Lomo]

Hey Tim Giles, I'm Sonia - an Outreachy Internship applicant. I'm new to the codebase but I'd like to have a go at this issue.

Comment 3

[Tim Giles [:tgiles] | OOO Nov 25-29]

Hi Sonia, thanks for looking into this! I'll assign you the ticket. Let me know if you have any questions! I'll be back in the office tomorrow so don't expect any answers today, but you can find me over on Matrix in the #lockwise-desktop channel.

Comment 5

[Tim Giles [:tgiles] | OOO Nov 25-29]

Hi Sonia, I wanted to check in and see if you needed any help in solving this ticket. Feel free to comment on this ticket or reach out over on Matrix if you do!

Comment 6

[jha.ashray12]

Hello, I want to get started by solving this bug. Any help regarding the Prerequisites mentioned " 1.Have the latest Firefox Beta German build installed.
2.Have a CSV file that contains multiple logins." would be great.

Comment 7

[Tim Giles [:tgiles] | OOO Nov 25-29]

Hi Ashray,

You shouldn't need the latest Firefox Beta German build in order to encounter this issue. Your development environment should encounter this issue since it is (most likely) ahead of Beta. However, you will need to enable signon.management.page.fileImport.enabled and set this pref to true in your about:config in order to enable Login CSV import.

As for your second point, the easiest way to generate this file would be to create some test logins in about:logins and then export them to a CSV file via the menu next to the "Sign in to Sync" button. After you export your test CSV, you should be able to import any amount of times and reproduce the issue seen in Comment #0.

Feel free to reach out if you have any questions!

Comment 8

[jha.ashray12]

Attachment: Bug 1701586 - Fix size of links in CSV import dialog and report. r?tgiles

Comment 9

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/f2a9171d1488
Fix size of links in CSV import dialog and report. r=tgiles

Comment 10

[Alexandru Michis [:malexandru]]

https://hg.mozilla.org/mozilla-central/rev/f2a9171d1488

Comment 11

[Simona Rosu [:srosu], Ecosystem QA]

I have verified this issue using the latest Nightly 90.0a1 (Build ID: 20210526211756) on Windows 10 x64, Ubuntu 20.04 and macOS 11.2.3.

• The click area of the “View detailed Import Summary" link from the Import Complete modal and of the “Learn more” link from the “Import Summary Report” page are no longer too large.