Bug 14646 – WebKit border radius properties are unavailable via JavaScript

• Status: RESOLVED
• Resolution: FIXED
• Component: CSS

[David Harrison]

* SUMMARY
Webkit-specific CSS properties such as  -webkit-border-top-right-radius (whether set via shorthand or not) are not retrievable in the DOM. They can be set in the DOM, but their computed style values cannot be retrieved.

* STEPS TO REPRODUCE
See attached zipfile containing a webkit.html demo file of the problem (see source for specifics of how the calls are made), along with a jQuery .js file and a .css file for some basic styling as taken from the dev page I discovered the bug on.

* RESULTS
Using the DOM to retrieve the computed style of these properties returns null.  
EXPECTED: the computed style value should be returned.

* NOTES
Tested in the latest nightly of Webkit (July 14, 2007)

[David Harrison]

Created attachment 15548 [details]
test case

Attached webkit-test.zip

rdar://5340449

[Sam Weinig]

One of the issues that needs to be assessed first is how we want to represent the computed value of a border-radius.  Should we always return a pair?  Should we we only return 1 value if the vertical and horizontal values are the same?

[Faruk Ates]

Sam, how shorthands are to be treated is a separate issue. When making a call to retrieve the computed style of -webkit-border-top-right-radius  (i.e. a non-shorthand, explicit property), it still returns null, when the value is a very simple, straightforward "50px" for instance. 

[Sam Weinig]

Faruk, the value of -webkit-border-top-right-radius is actually not that simple as it is a pair of two values, width and height radii for that corner.  So if you wanted an oblong corner you could use -webkit-border-top-right-radius: 10px 20px;.  That said, I have a fix that returns a primitive value if the width and height are equal and Pair if they differ.  I will post the patch shortlty. 

[Sam Weinig]

Created attachment 15573 [details]
patch

[Sam Weinig]

Created attachment 15574 [details]
patch

[Sam Weinig]

Created attachment 15575 [details]
patch

[Sam Weinig]

Landed in r24436.

[Faruk Ates]

Sam, fantastic, thanks! I didn't know that oblong corners were supported, that's very cool.

[Sam Weinig]

Landed update to the patch in r24486 which uses a CSSValueList instead of a CSSPrimitiveValue with a Pair for radii with unique values.