declaring variable as in postcss-preset-env example not working

[zanona]

Under https://preset-env.cssdb.org/features#custom-properties
we have the following example:

img {
  --some-length: 32px;

  height: var(--some-length);
  width: var(--some-length);
}

Although this doesn't seem to work and variables are not rewritten.
The only way to get this working was to define the variable under :root?

Perhaps I am missing something or can the example listed indeed be achieved?
Thanks

[masi]

Looks like the plugin only supports variables within :root. According to the spec some more matchings would work. Of course their are meant to be applied directly one the DOM, but actually they should work to some extent:

:root { --color: blue; }
div { --color: green; }
#alert { --color: red; }
* { color: var(--color); }
div.g { color: var(--color); }
#alert { color: var(--color); }

:root:lang(en) {--external-link: "external link";}
:root:lang(de) {--external-link: "externer Link";}
a[href^="http"]::after {content: " (" var(--external-link) ")"}

Expected:

* {
  color: blue; }

div.g {
  color: green; }

#alert {
  color: red; }

a[href^="http"]:lang(en)::after {
  content: " (external link)"; }

a[href^="http"]:lang(de)::after {
  content: " (externer Link)"; }

Actual:

* {
  color: blue; }

div.g {
  color: blue; }

#alert {
  color: blue; }

a[href^="http"]::after {
  content: " (" var(--external-link) ")"; }

[Semigradsky]

@masi see the old version of README - https://github.com/postcss/postcss-custom-properties/tree/cdb1fb0b415fd14f1f78361274f7667d4d7640f7#notes

The transformation of Custom Properties done by this plugin is not complete
and cannot be because dynamic cascading variables based on custom
properties relies on the DOM tree. Since we do not know the DOM in the context
of this plugin, we cannot produce safe output. This plugin currently aims to
provide a future-proof way of using a limited subset of the features
provided by native CSS custom properties.

Looks like this explanation was removed in this commit 6ef218d
@jonathantneal could you return this and maybe move it to top of README for making it more noticeable for users?

[masi]

Perhaps the note could be extended to what subset is supported. I reckon only definition within :root works.
Nice would be if pseudo classes on :root would work as well:

:root:lang(en) {}
:root:link {}

[Semigradsky]

This has been described previously...

N.B. The transformation is not complete. It currently just aims to provide a future-proof way of using a limited subset (to top-level :root selector) of the features provided by native CSS custom properties.
Read #1 & #9 to know why this limitation exists.

[Semigradsky]

Works as expected. Note was added to README