<!DOCTYPE HTML>

<html>
<head>
<style>
  body {
      font-family: sans-serif;
      font-size: 0.8em;
  }

  code {
      font-family: workaround, monospace;
  }

  .heading {
      background: #eee;
      font-weight: bold;
  }
</style>
</head>
<body>
  <p>For each input on the left, this table lists what happens when you
pass it into a CSS property and retrieve its value back. The third column
indicates whether the value was round-tripped faithfully.</p>

<div id='test'></div>
<table id='table'>
</table>

<script>
if (window.testRunner)
  testRunner.dumpAsText();

var table = document.getElementById('table');
var div = document.getElementById('test');

function heading(text) {
    var tr = document.createElement('tr');
    tr.className = 'heading';
    var td = document.createElement('td');
    td.colSpan = 3;
    td.align = 'center'
    td.appendChild(document.createTextNode(text));
    tr.appendChild(td);

    table.appendChild(tr);
}

function evaluate(code) {
    var result = eval(code);
    var tr = document.createElement('tr');

    var td = document.createElement('td');
    var text = document.createElement('code');
    text.appendChild(document.createTextNode(code));
    td.appendChild(text);
    tr.appendChild(td);

    div.style.opacity = eval(code);

    var td = document.createElement('td');
    var text = document.createElement('code');
    text.appendChild(document.createTextNode(div.style.opacity));
    td.appendChild(text);
    tr.appendChild(td);

    var outValue = div.style.opacity;
    // Test round-tripping
    div.style.opacity = 0;
    div.style.opacity = outValue;

    var td = document.createElement('td');
    var text = document.createElement('span');
    text.appendChild(document.createTextNode(outValue == div.style.opacity ? "pass" : "fail"));
    td.appendChild(text);
    tr.appendChild(td);

    table.appendChild(tr);
}

heading("Basic floats");
evaluate("'0.0001'");
evaluate("0.0001");
evaluate("'123456.123456'");
evaluate("'1234567.1234567'");
evaluate("'12345678.12345678'");

heading("Trailing zeros");
evaluate("'0.00100000'");
evaluate("'0.001000001'");
evaluate("'0.12345000001'");
evaluate("'0.12304567'");
evaluate("'0.12340567'");
evaluate("'0.12345067'");
evaluate("'0.12345607'");
evaluate("'0.12345670'");

heading("Repeating decimals");
evaluate("1/3");
evaluate("123 + 1/3");
evaluate("13/99");
evaluate("123 + 13/99");
evaluate("100/999");
evaluate("123 + 100/999");

heading("Large numbers");
evaluate("12345678");
evaluate("123456789");
evaluate("1234567890");
evaluate("12345678901");
evaluate("123456789012");
evaluate("1234567890123");
evaluate("12345678901234");
evaluate("123456789012345");
evaluate("1234567890123456");
evaluate("12345678901234567");

heading("Weird numbers");
evaluate("Number.NaN");
evaluate("1/0");
evaluate("Math.sqrt(-1)");
evaluate("1/0.9999");
evaluate("1/0.99999");
evaluate("1/0.999999");
evaluate("1/0.9999999");
evaluate("1/0.99999999");

</script>
</body>
</html>