Created attachment 438447 [details] html file demonstrating the issue this css: --v0: 50px; border-radius: var(--v0); is rendered correctly, but in JavaScript the value of [style].style.borderRadius is "".
these properties exhibit the same quirk: border-block-width border-inline-width perspective-origin
<rdar://problem/83482301>
Created attachment 440324 [details] Patch
Comment on attachment 440324 [details] Patch View in context: https://bugs.webkit.org/attachment.cgi?id=440324&action=review > Source/WebCore/css/StyleProperties.cpp:149 > if (shorthand.length() && is<CSSPendingSubstitutionValue>(getPropertyCSSValue(shorthand.properties()[0]))) > - return String(); > + return downcast<CSSPendingSubstitutionValue>(*getPropertyCSSValue(shorthand.properties()[0])).shorthandValue().cssText(); Can we avoid repeating getPropertyCSSValue(shorthand.properties()[0])?
Created attachment 440439 [details] Patch
Comment on attachment 440439 [details] Patch View in context: https://bugs.webkit.org/attachment.cgi?id=440439&action=review > Source/WebCore/css/StyleProperties.cpp:162 > + return downcast<CSSPendingSubstitutionValue>(*getPropertyCSSValue(shorthand.properties()[0])).shorthandValue().cssText(); I don't understand the [0] here. What if you have something like element { border-top-left-radius: var(--a); border-top-right-radius: var(--b); border-bottom-right-radius: var(--c); border-bottom-left-radius: var(--d); } element.style.getPropertyValue("border-radius") This code would appear to return var(--a), but that doesn't seem right. Am I misunderstanding the code? Or maybe the spec says that [0] is the correct behavior?
> This code would appear to return var(--a), but that doesn't seem right. Am I > misunderstanding the code? Or maybe the spec says that [0] is the correct > behavior? So this return is only used if all longhand are pending substitution from a variable set by the shorthand (ie. border-radius: var(--a)), so using [0] doesn't matter as all longhand values are the same.
Created attachment 442756 [details] Patch
Comment on attachment 442756 [details] Patch View in context: https://bugs.webkit.org/attachment.cgi?id=442756&action=review > Source/WebCore/ChangeLog:10 > + Return correct string for shorthand CSS values set by var. Add extra checks for if all > + longhand properties are pending values and if the requested shorthand property was set > + to a variable. Can we put this check into a separate function rather than making StyleProperties::getPropertyValue so long?
Created attachment 442760 [details] fix shorthand property set to var bug
Created attachment 442767 [details] fix shorthand property set to var bug
Committed r285015 (243659@main): <https://commits.webkit.org/243659@main> All reviewed patches have been landed. Closing bug and clearing flags on attachment 442767 [details].
*** Bug 225209 has been marked as a duplicate of this bug. ***
*** Bug 225206 has been marked as a duplicate of this bug. ***