As a watchlist user, I want the name of page to properly text-wrap (rather than span past the pop-up width), so that I can easily read the name of the page that I am watching within the pop-up.
Background: This is an existing issue on production (you can reproduce by watching https://en.wikipedia.org/wiki/Pneumonoultramicroscopicsilicovolcanoconiosis. However, some pages seem to avoid this issue due to an automatic dashing, such as when you watch https://en.wikipedia.org/wiki/Taumatawhakatangi%C2%ADhangakoauauotamatea%C2%ADturipukakapikimaunga%C2%ADhoronukupokaiwhen%C2%ADuakitanatahu
- Page names that exceed the width of the pop-up should have text-wrap onto the next line
- Page names should not span past the width of the pop-up
- The pop-up text should always be in the pop-up (i.e., it should not exceed the width of the pop-up)
What is the problem?
When the page title contains a long word(s), this can cause the text to overflow the popup container.
Compare the same title on enwiki (without watchlist expiry enabled):
The title overflows on both, but with watchlist expiry enabled the rest of the text also overflows.
P.S. it does not seem to matter if the title is long but has spaces or hyphens which allow the title to be wrapped in the popup. Only if the title is, for example, a single long word with no breaks.
Steps to reproduce problem
- To go https://en.wikipedia.beta.wmflabs.org/wiki/Llanfairpwllgwyngyllgogerychwyrndrobwllllantysiliogogogoch
- or another example from https://en.wikipedia.org/wiki/List_of_long_place_names
- Click the watch star