inherit within @apply definitions gets overriden by User-Agent styles

[nazar-pc]

Description

inherit within @apply definitions gets overriden by User-Agent styles, which didn't happen in Polymer 1.x with full WebComponents v0 polyfill (and without it in Chromium), but now happens in Polymer 2.0 and WebCmponents v1 lite.

Live Demo

https://jsbin.com/guwinowudo/edit?html,output

Steps to Reproduce

1. Define @apply definition with font-family set to inherit
2. Speficy non-default font-family for body
3. Use @apply rule in element in ::slotted(button)

Expected Results

inherit effectively applies body's font-family

Actual Results

User-Agent's font-family has higher specificity, actual font-family is shown as apply-shim-inherit in Dev Tools in both tested browsers.

Browsers Affected

Only tested in these:

• Chromium nightly
• Firefox

Versions

Polymer: 2.0-preview

[nazar-pc]

@azakus, this is a major bug for me, especially considering 1.0.0 being just released.
Can you take a look at this and assign a priority at least?

[nazar-pc]

@sorvell, can you as the author of the first commit introducing

shadycss/src/apply-shim.js

Lines 321 to 326 in b971067

	// inherit
	// with this purposfully illegal value, the variable will be invalid at
	// compute time (https://www.w3.org/TR/css-variables/#invalid-at-computed-value-time)
	// and for inheriting values, will behave similarly
	// we cannot support the same behavior for non inheriting values like 'border'
	value = 'apply-shim-inherit';

explain what is going on and why? Comment doesn't tell me anything useful.

Native @apply implementation in Chromium works fine, but when including apply-shim on the page it breaks.

[nazar-pc]

Related to Polymer/polymer#4282, originated from Polymer/polymer#3824 and sadly _replaceInitialOrInherit is not covered by any tests, I can just remove contents of the function and all the tests are fine:(

Dropping the lines linked above fixes the issue, but I'm not sure it doesn't break anything.

[nazar-pc]

Ping here, almost 3 months my fonts are broken because of this

[nazar-pc]

@sorvell , can you take a look at this any time soon?

[dfreedm]

This looks like the same issue as http://crbug.com/888965

[dfreedm]

@nazar-pc I apologize for the delay on handling this issue.

The deprecation of @apply as a specification has left the ApplyShim in a deprecated, critical maintenance only state, and I haven't been keeping a good track of these issues.