This Bugzilla instance is a read-only archive of historic NetBeans bug reports. To report a bug in NetBeans please follow the project's instructions for reporting issues.

Bug 244527 - Discrepancy on measurements of HTML elements using Netbeens Connector or embedder Webkit
Summary: Discrepancy on measurements of HTML elements using Netbeens Connector or embe...
Status: RESOLVED FIXED
Alias: None
Product: web
Classification: Unclassified
Component: Inspection (show other bugs)
Version: 8.0
Hardware: PC Windows 7
: P3 normal (vote)
Assignee: Jan Stola
URL:
Keywords:
Depends on:
Blocks:
 
Reported: 2014-05-16 04:34 UTC by hifmo
Modified: 2014-08-04 12:22 UTC (History)
1 user (show)

See Also:
Issue Type: DEFECT
Exception Reporter:

Attachments
evidence of case (254.04 KB, image/jpeg)
2014-05-16 04:34 UTC, hifmo 		Details
BugCase.zip file with some html and css code, which I used to test this issue. (1.77 KB, application/x-zip-compressed)
2014-05-19 02:34 UTC, hifmo 		Details
Add an attachment (proposed patch, testcase, etc.)

Note You need to log in before you can comment on or make changes to this bug.
Description hifmo 2014-05-16 04:34:36 UTC 
Created attachment 147285 [details]
evidence of case

Netbeens Connector displays incorrect measurement info of HTML elements on Chrome.
Also, Netbeens, displays incorrect measurement info using Embedded WEbkit.

Ex.: incorrect measurement info on an input field

1.- Web Tools in Chrome shows: 208px x 27px
2.- Firefox with the inspector shows the same: 208px x 27px

BUT

3.- Netbeens' Connector using Chrome shows 209px x 27px !!!
4.- And Netbeens using Embedded Webkit shows 208px x 26px !!!

See attached img files.

mcm
Comment 1 Jan Stola 2014-05-16 14:21:56 UTC 
Thank you for the bug report. Unfortunately, the attached screenshots are not sufficient to evaluate this issue. Could you, please, attach a sample project/test case that shows this problem. Thank you in advance.
Comment 2 hifmo 2014-05-19 02:32:57 UTC 
(In reply to Jan Stola from comment #1)
> Thank you for the bug report. Unfortunately, the attached screenshots are
> not sufficient to evaluate this issue. Could you, please, attach a sample
> project/test case that shows this problem. Thank you in advance.

Hi Stola,
the error is a little subtle. Let me show you some results:

    Chrome + connector or Netbeens + webkit:

        window: 509 px x 1050 px (viewport: 493px 901px) ---> input#email.formField 209 px x 24 px
        window: 862 px x 1050 px (viewport: 846px 901px) ---> input#email.formField 208 px x 24 px
        window: 1117 px 1051 px (viewport: 1101px 902px) ---> input#email.formField 209 px x 24 px
        window: 1114 px x 1050 px (viewport: 1098px 901px) ---> input#email.formField 208 px x 24 px

    Chrome + WebTools: always shows input#email.formField 208px x 24px

Conclusion:

    Odd( width ) ----> 209 px
    Event( width ) ----> 208 px

Attached:  BugCase.zip file with some html and css code, which I used to test this issue.
Comment 3 hifmo 2014-05-19 02:34:51 UTC 
Created attachment 147324 [details]
BugCase.zip file with some html and css code, which I used to test this issue.

BugCase.zip file with some html and css code, which I used to test this issue.
Comment 4 Jan Stola 2014-05-19 13:43:06 UTC 
Thank you for the test case. I was able to reproduce the described behavior. The displayed width/height come from element.getClientRects(). Unfortunately, the rounding used by this method may result in width/height one pixel larger for elements whose position cannot be expressed by integers.

The components in your test case are centered. Hence, when the viewport has odd number of pixels then the position of the centered components is fractional.

For example, element.getBoundingClientRect() returns

{ bottom: 118, height: 24, left: 536.5, right: 744.5, top: 94, width: 208 }

On the other hand, element.getClientRects() returns

[{ bottom: 118, height: 24, left: 536, right: 745, top: 94, width: 209 }]

Note that left is rounded down while right is rounded up. Hence, the total width is 209 instead of 208.

I will try to modify the calculation of the displayed width/height to take this situation into account.
Comment 5 Jan Stola 2014-08-04 12:22:20 UTC 
Fixed by http://hg.netbeans.org/web-main/rev/97bd921340e2