WordPress / gutenberg

The Block Editor project for WordPress and beyond. Plugin is available from the official repository.
https://wordpress.org/gutenberg/
Other
10.32k stars 4.12k forks source link

Editor: Link preview overflows with long strings and only shows postname #62414

Open hrkhal opened 3 months ago

hrkhal commented 3 months ago

Description

The Link Preview in the unified publishing details overflows when long strings are present in the post name and it does not show the full url path.

Enterprise users would expect to see the full url path in the preview at a glance. Displaying the full path would better align with what was in 6.4 and what our users expect.

Screenshot 2024-06-07 at 13 34 18

Step-by-step reproduction instructions

  1. Go to permalink settings and set a custom structure of /%year%/%monthnum%/%day%/%postname%-%post_id%/
  2. Create a new post, give it a post name of /helloworldhelloworldhelloworld
  3. Observe that a) the link preview does not wrap and b) that the preview is only the post name

I would expect the link preview to a) wrap long strings and b) display /2024/06/07/helloworldhelloworldhelloworld-1

Screenshots, screen recording, code snippet

Screenshot 2024-06-07 at 13 23 03

Environment info

Please confirm that you have searched existing issues in the repo.

Yes

Please confirm that you have tested with all plugins deactivated except Gutenberg.

Yes

Anuj-Rathore24 commented 3 months ago

Hey @hrkhal,

In my opinion, the purpose of the link button in the post publish panel should be to display only the title of the post, rather than the entire permalink. The full link can be accessed through the dialog box that appears upon clicking the link button, making it redundant to display it initially.

Screenshot 2024-06-13 at 3 10 45 PM
hrkhal commented 3 months ago

@Anuj-Rathore24 Appreciate the fix for line wrapping.

It is not redundant to reduce the number of clicks to ascertain information that used to be available in 6.4 without the need for any user interaction.

tharsheblows commented 3 months ago

@Anuj-Rathore24 @hrkhal Ack, I was working on this too and opened a PR. I hope between the two of us it gets sorted 😊

There are some updates to make things a bit clearer about what you can edit and where in the PR I did as I found the description in the edit link dialog a bit imprecise.

annezazu commented 3 weeks ago

Wanted to note I can replicate this with 6.6.1:

https://github.com/user-attachments/assets/cf8b8653-cb28-4929-a606-0d739c4961ca

Another one to possibly consider for a point release cc @vcanales

vcanales commented 3 weeks ago

@annezazu I was unable to reproduce this in 6.6.1. After some digging, I found that the text wrapping problem in the inspector was introduced in Gutenberg 18.5 and fixed in 18.7 by this PR, which was a part of the 6.6 release.

The display of the full URL isn't fit for a point release, as I don't think it can be considered a regression; the URL hasn't been shown since 6.4.

The problem in the video looks different from the one reported in this issue and is reproducible in 6.5:

https://github.com/user-attachments/assets/6e32c267-9c01-4af7-8c77-312021c1b4ac

I've added a new issue for this behavior — https://github.com/WordPress/gutenberg/issues/64730

t-hamano commented 3 weeks ago

Regarding the link button in the inspector, it's also discussed in #61196, including whether its label and popover content are appropriate.