test_inherit_computation.html 7.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160
  1. <!DOCTYPE HTML>
  2. <html>
  3. <!--
  4. -->
  5. <head>
  6. <title>Test for computation of CSS 'inherit' on all properties and 'unset' on inherited properties</title>
  7. <script type="text/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
  8. <script type="text/javascript" src="property_database.js"></script>
  9. <style type="text/css" id="stylesheet"></style>
  10. <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
  11. </head>
  12. <body>
  13. <p id="display"><span id="fparent"><span id="fchild"></span></span></p>
  14. <div id="content" style="display: none">
  15. <div id="testnode"><span id="nparent"><span id="nchild"></span></span></div>
  16. </div>
  17. <pre id="test">
  18. <script class="testbody" type="text/javascript">
  19. /** Test for computation of CSS 'inherit' on all properties and 'unset' on
  20. inherited properties **/
  21. // elements without a frame
  22. var gNParent = document.getElementById("nparent");
  23. var gNChild = document.getElementById("nchild");
  24. // elements with a frame
  25. var gFParent = document.getElementById("fparent");
  26. var gFChild = document.getElementById("fchild");
  27. var gStyleSheet = document.getElementById("stylesheet").sheet;
  28. var gChildRule1 = gStyleSheet.cssRules[gStyleSheet.insertRule("#nchild, #fchild {}", gStyleSheet.cssRules.length)];
  29. var gChildRule2 = gStyleSheet.cssRules[gStyleSheet.insertRule("#nchild, #fchild {}", gStyleSheet.cssRules.length)];
  30. var gChildRule3 = gStyleSheet.cssRules[gStyleSheet.insertRule("#nchild.allother, #fchild.allother {}", gStyleSheet.cssRules.length)];
  31. var gChildRuleTop = gStyleSheet.cssRules[gStyleSheet.insertRule("#nchild, #nchild.allother, #fchild, #fchild.allother {}", gStyleSheet.cssRules.length)];
  32. var gParentRuleTop = gStyleSheet.cssRules[gStyleSheet.insertRule("#nparent, #fparent {}", gStyleSheet.cssRules.length)];
  33. var gTestUnset = SpecialPowers.getBoolPref("layout.css.unset-value.enabled");
  34. function get_computed_value_node(node, property)
  35. {
  36. var cs = getComputedStyle(node, "");
  37. return get_computed_value(cs, property);
  38. }
  39. function test_property(property)
  40. {
  41. var info = gCSSProperties[property];
  42. var keywords = ["inherit"];
  43. if (info.inherited && gTestUnset)
  44. keywords.push("unset");
  45. keywords.forEach(function(keyword) {
  46. if ("prerequisites" in info) {
  47. var prereqs = info.prerequisites;
  48. for (var prereq in prereqs) {
  49. gParentRuleTop.style.setProperty(prereq, prereqs[prereq], "");
  50. gChildRuleTop.style.setProperty(prereq, prereqs[prereq], "");
  51. }
  52. }
  53. if (info.inherited) {
  54. gParentRuleTop.style.setProperty(property, info.initial_values[0], "");
  55. var initial_computed_n = get_computed_value_node(gNChild, property);
  56. var initial_computed_f = get_computed_value_node(gFChild, property);
  57. gChildRule1.style.setProperty(property, info.other_values[0], "");
  58. var other_computed_n = get_computed_value_node(gNChild, property);
  59. var other_computed_f = get_computed_value_node(gFChild, property);
  60. isnot(other_computed_n, initial_computed_n,
  61. "should be testing with values that compute to different things " +
  62. "for '" + property + "'");
  63. isnot(other_computed_f, initial_computed_f,
  64. "should be testing with values that compute to different things " +
  65. "for '" + property + "'");
  66. gChildRule3.style.setProperty(property, keyword, "");
  67. gFChild.className="allother";
  68. gNChild.className="allother";
  69. var inherit_initial_computed_n = get_computed_value_node(gNChild, property);
  70. var inherit_initial_computed_f = get_computed_value_node(gFChild, property);
  71. is(inherit_initial_computed_n, initial_computed_n,
  72. keyword + " should cause inheritance of initial value for '" +
  73. property + "'");
  74. is(inherit_initial_computed_f, initial_computed_f,
  75. keyword + " should cause inheritance of initial value for '" +
  76. property + "'");
  77. gParentRuleTop.style.setProperty(property, info.other_values[0], "");
  78. var inherit_other_computed_n = get_computed_value_node(gNChild, property);
  79. var inherit_other_computed_f = get_computed_value_node(gFChild, property);
  80. is(inherit_other_computed_n, other_computed_n,
  81. keyword + " should cause inheritance of other value for '" +
  82. property + "'");
  83. is(inherit_other_computed_f, other_computed_f,
  84. keyword + " should cause inheritance of other value for '" +
  85. property + "'");
  86. gParentRuleTop.style.removeProperty(property);
  87. gChildRule1.style.removeProperty(property);
  88. gChildRule3.style.setProperty(property, info.other_values[0], "");
  89. gFChild.className="";
  90. gNChild.className="";
  91. } else {
  92. gParentRuleTop.style.setProperty(property, info.other_values[0], "");
  93. var initial_computed_n = get_computed_value_node(gNChild, property);
  94. var initial_computed_f = get_computed_value_node(gFChild, property);
  95. var other_computed_n = get_computed_value_node(gNParent, property);
  96. var other_computed_f = get_computed_value_node(gFParent, property);
  97. isnot(other_computed_n, initial_computed_n,
  98. "should be testing with values that compute to different things " +
  99. "for '" + property + "'");
  100. isnot(other_computed_f, initial_computed_f,
  101. "should be testing with values that compute to different things " +
  102. "for '" + property + "'");
  103. gChildRule2.style.setProperty(property, keyword, "");
  104. var inherit_other_computed_n = get_computed_value_node(gNChild, property);
  105. var inherit_other_computed_f = get_computed_value_node(gFChild, property);
  106. is(inherit_other_computed_n, other_computed_n,
  107. keyword + " should cause inheritance of other value for '" +
  108. property + "'");
  109. is(inherit_other_computed_f, other_computed_f,
  110. keyword + " should cause inheritance of other value for '" +
  111. property + "'");
  112. gParentRuleTop.style.removeProperty(property);
  113. gChildRule1.style.setProperty(property, info.other_values[0], "");
  114. var inherit_initial_computed_n = get_computed_value_node(gNChild, property);
  115. var inherit_initial_computed_f = get_computed_value_node(gFChild, property);
  116. is(inherit_initial_computed_n, initial_computed_n,
  117. keyword + " should cause inheritance of initial value for '" +
  118. property + "'");
  119. is(inherit_initial_computed_f, initial_computed_f,
  120. keyword + " should cause inheritance of initial value for '" +
  121. property + "'");
  122. gParentRuleTop.style.removeProperty(property);
  123. gChildRule1.style.removeProperty(property);
  124. gChildRule2.style.removeProperty(property);
  125. }
  126. if ("prerequisites" in info) {
  127. var prereqs = info.prerequisites;
  128. for (var prereq in prereqs) {
  129. gParentRuleTop.style.removeProperty(prereq);
  130. gChildRuleTop.style.removeProperty(prereq);
  131. }
  132. }
  133. });
  134. }
  135. for (var prop in gCSSProperties) {
  136. var info = gCSSProperties[prop];
  137. gChildRule3.style.setProperty(prop, info.other_values[0], "");
  138. }
  139. for (var prop in gCSSProperties)
  140. test_property(prop);
  141. </script>
  142. </pre>
  143. </body>
  144. </html>