[css-houdini-drafts] Observer for property being applied?

LeaVerou has just created a new issue for https://github.com/w3c/css-houdini-drafts:

== Observer for property being applied? ==
Apologies if there's already a draft for this, I haven't been fully keeping up with Houdini. I did look though :)

People often use custom properties to invent their own DSL for augmenting existing HTML elements.
Some examples:

http://endtwist.github.io/kerning.js/
https://plugins.mavo.io/plugin/importhtml
https://tilemill-project.github.io/tilemill/docs/manual/carto/
and many more

However, this is really difficult right now even if properly using `--` Custom Properties because there's no way to react to when these properties are applied to an element.

The only way to get them to have any nontrivial effect is to either:
- Get all elements in the page, get their computed style, check if the property applies
- Get all selectors in all stylesheets that use this custom property, join them with commas, and make one giant `querySelectorAll()` query.

Not only are both these approaches terrible, but even with them, there's no way to react to changes, e.g. when a pseudo-class applies.

It would be great to have an observer for this, even if it only worked with custom properties (perhaps only defined custom properties?).

Please view or discuss this issue at https://github.com/w3c/css-houdini-drafts/issues/555 using your GitHub account

Received on Saturday, 6 January 2018 03:31:18 UTC