TooltipPositionOptionSpec.js 5.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194
  1. /*
  2. *************************
  3. tooltip_position Option Test
  4. *************************
  5. */
  6. describe("'tooltip_position' Option tests", function() {
  7. var testSlider;
  8. afterEach(function() {
  9. if(testSlider) {
  10. testSlider.destroy();
  11. testSlider = null;
  12. }
  13. });
  14. describe("vertical slider tests", function() {
  15. it("should be aligned to the left of the handle if set to 'left'", function() {
  16. // Create slider
  17. testSlider = new Slider("#testSlider1", {
  18. min: 0,
  19. max: 10,
  20. value: 5,
  21. tooltip_position: "left",
  22. orientation: "vertical"
  23. });
  24. // Extract needed references/values
  25. var mainTooltipHasClassLeft = testSlider.tooltip.classList.contains("left");
  26. // Assert
  27. expect(mainTooltipHasClassLeft).toBeTruthy();
  28. expect(testSlider.tooltip.style.right).toBe("100%");
  29. });
  30. it("should be aligned to the right of the handle if set to 'right'", function() {
  31. // Create slider
  32. testSlider = new Slider("#testSlider1", {
  33. min: 0,
  34. max: 10,
  35. value: 5,
  36. tooltip_position: "right",
  37. orientation: "vertical"
  38. });
  39. // Extract needed references/values
  40. var mainTooltipHasClassRight = testSlider.tooltip.classList.contains("right");
  41. // Assert
  42. expect(mainTooltipHasClassRight).toBeTruthy();
  43. expect(testSlider.tooltip.style.left).toBe("100%");
  44. });
  45. it("should default to 'right' if tooltip_position set to 'top'", function() {
  46. // Create slider
  47. testSlider = new Slider("#testSlider1", {
  48. min: 0,
  49. max: 10,
  50. value: 5,
  51. tooltip_position: "top",
  52. orientation: "vertical"
  53. });
  54. // Extract needed references/values
  55. var mainTooltipHasClassRight = testSlider.tooltip.classList.contains("right");
  56. // Assert
  57. expect(mainTooltipHasClassRight).toBeTruthy();
  58. expect(testSlider.tooltip.style.left).toBe("100%");
  59. });
  60. it("should default to 'right' if tooltip_position set to 'bottom'", function() {
  61. // Create slider
  62. testSlider = new Slider("#testSlider1", {
  63. min: 0,
  64. max: 10,
  65. value: 5,
  66. tooltip_position: "bottom",
  67. orientation: "vertical"
  68. });
  69. // Extract needed references/values
  70. var mainTooltipHasClassRight = testSlider.tooltip.classList.contains("right");
  71. // Assert
  72. expect(mainTooltipHasClassRight).toBeTruthy();
  73. expect(testSlider.tooltip.style.left).toBe("100%");
  74. });
  75. });
  76. describe("horizontal slider tests", function() {
  77. it("should be aligned above the handle if set to 'top'", function() {
  78. // Create slider
  79. testSlider = new Slider("#testSlider1", {
  80. min: 0,
  81. max: 10,
  82. value: 5,
  83. tooltip_position: "top",
  84. orientation: "horizontal"
  85. });
  86. // Extract needed references/values
  87. var mainTooltipHasClassTop = testSlider.tooltip.classList.contains("top");
  88. // Assert
  89. expect(mainTooltipHasClassTop).toBeTruthy();
  90. expect(testSlider.tooltip.style.top).toBe("");
  91. });
  92. it("should be aligned below the handle if set to 'bottom'", function() {
  93. // Create slider
  94. testSlider = new Slider("#testSlider1", {
  95. min: 0,
  96. max: 10,
  97. value: 5,
  98. tooltip_position: "bottom",
  99. orientation: "horizontal"
  100. });
  101. // Extract needed references/values
  102. var mainTooltipHasClassTop = testSlider.tooltip.classList.contains("bottom");
  103. // Assert
  104. expect(mainTooltipHasClassTop).toBeTruthy();
  105. expect(testSlider.tooltip.style.top).toBe("22px");
  106. });
  107. it("should be aligned below the handle if set to 'bottom' for range", function() {
  108. // Create slider
  109. testSlider = new Slider("#testSlider1", {
  110. min: 0,
  111. max: 20,
  112. value: [0, 10],
  113. range: true,
  114. tooltip_position: "bottom",
  115. orientation: "horizontal"
  116. });
  117. // Extract needed references/values
  118. var mainTooltipHasClassTopMin = testSlider.tooltip_min.classList.contains("bottom");
  119. var mainTooltipHasClassTopMax = testSlider.tooltip_max.classList.contains("bottom");
  120. // Assert
  121. expect(mainTooltipHasClassTopMin).toBeTruthy();
  122. expect(mainTooltipHasClassTopMax).toBeTruthy();
  123. expect(testSlider.tooltip_min.style.top).toBe("22px");
  124. expect(testSlider.tooltip_max.style.top).toBe("22px");
  125. });
  126. it("should default to 'top' if tooltip_position set to 'left'", function() {
  127. // Create slider
  128. testSlider = new Slider("#testSlider1", {
  129. min: 0,
  130. max: 10,
  131. value: 5,
  132. tooltip_position: "left",
  133. orientation: "horizontal"
  134. });
  135. // Extract needed references/values
  136. var mainTooltipHasClassTop = testSlider.tooltip.classList.contains("top");
  137. // Assert
  138. expect(mainTooltipHasClassTop).toBeTruthy();
  139. expect(testSlider.tooltip.style.top).toBe("");
  140. });
  141. it("should default to 'top' if tooltip_position set to 'right'", function() {
  142. // Create slider
  143. testSlider = new Slider("#testSlider1", {
  144. min: 0,
  145. max: 10,
  146. value: 5,
  147. tooltip_position: "right",
  148. orientation: "horizontal"
  149. });
  150. // Extract needed references/values
  151. var mainTooltipHasClassTop = testSlider.tooltip.classList.contains("top");
  152. // Assert
  153. expect(mainTooltipHasClassTop).toBeTruthy();
  154. expect(testSlider.tooltip.style.top).toBe("");
  155. });
  156. });
  157. });