The #createNode function wasn't adding attribute if they were empty, meaning that the data-variable-computed attribute wouldn't be set for empty computed value (which are stil valid). Note that this doesn't look great in the tooltip at the moment, we may display empty values differently in Bug 1912267. Differential Revision: https://phabricator.services.mozilla.com/D218849
32 lines
782 B
HTML
32 lines
782 B
HTML
<!-- Any copyright is dedicated to the Public Domain.
|
|
http://creativecommons.org/publicdomain/zero/1.0/ -->
|
|
<html>
|
|
<head>
|
|
<title>variables test</title>
|
|
|
|
<style>
|
|
* {
|
|
--color: tomato;
|
|
--bg: violet;
|
|
--empty: ;
|
|
--nested: var(--color);
|
|
--theme-color: light-dark(var(--color), var(--bg));
|
|
--nested-with-function: var(--theme-color);
|
|
--nested-with-empty: var(--empty);
|
|
}
|
|
|
|
div {
|
|
--color: chartreuse;
|
|
color: var(--color, red);
|
|
background: var(--nested-with-empty);
|
|
background-color: var(--not-set, var(--bg));
|
|
outline-color: var(--nested);
|
|
border-color: var(--nested-with-function);
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div id="target" style="--bg: seagreen;"> the ocean </div>
|
|
</body>
|
|
</html>
|