line-height.html | Explore in Territory

<!DOCTYPE html>
<html>
<head>
<script src='../../resources/testharness.js'></script>
<script src='../../resources/testharnessreport.js'></script>
</head>
<body>
<div id='testElement'></div>

<script>

testElement.style.lineHeight = '10px';
testElement.style.fontSize = '100px';

var computedStyleMap = testElement.computedStyleMap();

test(function() {
  var result = computedStyleMap.get('line-height');
  assert_equals(result.constructor.name, CSSUnitValue.name);
  assert_equals(result.toString(), '10px');
}, 'Getting a 10px lineHeight results in a CSSUnitValue');

test(function() {
  testElement.style.lineHeight = '20px';
  var result = computedStyleMap.getAll('line-height');
  assert_equals(result.length, 1);
  assert_equals(result[0].toString(), '20px');
}, 'getAll for lineHeight returns a single value');

test(function() {
  testElement.style.lineHeight = '10%';
  var result = computedStyleMap.get('line-height');
  assert_equals(result.constructor.name, CSSUnitValue.name);
  assert_equals(result.toString(), '10px');
}, 'Getting a 10% lineHeight results in a px CSSUnitValue');

test(function() {
  testElement.style.lineHeight = '0.2';
  var result = computedStyleMap.get('line-height');
  assert_equals(result.constructor.name, CSSUnitValue.name);
  assert_equals(result.toString(), '0.2');
}, 'Getting a number lineHeight results in a number CSSUnitValue');

test(function() {
  testElement.style.lineHeight = 'calc(10px + 10%)';
  var result = computedStyleMap.get('line-height');
  assert_equals(result.constructor.name, CSSUnitValue.name);
  assert_equals(result.toString(), '20px');
}, 'Getting a calc lineHeight results in a px CSSUnitValue');

test(function() {
  testElement.style.lineHeight = 'normal';
  var result = computedStyleMap.get('line-height');
  assert_equals(result.constructor.name, CSSKeywordValue.name);
  assert_equals(result.toString(), 'normal');
}, 'Getting a normal lineHeight results in a CSSKeywordValue');

</script>
</body>
</html>
chromium/third_party/blink/web_tests/typedcssom/computedstyle/line-height.html
