Bug 256697 – textareas with overflow hidden renders too many columns

• Component: Forms
• Status: RESOLVED FIXED

[Luke Warlow]

Does this work in other browsers?

No - I can reproduce the problem in another browser

This behaves correctly in Firefox and incorrectly in Safari and Chrome. See attached images.

Steps to reproduce the problem:
1.Load data:text/html,<textarea cols="3" rows="3">XXXXXXXXXXXXX</textarea><style>textarea { overflow: hidden; }</style> in Safari.
2.You will see that 4 columns (+ almost a 5th one with just whitespace) are rendered

Problem Description:
This should render just 3 columns but instead overflow hidden (and clip) only hide the scrollbar but still reserves its space.

This behaviour can also be seen in Chrome but NOT Firefox.

I came across it as I believe this is the part of the cause of one of the failing tests as part of the scrollbar-width implementation. The ref test (https://wpt.live/css/css-scrollbars/textarea-scrollbar-width-none.html) relies on this behaviour being correct and it isn't.

[Luke Warlow]

Pull request: https://github.com/WebKit/WebKit/pull/13832

[Ahmad Saleem]

Isn't it same as bug 253310?

If Yes, let me know I can mark other duplicate of this.

[Luke Warlow]

They're related but not the same. This is about the space reserved for a scrollbar in situations where it shouldn't be. The other one is about the resize handle itself being hidden when scrollbars are hidden (using legacy CSS or scrollbar-width)

[Radar WebKit Bug Importer]

<rdar://problem/109343502>

[EWS]

Committed 264095@main (9ae5f9cb52ff): <https://commits.webkit.org/264095@main>

Reviewed commits have been landed. Closing PR #13832 and removing active labels.