whatwg/compat

The value definition of `-webkit-background-clip` is missing `none`

cdoublev opened this issue · 9 comments

The initial value of -webkit-background-clip is none but it is missing from its value definition.

Name: -webkit-background-clip
Value: border-box | padding-box | content-box | text
Initial: none

Checking the CSS spec for it, which is introducing text.
https://drafts.csswg.org/css-backgrounds-4/#background-clip

w3c/csswg-drafts#5604

@cdoublev What do you suggest?

We might possibly remove the -webkit-background-clip: text let's open an issue about that.

I open #195 for comment #12

Honestly I was only concerned about automatic parsing of value definitions: I should be able to successfully parse none against the value definition field.

In Chrome:

element.style.webkitBackgroundClip = 'initial'
console.log(getComputedStyle(target).webkitBackgroundClip) // 'border-box'

I think it should have been border-box, like for background-clip.

If background-clip and -webkit-background-clip should have the same value space, as noted in w3c/csswg-drafts#5604, then I'm fine with closing this issue and just ignore this property (eg. when processing extracts from @webref/css) until it is removed from Compat or defined as a legacy name alias for all its values.

Ah! That makes sense. So yes either way we will be deleting the text (#195) or I'll make a PR to edit the value.
Note that for the automatic parsing https://drafts.csswg.org/css-backgrounds-4/#background-clip should give you what you need?

Yes, Chrome and Firefox (not checked in other browsers) already parse -webkit-background-clip as a legacy name alias of background-clip with the value space from CSS Backgrounds 4, which accepts a list of values whereas the value space from Compat does not.

style.webkitBackgroundClip = 'text, padding-box'
console.log(style.webkitBackgroundClip) // 'text, padding-box'
console.log(style.backgroundClip) // 'text, padding-box'
style.webkitBackgroundClip = 'none'
console.log(style.webkitBackgroundClip) // 'text, padding-box'

@karlcow should we close here?

yes :)