add-new-custom-property-to-rule.html

<!DOCTYPE html>
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<meta charset="UTF-8">

<style>
#test1 {
  --camelCase: green;
  color: var(--camelCase);
}
#test2 {
  --weight: 100px;
  font-size: 20px;
}
#test3 {
  
}
</style>

<div id="test1"></div>
<div id="test2"></div>
<div id="test3"></div>

<script>
test(function() {
  test1.style = "background: var(--camelCase);"
  assert_equals(test1.style.color, test1.style.backgroundColor);
  test2.style.fontSize = "var(--weight)";
  assert_equals(test2.style.fontSize, "var(--weight)");
}, "Test adding a new custom property to a rule");
</script>

chromium/third_party/blink/web_tests/fast/css/variables/add-new-custom-property-to-rule.html