content/test/data/gpu/pixel_offscreenCanvas_2d_commit_main.html - Issue 2644653003: Make OffscreenCanvas animation in sync with its placeholder canvas's parent frame rate

Side by Side Diff: content/test/data/gpu/pixel_offscreenCanvas_2d_commit_main.html

Issue 2644653003: Make OffscreenCanvas animation in sync with its placeholder canvas's parent frame rate (Closed)

Patch Set: rebase again Created 3 years, 10 months ago

Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.

Jump to:

OLD	NEW
1 <!DOCTYPE HTML>	1 <!DOCTYPE HTML>

2	2

3 <!-- READ BEFORE UPDATING:	3 <!-- READ BEFORE UPDATING:

4 If this test is updated make sure to increment the "revision" value of the	4 If this test is updated make sure to increment the "revision" value of the

5 associated test in content/test/gpu/gpu_tests/pixel_test_pages.py. This will ens ure	5 associated test in content/test/gpu/gpu_tests/pixel_test_pages.py. This will ens ure

6 that the baseline images are regenerated on the next run.	6 that the baseline images are regenerated on the next run.

7 -->	7 -->

8	8

9 <html>	9 <html>

10 <head>	10 <head>

(...skipping 15 matching lines...) Expand all Loading...
26	26

27 function main()	27 function main()

28 {	28 {

29 drawLoop();	29 drawLoop();

30 }	30 }

31	31

32 var g_animationFrameNumber = 0;	32 var g_animationFrameNumber = 0;

33 var canvas = document.getElementById("c");	33 var canvas = document.getElementById("c");

34 var offscreenCanvas = canvas.transferControlToOffscreen();	34 var offscreenCanvas = canvas.transferControlToOffscreen();

35 var offscreen2d = offscreenCanvas.getContext("2d");	35 var offscreen2d = offscreenCanvas.getContext("2d");

	36 offscreen2d.fillStyle = "red";

	37 offscreen2d.fillRect(0, 0, 200, 200);

36	38

37 function drawLoop()	39 function drawLoop()

38 {	40 {

39 if (g_animationFrameNumber < 3) {	41 if (g_animationFrameNumber < 10) {

40 offscreen2d.fillStyle = "red";

41 offscreen2d.fillRect(0, 0, 200, 200);

42 g_animationFrameNumber++;	42 g_animationFrameNumber++;

43 offscreen2d.commit().then(drawLoop);	43 // Purposely intersperse overdraw and non-overdraw commit cases to see

	44 // if OffscreenCanvas commit() handles both cases well.

	45 if (0 == g_animationFrameNumber % 2) {

	46 // When promise is used, the next drawLoop() is called after the first

	47 // frame is resolved; therefore there is no overdraw in this case.

	48 offscreen2d.commit().then(drawLoop);

	49 } else {

	50 // When the next drawLoop() is invoked regardless the promise resolve

	51 // status of the previous commit(), the frame committed in the next

	52 // drawLoop() is very likely to be overdrawn.

	53 offscreen2d.commit();

	54 drawLoop();

	55 }

44 } else {	56 } else {

45 offscreen2d.fillStyle = "red";	57 offscreen2d.fillStyle = "red";

46 offscreen2d.fillRect(0, 0, 100, 100);	58 offscreen2d.fillRect(0, 0, 100, 100);

47 offscreen2d.fillStyle = "green";	59 offscreen2d.fillStyle = "green";

48 offscreen2d.fillRect(100, 0, 100, 100);	60 offscreen2d.fillRect(100, 0, 100, 100);

49 offscreen2d.fillStyle = "blue";	61 offscreen2d.fillStyle = "blue";

50 offscreen2d.fillRect(0, 100, 100, 100);	62 offscreen2d.fillRect(0, 100, 100, 100);

51 offscreen2d.fillStyle = "black";	63 offscreen2d.fillStyle = "black";

52 offscreen2d.fillRect(100, 100, 100, 100);	64 offscreen2d.fillRect(100, 100, 100, 100);

53 offscreen2d.commit();	65 offscreen2d.commit();

(...skipping 12 matching lines...) Expand all Loading...
66 domAutomationController.send("SUCCESS");	78 domAutomationController.send("SUCCESS");

67 } else {	79 } else {

68 g_swapsBeforeAck--;	80 g_swapsBeforeAck--;

69 document.getElementById('container').style.zIndex = g_swapsBeforeAck + 1;	81 document.getElementById('container').style.zIndex = g_swapsBeforeAck + 1;

70 window.requestAnimationFrame(waitForFinish);	82 window.requestAnimationFrame(waitForFinish);

71 }	83 }

72 }	84 }

73 </script>	85 </script>

74 </body>	86 </body>

75 </html>	87 </html>

OLD	NEW