1521619 - htmlelement.style.background returning longhand notation not shorthand.

Status: RESOLVED DUPLICATE of bug 1134171

(Core :: DOM: CSS Object Model, defect, P2)

Description

[Matthew.b.Fallon]

User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:64.0) Gecko/20100101 Firefox/64.0

Steps to reproduce:

I've created a quick codepen that can be opened in the current Firefox browser to display the exact problem. I tested this and found the issue present on Firefox on both Windows and Fedora. here is the link:
https://codepen.io/matthewfallon/pen/XOWroj?editors=0010

Actual results:

The issue is with the way that javascript DOM manipulation saves to and reads from the htmlelement.style.background property. If this property is set through css or HTML the property seems to return correctly, however, if this property is edited directly by javascript through the DOM it saves and then returns the string representation of this property as the longhand rather than the shorthand form. This bug was actually discovered by the instructor of a Udemy course teaching about DOM manipulations as an issue present only for Firefox users, not Chrome users.

Expected results:

https://www.w3.org/TR/DOM-Level-2-Style/css.html#CSS-ElementCSSInlineStyle

As stated in the W3C specification, all style properties should return in the shortest possible form, I've only tested and found a bug in the background shorthand property, but there may be issues with other shorthand properties like this. It may be better practice to grab a more specific variable for a CSS style property rather than the shorthand property, but this property would still be better off returning as expected.

Thank you for taking the time to read through this, I appreciate it,
Matthew Fallon

Comment 1

[Emilio Cobos Álvarez [:emilio]]

See bug 1134171. I'm happy to mentor that one or what not. I think it should be an easy bug to fix, it's a matter of skipping default values.