| <!DOCTYPE html> |
| <html> |
| <head> |
| <script src="../../../resources/js-test.js"></script> |
| </head> |
| <body> |
| <p id="description"></p> |
| <div id="console"></div> |
| <script> |
| description('Tests for .valueAsNumber with <input type=range>.'); |
| |
| var input = document.createElement('input'); |
| input.type = 'range'; |
| document.body.appendChild(input); |
| |
| function valueAsNumberFor(stringValue) { |
| input.value = stringValue; |
| return input.valueAsNumber; |
| } |
| |
| function setValueAsNumberAndGetValue(num) { |
| input.valueAsNumber = num; |
| return input.value; |
| } |
| |
| // The default values for type=range: min=0 max=100 step=1 |
| // Values are modifies for these restrictions. |
| shouldBe('valueAsNumberFor("0")', '0'); |
| shouldBe('valueAsNumberFor("10")', '10'); |
| shouldBe('valueAsNumberFor("01")', '1'); |
| shouldBe('valueAsNumberFor("-0")', '0'); |
| shouldBe('valueAsNumberFor("-1.2")', '0'); |
| shouldBe('valueAsNumberFor("0.2")', '0'); |
| shouldBe('valueAsNumberFor(".2")', '0'); |
| shouldBe('valueAsNumberFor("1.2E10")', '100'); |
| shouldBe('valueAsNumberFor("1.2E-10")', '0'); |
| shouldBe('valueAsNumberFor("1.2E+10")', '100'); |
| shouldBe('valueAsNumberFor("123456789012345678901234567890123456789")', '100'); |
| shouldBe('valueAsNumberFor("0.12345678901234567890123456789012345678901234567890")', '0'); |
| |
| debug('valueAsNumber for invalid string values:'); |
| shouldBe('valueAsNumberFor("")', '50'); |
| shouldBe('valueAsNumberFor("abc")', '50'); |
| shouldBe('valueAsNumberFor("0xff")', '50'); |
| shouldBe('valueAsNumberFor("+1")', '50'); |
| shouldBe('valueAsNumberFor(" 10")', '50'); |
| shouldBe('valueAsNumberFor("10 ")', '50'); |
| shouldBe('valueAsNumberFor("1E")', '50'); |
| shouldBe('valueAsNumberFor("NaN")', '50'); |
| shouldBe('valueAsNumberFor("nan")', '50'); |
| shouldBe('valueAsNumberFor("Inf")', '50'); |
| shouldBe('valueAsNumberFor("inf")', '50'); |
| shouldBe('valueAsNumberFor("Infinity")', '50'); |
| shouldBe('valueAsNumberFor("infinity")', '50'); |
| |
| debug('Too huge exponent to support'); |
| shouldBe('valueAsNumberFor("1.2E65535")', '50'); |
| |
| debug('Tests for the valueAsNumber setter:'); |
| shouldBeEqualToString('setValueAsNumberAndGetValue(0)', '0'); |
| shouldBeEqualToString('setValueAsNumberAndGetValue(10)', '10'); |
| shouldBeEqualToString('setValueAsNumberAndGetValue(01)', '1'); |
| shouldBeEqualToString('setValueAsNumberAndGetValue(-0)', '0'); |
| shouldBeEqualToString('setValueAsNumberAndGetValue(-1.2)', '0'); |
| shouldBeEqualToString('setValueAsNumberAndGetValue(1.2e10)', '100'); |
| shouldBeEqualToString('setValueAsNumberAndGetValue(1.2e-10)', '0'); |
| shouldBeEqualToString('setValueAsNumberAndGetValue(1.2345678901234567e+38)', '100'); |
| |
| debug('Tests to set invalid values to valueAsNumber:'); |
| shouldBeEqualToString('setValueAsNumberAndGetValue(null)', '0'); |
| shouldBeEqualToString('setValueAsNumberAndGetValue(0)', '0'); |
| |
| // if .valueAsNumber is passed a NaN, the value is set as the empty string. Which resets the range value to its default. |
| var minValue = Number(input.min) || 0; |
| var maxValue = Number(input.max) || 100; |
| var defaultValue = String(minValue > maxValue ? minValue : (minValue + (maxValue - minValue) / 2.0)); |
| shouldBeEqualToString('setValueAsNumberAndGetValue("foo")', defaultValue); |
| shouldBeEqualToString('setValueAsNumberAndGetValue(NaN)', defaultValue); |
| shouldBeEqualToString('setValueAsNumberAndGetValue(Number.NaN)', defaultValue); |
| shouldThrow('setValueAsNumberAndGetValue(Infinity)', '"TypeError: Failed to set the \'valueAsNumber\' property on \'HTMLInputElement\': The value provided is infinite."'); |
| shouldThrow('setValueAsNumberAndGetValue(Number.POSITIVE_INFINITY)', '"TypeError: Failed to set the \'valueAsNumber\' property on \'HTMLInputElement\': The value provided is infinite."'); |
| shouldThrow('setValueAsNumberAndGetValue(Number.NEGATIVE_INFINITY)', '"TypeError: Failed to set the \'valueAsNumber\' property on \'HTMLInputElement\': The value provided is infinite."'); |
| </script> |
| </body> |
| </html> |
