1796857 - Text content of First record column overlaps Address Book Field column in `Import Address Book File - Match field names` dialog

Status: NEW

(MailNews Core :: Import, defect, P3)

Description

[Thomas D. (:thomas8)]

Attachment: Screenshot 1: First record column overlaps Address Book Field column, and overlong Notes column

As seen in screenshot, just slightly longer text content of First record column overlaps Address Book Field column in Import Address Book File - Match field names dialog, which looks distorted. We need some smarter CSS overflow handling here, also for long texts in Notes field.

STR

1. Save sample testcase.csv file from attachment 9299711 [details] to a local file system folder. The csv should have:

• field name in first row which deviates from default TB field name, e.g. Email (to trigger Match field names dialog)
• a longer email address like [e-mail]
• a Notes field filled with more text.

1. Tools > Import > Import from a file > Continue
2. Import Address Books > Continue
3. Comma or tab separated file (.csv, .tsv) > Continue
4. In the Select an address book file dialog: choose testcase.csv file from step 1 > Open

Actual (see screenshot)

• First record column overlaps Address Book Field column
• long text in Notes field grows the match field table out of proportions

Expected

• No overlap of text in First Record column
• smarter overflow (scroll bar?) for long text fields like Notes
• While we are here, might also want to handle overflow of longer field names from external CSVs in Source Field column

Comment 1

[Thomas D. (:thomas8)]

Attachment: 1796857_testcase1_reduced-deviant-testAB.csv

For developer's convenience: Testcase for steps of comment 0.

Comment 2

[Alessandro Castellani [:aleca]]

This can be fixed by making those field break all words, and truncate the notes field, with maybe adding a tooltip on hover to read the whole thing if users needs.
Not a big priority, so marking this as P3 if anyone want to take it, but I'm not assigning anyone to this right now.

Comment 3

[Magnus Melin [:mkmelin]]

For anyone interested, likely the code is around here: https://searchfox.org/comm-central/rev/9928839e0c4686ae45939f416d64ce15ac113113/mailnews/import/content/fieldMapImport.js#137