1654769 - clientLeft/clientTop return 0 for non-inline <textarea /> with actual border

Status: RESOLVED FIXED

(Core :: DOM: CSS Object Model, defect)

Description

[grundmanise]

User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/84.0.4147.89 Safari/537.36

Steps to reproduce:

https://codepen.io/eedd/pen/zYrbYOE

// css
textarea { display: block; border: 10px solid black; }

// html
<textarea id='textarea'></textarea>

//js
const ta = document.getElementById('textarea');
console.assert(ta.clientLeft !== 0, 'clientLeft is 0');
console.assert(ta.clientTop !== 0, 'clientTop is 0');

Actual results:

Element.clientLeft/Element.clientTop return 0 for non-inline <textarea /> with actual border.

Expected results:

Element.clientLeft/Element.clientTop should return actual border width for non-inline <textarea /> with border.

Comment 1

[Emilio Cobos Álvarez (:emilio)]

Attachment: Testcase from reporter.

Comment 2

[Emilio Cobos Álvarez (:emilio)]

Attachment: Bug 1654769 - Make clientRect offsets relative to the primary frame of the element. r=mats

We're returning offsets relative to the scroll target frame, which for
inputs and such is not the primary frame, and thus they never have
border or padding or what not.

Offsets should be relative to the primary frame however, so move the
rect appropriately.

Comment 3

[Emilio Cobos Álvarez (:emilio)]

It doesn't have to be non-inline and such. However yeah I agree this behavior is wrong. The reason why this happens is because the scrolling box in <input> / <textarea> is not the main box, and we apply the padding to the outer box rather than the scroll box.

Comment 4

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/0ce4c53c6abb
Make clientRect offsets relative to the primary frame of the element. r=mats

Comment 5

[Web Platform Test Sync Bot [:wpt-sync] (Matrix: #interop:mozilla.org)]

Created web-platform-tests PR https://github.com/web-platform-tests/wpt/pull/24760 for changes under testing/web-platform/tests

Comment 6

[Andreea Pavel [:apavel]]

https://hg.mozilla.org/mozilla-central/rev/0ce4c53c6abb

Comment 7

[Web Platform Test Sync Bot [:wpt-sync] (Matrix: #interop:mozilla.org)]

Upstream PR merged by moz-wptsync-bot