Nested custom properties with preserve false does not work correctly

[Dai7Igarashi]

In fallback pattern using "preserve: false", custom properties remain and "root" is deleted, so it can't check the custom properties like below.

[preserve: false]

▼ before
:root {
  --my-blue: blue;
}

// "--my-red" does not exist
.sample {
  color: var(--my-red, var(--my-blue))
}

▼ after
.sample {
  color: var(--my-blue) <-- can't resolve the custom properties
}

if "preserve: true", it's ok.

[preserve: true]

▼ before
:root {
  --my-blue: blue;
}

// "--my-red" does not exist
.sample {
  color: var(--my-red, var(--my-blue))
}

▼ after
:root {
  --my-blue: blue;
}
.sample {
  color: var(--my-blue) <-- it can resolve the custom properties
}

[msereniti]

Upvote this issue