You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
194 lines
5.4 KiB
194 lines
5.4 KiB
/* |
|
************************* |
|
|
|
tooltip_position Option Test |
|
|
|
************************* |
|
*/ |
|
describe("'tooltip_position' Option tests", function() { |
|
|
|
var testSlider; |
|
|
|
afterEach(function() { |
|
if(testSlider) { |
|
testSlider.destroy(); |
|
testSlider = null; |
|
} |
|
}); |
|
|
|
describe("vertical slider tests", function() { |
|
|
|
it("should be aligned to the left of the handle if set to 'left'", function() { |
|
// Create slider |
|
testSlider = new Slider("#testSlider1", { |
|
min: 0, |
|
max: 10, |
|
value: 5, |
|
tooltip_position: "left", |
|
orientation: "vertical" |
|
}); |
|
|
|
// Extract needed references/values |
|
var mainTooltipHasClassLeft = testSlider.tooltip.classList.contains("left"); |
|
|
|
// Assert |
|
expect(mainTooltipHasClassLeft).toBeTruthy(); |
|
expect(testSlider.tooltip.style.right).toBe("100%"); |
|
}); |
|
|
|
it("should be aligned to the right of the handle if set to 'right'", function() { |
|
// Create slider |
|
testSlider = new Slider("#testSlider1", { |
|
min: 0, |
|
max: 10, |
|
value: 5, |
|
tooltip_position: "right", |
|
orientation: "vertical" |
|
}); |
|
|
|
// Extract needed references/values |
|
var mainTooltipHasClassRight = testSlider.tooltip.classList.contains("right"); |
|
|
|
// Assert |
|
expect(mainTooltipHasClassRight).toBeTruthy(); |
|
expect(testSlider.tooltip.style.left).toBe("100%"); |
|
}); |
|
|
|
it("should default to 'right' if tooltip_position set to 'top'", function() { |
|
// Create slider |
|
testSlider = new Slider("#testSlider1", { |
|
min: 0, |
|
max: 10, |
|
value: 5, |
|
tooltip_position: "top", |
|
orientation: "vertical" |
|
}); |
|
|
|
// Extract needed references/values |
|
var mainTooltipHasClassRight = testSlider.tooltip.classList.contains("right"); |
|
|
|
// Assert |
|
expect(mainTooltipHasClassRight).toBeTruthy(); |
|
expect(testSlider.tooltip.style.left).toBe("100%"); |
|
}); |
|
|
|
it("should default to 'right' if tooltip_position set to 'bottom'", function() { |
|
// Create slider |
|
testSlider = new Slider("#testSlider1", { |
|
min: 0, |
|
max: 10, |
|
value: 5, |
|
tooltip_position: "bottom", |
|
orientation: "vertical" |
|
}); |
|
|
|
// Extract needed references/values |
|
var mainTooltipHasClassRight = testSlider.tooltip.classList.contains("right"); |
|
|
|
// Assert |
|
expect(mainTooltipHasClassRight).toBeTruthy(); |
|
expect(testSlider.tooltip.style.left).toBe("100%"); |
|
}); |
|
|
|
}); |
|
|
|
|
|
describe("horizontal slider tests", function() { |
|
|
|
it("should be aligned above the handle if set to 'top'", function() { |
|
// Create slider |
|
testSlider = new Slider("#testSlider1", { |
|
min: 0, |
|
max: 10, |
|
value: 5, |
|
tooltip_position: "top", |
|
orientation: "horizontal" |
|
}); |
|
|
|
// Extract needed references/values |
|
var mainTooltipHasClassTop = testSlider.tooltip.classList.contains("top"); |
|
|
|
// Assert |
|
expect(mainTooltipHasClassTop).toBeTruthy(); |
|
expect(testSlider.tooltip.style.top).toBe(""); |
|
}); |
|
|
|
it("should be aligned below the handle if set to 'bottom'", function() { |
|
// Create slider |
|
testSlider = new Slider("#testSlider1", { |
|
min: 0, |
|
max: 10, |
|
value: 5, |
|
tooltip_position: "bottom", |
|
orientation: "horizontal" |
|
}); |
|
|
|
// Extract needed references/values |
|
var mainTooltipHasClassTop = testSlider.tooltip.classList.contains("bottom"); |
|
|
|
// Assert |
|
expect(mainTooltipHasClassTop).toBeTruthy(); |
|
expect(testSlider.tooltip.style.top).toBe("22px"); |
|
}); |
|
|
|
it("should be aligned below the handle if set to 'bottom' for range", function() { |
|
// Create slider |
|
testSlider = new Slider("#testSlider1", { |
|
min: 0, |
|
max: 20, |
|
value: [0, 10], |
|
range: true, |
|
tooltip_position: "bottom", |
|
orientation: "horizontal" |
|
}); |
|
|
|
// Extract needed references/values |
|
var mainTooltipHasClassTopMin = testSlider.tooltip_min.classList.contains("bottom"); |
|
var mainTooltipHasClassTopMax = testSlider.tooltip_max.classList.contains("bottom"); |
|
|
|
// Assert |
|
expect(mainTooltipHasClassTopMin).toBeTruthy(); |
|
expect(mainTooltipHasClassTopMax).toBeTruthy(); |
|
expect(testSlider.tooltip_min.style.top).toBe("22px"); |
|
expect(testSlider.tooltip_max.style.top).toBe("22px"); |
|
}); |
|
|
|
it("should default to 'top' if tooltip_position set to 'left'", function() { |
|
// Create slider |
|
testSlider = new Slider("#testSlider1", { |
|
min: 0, |
|
max: 10, |
|
value: 5, |
|
tooltip_position: "left", |
|
orientation: "horizontal" |
|
}); |
|
|
|
// Extract needed references/values |
|
var mainTooltipHasClassTop = testSlider.tooltip.classList.contains("top"); |
|
|
|
// Assert |
|
expect(mainTooltipHasClassTop).toBeTruthy(); |
|
expect(testSlider.tooltip.style.top).toBe(""); |
|
}); |
|
|
|
it("should default to 'top' if tooltip_position set to 'right'", function() { |
|
// Create slider |
|
testSlider = new Slider("#testSlider1", { |
|
min: 0, |
|
max: 10, |
|
value: 5, |
|
tooltip_position: "right", |
|
orientation: "horizontal" |
|
}); |
|
|
|
// Extract needed references/values |
|
var mainTooltipHasClassTop = testSlider.tooltip.classList.contains("top"); |
|
|
|
// Assert |
|
expect(mainTooltipHasClassTop).toBeTruthy(); |
|
expect(testSlider.tooltip.style.top).toBe(""); |
|
}); |
|
|
|
}); |
|
|
|
}); |