Breaking change on height(Upgrading from 3.5.1 to 3.6/3.7)

[parallels999]

Using .height() is rounding the value

• What do you expect to happen?
  get the real height
• What actually happens?
  the browser shows the real height but jquery get it rounded
• Which browsers are affected? tested on
  chrome 114.0.5735.110
  opera 99.0.4788.65
  chromium:113.0.5672.127
  edge 114.0.1823.43
  firefox 103.0.2

Description

having rounded height produces misaligned objects

V3.5:

V3.6/V3.7:

Link to test case

Same code, just different versions of jquery
V3.7.0: https://jsfiddle.net/6jqh4pmb/1/ (fails)
V3.6.4: https://jsfiddle.net/6jqh4pmb/2/ (fails)
V3.5.1: https://jsfiddle.net/6jqh4pmb/3/ (This is working fine)

[parallels999]

UPDATE:

Apparently this issue is shown when using bootstrap(3/4/5), bootstrap add this css:

* { box-sizing: border-box; }

jQuery works again if i add this css

tr { box-sizing: content-box; }

but since this worked correctly in 3.5.1 for me it is a bug,
It also fails with other css plugins, but I haven't figured out which styling affects it.

Working Demo: https://jsfiddle.net/hc3ym1Lt/
Failing Demo: https://jsfiddle.net/hc3ym1Lt/1/
Without Bootstrap Demo: https://codepen.io/parallels999/pen/WNYwxVG

[timmywil]

Thanks for opening an issue! It turns out our support test is not accounting for global border-box box-sizing. We can fix this by fixing the support test.

[mgol]

Note: we will fix it only in Chrome & Safari. In Firefox & IE it will remain an integer. This is because those browsers fail the reliableTrDimensions support test and we need to use outerHeight as a workaround - which does not return fractional values.

If Firefox ever starts passing the support test, it will automatically get fractional values here.

[mgol]

PRs:

• main (4.x): CSS: Make the reliableTrDimensions support test work with Bootstrap CSS #5278
• 3.x-stable: CSS: Make the reliableTrDimensions support test work with Bootstrap CSS (3.x version) #5279

[cyfung1031]

This is still not making sense in 3.7.1

https://jsfiddle.net/lunarlogic489/Las4vtbz/

Why tr height can be larger than tbody height? (Firefox)

[timmywil]

The difference was noted in a previous comment #5270 (comment). Further explanation in your issue.

[mgol]

It's a bit unfortunate that we penalize Firefox here though its behavior is technically correct according to the current spec. That said, there's a spec issue at w3c/csswg-drafts#4444 that is still open; the discussion there suggests the current spec may not be what's wanted and may need to change. Changing this behavior would be a breaking change in jQuery and there's a risk we'd have to change back once the spec issue is clarified. That's why I'd prefer to wait with changes here until after the spec issue is clarified. It seems the discussion there stalled, though.