Bug 197042 – Range.getBoundingClientRect returns invalid bounds when between two non-editable nodes

• Status: NEW
• Component: DOM

[Shrey Banga]

Created attachment 367698 [details]
You can open it in Safari and look at the console log to see the bug

I have attached a test case where you can see this in the console log, but also copying the description from the Chrome bug (#953977) I filed for this:

Steps to reproduce the problem:
1. Create a contenteditable=true node
2. Add two nodes inside it with contenteditable=false
3. Position a Range between these two programmatically or by clicking between them
4. Call getBoundingClientRect() on the current range

What is the expected behavior?
This should return the same bounds as it would if the two adjacent nodes were editable.

What went wrong?
This currently returns a DOMRect with everything zero-ed out:

bottom: 0
height: 0
left: 0
right: 0
top: 0
width: 0
x: 0
y: 0

Did this work before? No

[Radar WebKit Bug Importer]

<rdar://problem/50017853>

[Ahmad Saleem]

I am able to reproduce this bug in Safari 15.6 on macOS 12.5 and get following using attached test case and looking into Console:

>>> DOMRect
bottom: 0
height: 0
left: 0
right: 0
top: 0
width: 0
x: 0
y: 0

In other browsers, I get following:

*** Chrome Canary 106 ***

Same as Safari 15.6

*** Firefox Nightly 105 ***

bottom: 8
height: 0
left: 8
right: 8
top: 8
width: 0
x: 8
y: 8

_______

I am not sure on web-spec but just wanted to update latest test results. Thanks!