<!DOCTYPE html>
<html>
<head>
<script src="../../resources/js-test.js"></script>
</head>
<body>
<script>
description("This tests checks that all of the input values for object-fit parse correctly.");
function test(value)
{
var div = document.createElement("div");
div.setAttribute("style", value);
document.body.appendChild(div);
var result = div.style.getPropertyValue("object-fit");
document.body.removeChild(div);
return result;
}
function testComputedStyle(value)
{
var div = document.createElement("div");
div.setAttribute("style", value);
document.body.appendChild(div);
var result = window.getComputedStyle(div).objectFit;
document.body.removeChild(div);
return result;
}
shouldBe('testComputedStyle(";")', '"fill"');
shouldBe('test("object-fit: inherit;")', '"inherit"');
shouldBe('test("object-fit: initial;")', '"initial"');
shouldBe('test("object-fit: fill;")', '"fill"');
shouldBe('test("object-fit: contain;")', '"contain"');
shouldBe('test("object-fit: cover;")', '"cover"');
shouldBe('test("object-fit: none;")', '"none"');
shouldBe('test("object-fit: scale-down;")', '"scale-down"');
shouldBeEqualToString('test("object-fit: fill contain;")', '');
shouldBeEqualToString('test("object-fit: bananas;")', '');
shouldBeEqualToString('test("object-fit: 23px;")', '');
shouldBeEqualToString('test("object-fit: 20%;")', '');
</script>
</body>
</html>