Skip to main content

Bug Tracker

Side navigation

#9948 closed bug (wontfix)

Opened August 01, 2011 10:39AM UTC

Closed September 24, 2011 06:17PM UTC

Last modified October 25, 2011 08:08PM UTC

RegExp to test for pixel values might be unreliable in IE 9

Reported by: thomas.jaggi@gmail.com Owned by:
Priority: high Milestone: 1.7
Component: css Version: 1.6.2
Keywords: Cc:
Blocked by: Blocking:
Description

IE 9 (tested in version 9.0.8112 on Windows 7) does not seem to return rounded decimal pixel values when using currentStyle. Therefore, the regular expression used to detect pixel values (/^-?\\d+(?:px)?$/i) is not working properly there: http://jsfiddle.net/YPDHF/1/

Attachments (0)
Change History (16)

Changed August 27, 2011 08:29PM UTC by dmethvin comment:1

component: unfiledcss
milestone: None1.7
priority: undecidedhigh
status: newopen

Confirmed.

Changed August 30, 2011 09:46AM UTC by tomgrohl comment:2

_comment0: This also happens in FF6. \ \ Added an example here: http://jsfiddle.net/tomgrohl/Accr3/ \ \ Contains a fix: \ \ \ {{{ \ newrnumpx = /^-?\\d+(?:\\.\\d+)?(?:px)?$/i \ }}} \ \ \ Which works in FF6 and IE9 for both 3px and 3.14px. \ \ @dmethvin if your happy with this I can create a pull request.1314783948307220

Tested a fix. Added an example here: http://jsfiddle.net/tomgrohl/Accr3/

Contains the fix:

newrnumpx = /^-?\\d+(?:\\.\\d+)?(?:px)?$/i

Which works in IE9 for both 3px and 3.14px.

@dmethvin if your happy with this I can create a pull request.

Changed August 31, 2011 09:36AM UTC by thomas.jaggi@gmail.com comment:3

@tomgrohl: Thanks for the additional tests! However, If I remember it correctly, the corresponding code block was only relevant for IE.

Changed August 31, 2011 09:45AM UTC by tomgrohl comment:4

@thomas.jaggi@gmail.com: Yes true. I'll amended comment

The fix is still relevant for IE though, which is good.

Changed September 23, 2011 08:15PM UTC by dmethvin comment:5

cc: → tomgrohl

@tomgrohl, if you could create a pull request that would be great! Can we have a unit test case as well?

Changed September 23, 2011 08:27PM UTC by tomgrohl comment:6

Yes sure I'll get on it.

Changed September 24, 2011 11:16AM UTC by tomgrohl comment:7

Pull request here

Includes Unit Tests

Changed September 24, 2011 01:55PM UTC by rwaldron comment:8

Please see pull request comments.

Changed September 24, 2011 06:17PM UTC by timmywil comment:9

cc: tomgrohl
keywords: → needsdocs
resolution: → wontfix
status: openclosed

Thanks for your work. Since not all browsers (including webkit and firefox) support decimal pixel values, I think we should simply suggest that users stick with integer values. It keeps the code simpler and smaller.

Changed September 24, 2011 06:28PM UTC by tomgrohl comment:10

@timmywil

I agree, as I was I only looking into fixing it for IE only Iassumed it would work in other browsers. How wrong I was, lol.

Changed September 24, 2011 08:16PM UTC by thomas.jaggi@gmail.com comment:11

I disagree. First of all, the respective code block is relevant for IE only anyway, as far as I remember. And I'd say this is not about 'sticking with integer values' since it happens when computing the size of something set in relative units l(ike em or %) which does not correspond to an integer px value.

Changed September 24, 2011 08:21PM UTC by thomas.jaggi@gmail.com comment:12

Well, to be fair, I should probably test that first, but I'm on my iPhone right know... But I think I stumbled upon this when trying to get the font size of an element set in em.

Changed September 24, 2011 09:04PM UTC by tomgrohl comment:13

It has been found that it is an issue in other browsers, not just IE.

The problem is that the behaviour is not consistent, and would not be possible to fix.

Changed September 24, 2011 09:13PM UTC by dmethvin comment:14

Oh man this test was totally off base and I should have caught it.

First, there is no jQuery in the test case, it's got code snipped from places *inside* jQuery but nothing showing that jQuery is doing anything wrong in a real-life case.

Second, IE9 supports getComputedStyle so it doesn't even go through the currentStyle section of code -- another hazard of code clipping rather than a real test case.

Third, several browsers including Firefox and IE9 return fractional pixels from getComputedStyle and we appear to round properly to the nearest pixel when returning those values:

http://jsfiddle.net/tY8Cd/3/

So this ticket seems more like invalid or worksforme, there's nothing yet shown that needs fixing.

Changed September 25, 2011 08:04AM UTC by thomas.jaggi@gmail.com comment:15

Argh, sorry for wasting your time, I obviously didn't think that through.

Changed October 25, 2011 08:08PM UTC by addyosmani comment:16

keywords: needsdocs

Confirmed with timmywil we can remove the needsdocs on this one.