That bothered me a lot, how to proceed.
I like to use "ugly data" in my wireframes because my goal is not pretty but functional wireframes. Using simple single-line words is easy and pretty, but not real.
Here are ways to preview longer text before selecting an item:
But what if you have a nefarious user who uses Unicode to flood those fields?
The first example is the user who uses either one
The second example is the user who uses a long Unicode character
﷽ abuse a character counting method.
The third example uses a whitespace rendering character
ㅤ to create an ellipse out of nowhere seemingly.
Not only do you have to measure the width of a piece of text, you also need to make sure that it does not flow vertically. Or clean up entries so that this does not happen at all. However, these precautions are technically not always feasible.
Also, you'll need to see the full text somewhere anyway, and the longer Unicode characters make it ridiculous. As an an example,
longer title that ends in an ellipsis is 37 characters, below is an example of a 20 character string. When using line breaks, only 17 characters are required to completely overflow the screen at this font size.
How would you handle all this? Do you scroll over the text at a certain height? What if it's made up of line breaks? Decrease the font size?
I was told that it does not matter because it would be ridiculous for a user to enter such a long text. I do not like this answer as it will arrive and come in, and it should be my job to find the best way to display these marginal cases.