Bug 37901 – Allow styling of HTMLProgressElement.

• Component: DOM
• Status: RESOLVED FIXED

[Yael]

Users of the <progress> element should be able to customize the element if they wish.
A patch should be added shortly.

[Yael]

Created attachment 53908 [details]
Patch.

Added a new pseudo element to represent the value portion of the progress element.

[Yael]

Seems there is a problem in the style bot that causes it to mark the style check as failed.

[Kent Tamura]

Comment on attachment 53908 [details]
Patch.

Page authors can specify style for the existing form controls like:
    #input1 { border-color: red; }
Such style declarations automatically turn off -webkit-appearance. (See RenderTheme::isControlStyled and adjustStyle)
We should follow this for <progress> too.

Introducing -webkit-progress-bar-value and exposing it to page authors might be inevitable.

[Yael]

(In reply to comment #3)
> (From update of attachment 53908 [details])
> Page authors can specify style for the existing form controls like:
>     #input1 { border-color: red; }
> Such style declarations automatically turn off -webkit-appearance. (See
> RenderTheme::isControlStyled and adjustStyle)
> We should follow this for <progress> too.
> 
> Introducing -webkit-progress-bar-value and exposing it to page authors might be
> inevitable.

Thank you for the information , Kent.
I think there should be a decision if to require "-webkit-appearance: none;" or not. We don't want some elements to require it, and some not.

[Yael]

After thinking about this some more, I am not sure if it is a good idea.
People may want to set e.g. the width and the height of a <progress> element while keeping the look of a native widget (-webkit-appearance).
Maybe there are other styles that can be applied while keeping the look of a native widget, so where do you draw the line?

[Adele Peterson]

Each control makes that decision separately in the isControlStyled method in each RenderTheme class.

[Yael]

Created attachment 53979 [details]
Patch to add support in isControlStyled

Adding border and/or background would now automatically remove the -webkit-appearance from the progress bar.
Also updated the new test to test this behavior.

[Adele Peterson]

Comment on attachment 53979 [details]
Patch to add support in isControlStyled

Looks good!

[WebKit Commit Bot]

Comment on attachment 53979 [details]
Patch to add support in isControlStyled

Clearing flags on attachment: 53979

Committed r58228: <http://trac.webkit.org/changeset/58228>

[WebKit Commit Bot]

All reviewed patches have been landed.  Closing bug.