test20.html 3.7 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798
  1. <!DOCTYPE html>
  2. <html lang="en-us">
  3. <head>
  4. <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  5. <title>Test 020</title>
  6. <script>
  7. var Hyphenopoly = {
  8. require: {
  9. "de": "FORCEHYPHENOPOLY",
  10. "en-us": "FORCEHYPHENOPOLY"
  11. },
  12. setup: {
  13. selectors: {
  14. ".hyphenate": {
  15. hyphen: "•"
  16. }
  17. }
  18. },
  19. handleEvent: {
  20. hyphenopolyEnd: function (e) {
  21. assert();
  22. }
  23. }
  24. };
  25. function assert() {
  26. var tests = 4;
  27. var i = 1;
  28. var test = "";
  29. var ref = "";
  30. var result = false;
  31. while (i <= tests) {
  32. test = document.getElementById("test" + i).innerHTML;
  33. ref = document.getElementById("ref" + i).innerHTML;
  34. if (test === ref) {
  35. document.getElementById("result").innerHTML += "<span style=\"background-color: #d6ffd6\">" + (function (i) {
  36. return (i < 10) ? "0" + i : i;
  37. }(i)) + "</span> ";
  38. result = result || true;
  39. } else {
  40. document.getElementById("result").innerHTML += "<span style=\"background-color: #ffd6d6\">" + (function (i) {
  41. return (i < 10) ? "0" + i : i;
  42. }(i)) + "</span> ";
  43. result = result || false;
  44. }
  45. i += 1;
  46. }
  47. if (parent != window) {
  48. parent.postMessage(JSON.stringify({
  49. desc: document.getElementById("desc").innerHTML,
  50. index: 20,
  51. result: (result ? "passed" : "failed")
  52. }), window.location.href);
  53. }
  54. }
  55. </script>
  56. <script src="../Hyphenopoly_Loader.js"></script>
  57. <style type="text/css">
  58. body {
  59. width:50%;
  60. margin-left:25%;
  61. margin-right:25%;
  62. }
  63. .test {
  64. background-color: #D8E2F9;
  65. }
  66. .ref {
  67. background-color: #FEEFC0;
  68. }
  69. .hyphenate {
  70. hyphens: auto;
  71. -ms-hyphens: auto;
  72. -moz-hyphens: auto;
  73. -webkit-hyphens: auto;
  74. }
  75. </style>
  76. </head>
  77. <body>
  78. <div id="navigate"><a href="index.html">&Larr;&nbsp;Index</a>&nbsp;|&nbsp;<a href="test19.html">&larr;&nbsp;Prev</a>&nbsp;|&nbsp;<a href="test21.html">Next&nbsp;&rarr;</a></div>
  79. <h1>Test 020</h1>
  80. <p id="desc">Inherit language</p>
  81. <div id="result"></div>
  82. <hr>
  83. <p id="test1" class="test hyphenate">exception</p>
  84. <p id="ref1" class="ref">ex•cep•tion</p>
  85. <p id="test2" class="test hyphenate" lang="de"><span>beinhalten</span></p>
  86. <p id="ref2" class="ref" lang="de"><span>be•inhal•ten</span></p>
  87. <p id="test3" class="test hyphenate" lang="de"><span lang="en-us">exception</span></p>
  88. <p id="ref3" class="ref" lang="de"><span lang="en-us">ex•cep•tion</span></p>
  89. <p id="test4" class="test hyphenate"><span>exception</span></p>
  90. <p id="ref4" class="ref"><span>ex•cep•tion</span></p>
  91. <hr>
  92. <div><span class="test">Test</span> <span class="ref">Ref</span></div>
  93. </body>
  94. </html>