[wp-trac] [WordPress Trac] #55393: File name URL overflow the container in the media editor

[WordPress Trac]

#55393: File name URL overflow the container in the media editor
--------------------------+--------------------------------------
 Reporter:  mitogh        |       Owner:  (none)
     Type:  defect (bug)  |      Status:  new
 Priority:  normal        |   Milestone:  6.0
Component:  Media         |     Version:  5.4
 Severity:  normal        |  Resolution:
 Keywords:                |     Focuses:  ui, css, administration
--------------------------+--------------------------------------
Changes (by costdev):

 * focuses:  ui, administration => ui, css, administration
 * version:  5.9.2 => 5.4
 * milestone:  Awaiting Review => 6.0


Comment:

 == Issue Reproduction Report

 === Env
 * Web Server: Apache (Linux)
 * WordPress: 5.9.2
 * Browser: Firefox 98.0.1
 * OS: Windows 10
 * Theme: TT1 Blocks
 * Plugins: None activated.

 === Steps to reproduce
 1. Navigate to `Media > Add New`.
 2. Upload a large image with a long filename.
 3. Navigate to `Media > Library`.
 4. Click the "List Mode" icon.
 5. Click the "Edit" link for the image you uploaded.

 To the right, the "Original image:" link shuold overflow the container.

 === Results
 1. Issue reproduced in Firefox. ✅
 2. Could not reproduce in Chrome (incl. Edge, Brave). ❌

 === Notes
 1. Introduced in [https://core.trac.wordpress.org/changeset/47202 47202].
 2. `word-break: break-word` is used on the bolded "File name:" text above
 the link. This also works when applied to the "Original image:" link,
 however I personally think that `word-break: break-all` looks cleaner.
 3. Adding `css` focus for input on preference between `break-word` and
 `break-all`.
 4. [https://core.trac.wordpress.org/changeset/47202 47202] introduced this
 link in the three locations below. The patch should be tested all three of
 these.
   - [https://core.trac.wordpress.org/browser/trunk/src/wp-includes/media-
 template.php#L442 wp-includes/media-template.php:442].
   - [https://core.trac.wordpress.org/browser/trunk/src/wp-includes/media-
 template.php#L665 wp-includes/media-template.php:665].
   - [https://core.trac.wordpress.org/browser/trunk/src/wp-
 admin/includes/media.php#L3485 wp-admin/includes/media.php:3485] - This is
 the one reported in this ticket.
 5. Milestoning for `6.0`.

-- 
Ticket URL: <https://core.trac.wordpress.org/ticket/55393#comment:1>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform