1158383 - webkit gradient background conversion fails at http://www.daily.co.jp/

Status: RESOLVED DUPLICATE of bug 1132748

(Core :: CSS Parsing and Computation, defect)

Description

[Mike Taylor [:miketaylr]]

STR:

1) With a CSS unprefixing build that has the whitelist disabled (see [1]), visit http://www.daily.co.jp/

Expected: The smartphone banner with the text "スマートフォン版を見る" (up top) has a yellow gradient bg

Actual: It's white.

CSS in question, from style.2.2.4.css:

/*-------sp版ボタン-------*/
#spbtn_show{
	background: -webkit-gradient(linear, left top, left bottom, from(#fffc0a), to(#fedf25));
	padding: 15px 0;
	text-align: center;
	font-size: 42px;
	font-weight: bold;
	display: block; 
	width:100%;
}


[1] https://treeherder.mozilla.org/#/jobs?repo=try&revision=9cd5527b9aa0


I didn't look too closely--I'm having trouble getting my build to talk to devtools right now.

Comment 1

[Hallvord R. M. Steen [:hallvors]]

I think we have postphoned adding the actual gradient rewrite implementation.. The infrastructure code is there but not the JS that will handle the real tricky parts. See http://mxr.mozilla.org/mozilla-central/source/layout/style/CSSUnprefixingService.js and note the absence of the word 'gradient'.

Comment 2

[Hallvord R. M. Steen [:hallvors]]

Hm.. dependency should be a different bug and the other way around: this bug depends on bug 1132748..

Comment 3

[Karl Dubost💡 :karlcow]

It's happening here too.
https://webcompat.com/issues/937

with
header #form0 input[type="submit"] {
    border: #fc7480 solid 1px;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fea8af), color-stop(0.1, #fec3c8), color-stop(0.13, #fec3c8), color-stop(0.3, #fea8af), color-stop(0.9, #fe9ea6), color-stop(1, #fec3c8));
    -webkit-box-shadow: : 0 0 3px #fea8af;
    box-shadow: 0 0 3px #fea8af;
    width: 25%;
    text-align: center;
    border-radius: 5px;
    color: #FFF;
    font-weight: bold;
    font-size: 14px;
    margin: 1em 0 1.3em;
    text-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
    padding: 0.35em 0;
}

Comment 4

[Mike Taylor [:miketaylr]]

> I think we have postphoned adding the actual gradient rewrite implementation

Oh yeah, I forgot about that bug.

Comment 5

[Daniel Holbert [:dholbert]]

I can try to get bug 1132748 (gradient rewriting) fixed this week.

Comment 6

[Daniel Holbert [:dholbert]]

I'm duping this to bug 1132748 (the gradient unprefixing impl).

I verified that my local mozilla-inbound build successfully renders the yellow gradient up top (and it renders it as white instead, if I toggle layout.css.unprefixing-service.enabled to false, which confirms that the unprefixing service is responsible).