LayoutTests/animations/animation-z-order-overflow.html - WebKit - Git at Google

 <!doctype html>
 <title>Testing if integer interpolation is overflowed for 32bit integer type min/max value</title>
 <link rel="author" title="Joonghun Park" href="pjh0718@gmail.com">
 <script src="../resources/testharness.js"></script>
 <script src="../resources/testharnessreport.js"></script>
 <style>

 #anim-target {
   animation: anim-z 4s steps(4) forwards 1;
   animation-delay: -3s;
   animation-play-state: paused;
 }

 @keyframes anim-z {
   from {
     z-index: -2147483647;
   }

   to {
     z-index: 2147483647;
   }
 }

 </style>
 <div id="anim-target"></div>
 <script>
 var test_description = "Integer interpolation should be rounded towards positive infinity";
 test(
     t => {
         const target = document.getElementById("anim-target");
         const z_index_value = Number.parseFloat(getComputedStyle(target).getPropertyValue('z-index'));

         assert_greater_than(z_index_value, 0, "Interpolation result for z-index should be positive integer");
     },
     test_description
 );
 </script>
	<!doctype html>
	<title>Testing if integer interpolation is overflowed for 32bit integer type min/max value</title>
	<link rel="author" title="Joonghun Park" href="pjh0718@gmail.com">
	<script src="../resources/testharness.js"></script>
	<script src="../resources/testharnessreport.js"></script>
	<style>

	#anim-target {
	animation: anim-z 4s steps(4) forwards 1;
	animation-delay: -3s;
	animation-play-state: paused;
	}

	@keyframes anim-z {
	from {
	z-index: -2147483647;
	}

	to {
	z-index: 2147483647;
	}
	}

	</style>
	<div id="anim-target"></div>
	<script>
	var test_description = "Integer interpolation should be rounded towards positive infinity";
	test(
	t => {
	const target = document.getElementById("anim-target");
	const z_index_value = Number.parseFloat(getComputedStyle(target).getPropertyValue('z-index'));

	assert_greater_than(z_index_value, 0, "Interpolation result for z-index should be positive integer");
	},
	test_description
	);
	</script>