I feel like this is partly a regression, but I am not sure.
Steps to replicate the issue:
Search for a long page name on Wikipedia through the Vector 2022 typeahead search bar, e.g. Kategorie:Wikipedia:Vorlagenfehler/Vorlage:Navigationsleiste Musik/Tabelle on dewiki.
What happens?:
The search results in the drop-down are handled with overflow:hidden, so long names will be cut off (even in the middle, whenever there are spaces). Meanwhile, the search footer will cause overflow.
What should have happened instead?:
Search results/recommendations and the search footer need to show a consistent behaviour. Ideally, it would use hyphens:auto and word-wrap: break-word (which seems to have been implemented for the search results, but without any effect, as the overflow:hidden cuts them off), so no overflow would be caused and the search term will not be cut in the middle of the word. Alternatively (or additionally), overflow:hidden can be used.
QA steps
- Reduce width to around 720px
- visit https://en.wikipedia.org/?useskin=vector-2022
- Search for Category:Ssssssssssssssssssssssssssssssssssssssssssssssssssss
Expected: The footer text should not overflow the search suggestions container.
QA Results - Prod
| AC | Status | Details |
|---|---|---|
| 1 | ✅ | T333030#8878510 |
