chromium/src/third_party/blink/web_tests/fast/css/getComputedStyle/computed-style-border-image.html - manifest_repos/chromium_src - Git at Google

 <!DOCTYPE html>
 <html>
 <head>
 <meta charset="utf-8">
 <script src="../../../resources/js-test.js"></script>
 </head>
 <body>
 <p>Test computed style for the border-image property and sub-properties</p>
 <div id="console"></div>
 <script>

 var testDiv = document.createElement('div');
 testDiv.style.borderWidth = '10px';
 document.body.appendChild(testDiv);

 function computedBorderImageStyle(borderImageStyle, property) {
     testDiv.style.borderImage = 'none';
     testDiv.style.borderImage = borderImageStyle;
     return window.getComputedStyle(testDiv).getPropertyValue(property);
 }

 function checkComputedStyleValue() {
     var before = window.getComputedStyle(testDiv).getPropertyValue('border-image');
     testDiv.style.borderImage = 'none';
     testDiv.style.borderImage = before;
     return (window.getComputedStyle(testDiv).getPropertyValue('border-image') == before);
 }

 shouldBeEqualToString("computedBorderImageStyle('12 11 12 11', 'border-image-slice')", '12 11');
 shouldBeEqualToString("computedBorderImageStyle('12 11 12 11', 'border-image')", 'none');
 shouldBe("checkComputedStyleValue()", "true");
 shouldBeEqualToString("computedBorderImageStyle('url(test.png) 12 11 repeat stretch', 'border-image-slice')", '12 11');
 shouldBeEqualToString("computedBorderImageStyle('url(dummy://test.png) 12 11 repeat stretch', 'border-image')", 'url("dummy://test.png") 12 11 / 1 / 0 repeat stretch');
 shouldBe("checkComputedStyleValue()", "true");
 shouldBeEqualToString("computedBorderImageStyle('url(test.png) 1 2 3 4 repeat stretch', 'border-image-slice')", '1 2 3 4');
 shouldBeEqualToString("computedBorderImageStyle('url(dummy://test.png) 1 2 3 4 repeat stretch', 'border-image')", 'url("dummy://test.png") 1 2 3 4 / 1 / 0 repeat stretch');
 shouldBe("checkComputedStyleValue()", "true");
 shouldBeEqualToString("computedBorderImageStyle('url(test.png) 12 repeat stretch', 'border-image-slice')", '12');
 shouldBeEqualToString("computedBorderImageStyle('url(test.png) 10 10 5 5 repeat stretch', 'border-image-slice')", '10 10 5 5');
 shouldBeEqualToString("computedBorderImageStyle('url(test.png) 10 a b c repeat stretch', 'border-image-slice')", '100%');
 shouldBeEqualToString("computedBorderImageStyle('url(dummy://test.png) 10 a b c repeat stretch', 'border-image')", 'none');
 shouldBe("checkComputedStyleValue()", "true");
 shouldBeEqualToString("computedBorderImageStyle('url(test.png) 10 20 fill', 'border-image-slice')", '10 20 fill');
 shouldBeEqualToString("computedBorderImageStyle('url(dummy://test.png) 10 20 fill', 'border-image')", 'url("dummy://test.png") 10 20 fill / 1 / 0 stretch');
 shouldBe("checkComputedStyleValue()", "true");

 shouldBeEqualToString("computedBorderImageStyle('url(dummy://test.png) 10 10 10 10 repeat stretch', 'border-image-source')", 'url("dummy://test.png")');
 shouldBeEqualToString("computedBorderImageStyle('url(dummy://test.png) 10 10 10 10 repeat stretch', 'border-image')", 'url("dummy://test.png") 10 / 1 / 0 repeat stretch');
 shouldBe("checkComputedStyleValue()", "true");

 shouldBeEqualToString("computedBorderImageStyle('url(test.png) 10', 'border-image-repeat')", 'stretch');
 shouldBeEqualToString("computedBorderImageStyle('url(dummy://test.png) 10', 'border-image')", 'url("dummy://test.png") 10 / 1 / 0 stretch');
 shouldBe("checkComputedStyleValue()", "true");
 shouldBeEqualToString("computedBorderImageStyle('url(test.png) 10 stretch', 'border-image-repeat')", 'stretch');
 shouldBeEqualToString("computedBorderImageStyle('url(dummy://test.png) 10 stretch', 'border-image')", 'url("dummy://test.png") 10 / 1 / 0 stretch');
 shouldBe("checkComputedStyleValue()", "true");
 shouldBeEqualToString("computedBorderImageStyle('url(test.png) 10 kittens', 'border-image-repeat')", 'stretch');
 shouldBeEqualToString("computedBorderImageStyle('url(dummy://test.png) 10 kittens', 'border-image')", 'none');
 shouldBe("checkComputedStyleValue()", "true");
 shouldBeEqualToString("computedBorderImageStyle('url(test.png) 10 stretch stretch fill', 'border-image-repeat')", 'stretch');
 shouldBeEqualToString("computedBorderImageStyle('url(dummy://test.png) 10 stretch stretch fill', 'border-image')", 'none');
 shouldBe("checkComputedStyleValue()", "true");
 shouldBeEqualToString("computedBorderImageStyle('url(test.png) 10 repeat stretch', 'border-image-repeat')", 'repeat stretch');
 shouldBeEqualToString("computedBorderImageStyle('url(dummy://test.png) 10 repeat stretch', 'border-image')", 'url("dummy://test.png") 10 / 1 / 0 repeat stretch');
 shouldBe("checkComputedStyleValue()", "true");
 shouldBeEqualToString("computedBorderImageStyle('url(test.png) 10 round space', 'border-image-repeat')", 'round space');
 shouldBeEqualToString("computedBorderImageStyle('url(dummy://test.png) 10 round space', 'border-image')", 'url("dummy://test.png") 10 / 1 / 0 round space');
 shouldBe("checkComputedStyleValue()", "true");

 shouldBeEqualToString("computedBorderImageStyle('url(test.png) 10 / 13px 1.5em 1em 10px', 'border-image-width')", '13px 24px 16px 10px');
 shouldBeEqualToString("computedBorderImageStyle('url(dummy://test.png) 10 / 13px 1.5em 1em 10px', 'border-image')", 'url("dummy://test.png") 10 / 13px 24px 16px 10px / 0 stretch');
 shouldBe("checkComputedStyleValue()", "true");
 shouldBeEqualToString("computedBorderImageStyle('url(test.png) 10 / 14px 10%', 'border-image-width')", '14px 10%');
 shouldBeEqualToString("computedBorderImageStyle('url(dummy://test.png) 10 / 14px 10%', 'border-image')", 'url("dummy://test.png") 10 / 14px 10% / 0 stretch');
 shouldBe("checkComputedStyleValue()", "true");
 shouldBeEqualToString("computedBorderImageStyle('url(test.png) 10 / 13px / 11px', 'border-image-outset')", '11px');
 shouldBeEqualToString("computedBorderImageStyle('url(dummy://test.png) 10 / 13px / 11px', 'border-image')", 'url("dummy://test.png") 10 / 13px / 11px stretch');
 shouldBe("checkComputedStyleValue()", "true");

 shouldBeEqualToString("computedBorderImageStyle('url(test.png) 10 / 13px / 11px repeat stretch', 'border-image-outset')", '11px');
 shouldBeEqualToString("computedBorderImageStyle('url(dummy://test.png) 10 / 13px / 11px repeat stretch', 'border-image')", 'url("dummy://test.png") 10 / 13px / 11px repeat stretch');
 shouldBe("checkComputedStyleValue()", "true");

 </script>
 </body>
 </html>
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8">
	<script src="../../../resources/js-test.js"></script>
	</head>
	<body>
	<p>Test computed style for the border-image property and sub-properties</p>
	<div id="console"></div>
	<script>

	var testDiv = document.createElement('div');
	testDiv.style.borderWidth = '10px';
	document.body.appendChild(testDiv);

	function computedBorderImageStyle(borderImageStyle, property) {
	testDiv.style.borderImage = 'none';
	testDiv.style.borderImage = borderImageStyle;
	return window.getComputedStyle(testDiv).getPropertyValue(property);
	}

	function checkComputedStyleValue() {
	var before = window.getComputedStyle(testDiv).getPropertyValue('border-image');
	testDiv.style.borderImage = 'none';
	testDiv.style.borderImage = before;
	return (window.getComputedStyle(testDiv).getPropertyValue('border-image') == before);
	}

	shouldBeEqualToString("computedBorderImageStyle('12 11 12 11', 'border-image-slice')", '12 11');
	shouldBeEqualToString("computedBorderImageStyle('12 11 12 11', 'border-image')", 'none');
	shouldBe("checkComputedStyleValue()", "true");
	shouldBeEqualToString("computedBorderImageStyle('url(test.png) 12 11 repeat stretch', 'border-image-slice')", '12 11');
	shouldBeEqualToString("computedBorderImageStyle('url(dummy://test.png) 12 11 repeat stretch', 'border-image')", 'url("dummy://test.png") 12 11 / 1 / 0 repeat stretch');
	shouldBe("checkComputedStyleValue()", "true");
	shouldBeEqualToString("computedBorderImageStyle('url(test.png) 1 2 3 4 repeat stretch', 'border-image-slice')", '1 2 3 4');
	shouldBeEqualToString("computedBorderImageStyle('url(dummy://test.png) 1 2 3 4 repeat stretch', 'border-image')", 'url("dummy://test.png") 1 2 3 4 / 1 / 0 repeat stretch');
	shouldBe("checkComputedStyleValue()", "true");
	shouldBeEqualToString("computedBorderImageStyle('url(test.png) 12 repeat stretch', 'border-image-slice')", '12');
	shouldBeEqualToString("computedBorderImageStyle('url(test.png) 10 10 5 5 repeat stretch', 'border-image-slice')", '10 10 5 5');
	shouldBeEqualToString("computedBorderImageStyle('url(test.png) 10 a b c repeat stretch', 'border-image-slice')", '100%');
	shouldBeEqualToString("computedBorderImageStyle('url(dummy://test.png) 10 a b c repeat stretch', 'border-image')", 'none');
	shouldBe("checkComputedStyleValue()", "true");
	shouldBeEqualToString("computedBorderImageStyle('url(test.png) 10 20 fill', 'border-image-slice')", '10 20 fill');
	shouldBeEqualToString("computedBorderImageStyle('url(dummy://test.png) 10 20 fill', 'border-image')", 'url("dummy://test.png") 10 20 fill / 1 / 0 stretch');
	shouldBe("checkComputedStyleValue()", "true");

	shouldBeEqualToString("computedBorderImageStyle('url(dummy://test.png) 10 10 10 10 repeat stretch', 'border-image-source')", 'url("dummy://test.png")');
	shouldBeEqualToString("computedBorderImageStyle('url(dummy://test.png) 10 10 10 10 repeat stretch', 'border-image')", 'url("dummy://test.png") 10 / 1 / 0 repeat stretch');
	shouldBe("checkComputedStyleValue()", "true");

	shouldBeEqualToString("computedBorderImageStyle('url(test.png) 10', 'border-image-repeat')", 'stretch');
	shouldBeEqualToString("computedBorderImageStyle('url(dummy://test.png) 10', 'border-image')", 'url("dummy://test.png") 10 / 1 / 0 stretch');
	shouldBe("checkComputedStyleValue()", "true");
	shouldBeEqualToString("computedBorderImageStyle('url(test.png) 10 stretch', 'border-image-repeat')", 'stretch');
	shouldBeEqualToString("computedBorderImageStyle('url(dummy://test.png) 10 stretch', 'border-image')", 'url("dummy://test.png") 10 / 1 / 0 stretch');
	shouldBe("checkComputedStyleValue()", "true");
	shouldBeEqualToString("computedBorderImageStyle('url(test.png) 10 kittens', 'border-image-repeat')", 'stretch');
	shouldBeEqualToString("computedBorderImageStyle('url(dummy://test.png) 10 kittens', 'border-image')", 'none');
	shouldBe("checkComputedStyleValue()", "true");
	shouldBeEqualToString("computedBorderImageStyle('url(test.png) 10 stretch stretch fill', 'border-image-repeat')", 'stretch');
	shouldBeEqualToString("computedBorderImageStyle('url(dummy://test.png) 10 stretch stretch fill', 'border-image')", 'none');
	shouldBe("checkComputedStyleValue()", "true");
	shouldBeEqualToString("computedBorderImageStyle('url(test.png) 10 repeat stretch', 'border-image-repeat')", 'repeat stretch');
	shouldBeEqualToString("computedBorderImageStyle('url(dummy://test.png) 10 repeat stretch', 'border-image')", 'url("dummy://test.png") 10 / 1 / 0 repeat stretch');
	shouldBe("checkComputedStyleValue()", "true");
	shouldBeEqualToString("computedBorderImageStyle('url(test.png) 10 round space', 'border-image-repeat')", 'round space');
	shouldBeEqualToString("computedBorderImageStyle('url(dummy://test.png) 10 round space', 'border-image')", 'url("dummy://test.png") 10 / 1 / 0 round space');
	shouldBe("checkComputedStyleValue()", "true");

	shouldBeEqualToString("computedBorderImageStyle('url(test.png) 10 / 13px 1.5em 1em 10px', 'border-image-width')", '13px 24px 16px 10px');
	shouldBeEqualToString("computedBorderImageStyle('url(dummy://test.png) 10 / 13px 1.5em 1em 10px', 'border-image')", 'url("dummy://test.png") 10 / 13px 24px 16px 10px / 0 stretch');
	shouldBe("checkComputedStyleValue()", "true");
	shouldBeEqualToString("computedBorderImageStyle('url(test.png) 10 / 14px 10%', 'border-image-width')", '14px 10%');
	shouldBeEqualToString("computedBorderImageStyle('url(dummy://test.png) 10 / 14px 10%', 'border-image')", 'url("dummy://test.png") 10 / 14px 10% / 0 stretch');
	shouldBe("checkComputedStyleValue()", "true");
	shouldBeEqualToString("computedBorderImageStyle('url(test.png) 10 / 13px / 11px', 'border-image-outset')", '11px');
	shouldBeEqualToString("computedBorderImageStyle('url(dummy://test.png) 10 / 13px / 11px', 'border-image')", 'url("dummy://test.png") 10 / 13px / 11px stretch');
	shouldBe("checkComputedStyleValue()", "true");

	shouldBeEqualToString("computedBorderImageStyle('url(test.png) 10 / 13px / 11px repeat stretch', 'border-image-outset')", '11px');
	shouldBeEqualToString("computedBorderImageStyle('url(dummy://test.png) 10 / 13px / 11px repeat stretch', 'border-image')", 'url("dummy://test.png") 10 / 13px / 11px repeat stretch');
	shouldBe("checkComputedStyleValue()", "true");

	</script>
	</body>
	</html>