content/test/data/gpu/pixel_offscreenCanvas_webgl_commit_worker.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_webgl_commit_worker.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:

« no previous file with comments | « content/test/data/gpu/pixel_offscreenCanvas_webgl_commit_main.html ('k') | third_party/WebKit/LayoutTests/fast/canvas/OffscreenCanvas-commit-frameless-doc.html » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Hide Comments ('s')

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 45 matching lines...) Expand 10 before \| Expand all \| Expand 10 after Loading...
56 gl.bufferData(gl.ARRAY_BUFFER, new Float32Array([-.5,0, 0,.5, .5,0]), gl.STATI C_DRAW);	56 gl.bufferData(gl.ARRAY_BUFFER, new Float32Array([-.5,0, 0,.5, .5,0]), gl.STATI C_DRAW);

57 var attr = gl.getAttribLocation(prog, 'pos');	57 var attr = gl.getAttribLocation(prog, 'pos');

58 gl.enableVertexAttribArray(attr);	58 gl.enableVertexAttribArray(attr);

59 gl.vertexAttribPointer(attr, 2, gl.FLOAT, false, 0, 0);	59 gl.vertexAttribPointer(attr, 2, gl.FLOAT, false, 0, 0);

60	60

61 gl.drawArrays(gl.TRIANGLE_STRIP, 0, 3);	61 gl.drawArrays(gl.TRIANGLE_STRIP, 0, 3);

62 }	62 }

63	63

64 function drawLoop()	64 function drawLoop()

65 {	65 {

66 if (g_frameNumber < 3) {	66 if (g_frameNumber < 10) {

67 gl.clearColor(1, 0, 0, 1);

68 gl.clear(gl.COLOR_BUFFER_BIT);

69 g_frameNumber++;	67 g_frameNumber++;

70 gl.commit().then(drawLoop);	68 // Purposely intersperse overdraw and non-overdraw commit cases to see

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

	70 if (0 == g_frameNumber % 2) {

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

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

	73 gl.commit().then(drawLoop);

	74 } else {

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

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

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

	78 gl.commit();

	79 drawLoop();

	80 }

71 } else {	81 } else {

72 drawTriangle();	82 drawTriangle();

73 gl.commit();	83 gl.commit();

74	84

75 // The following clear is never committed	85 // The following clear is never committed

76 gl.clearColor(0, 0, 1, 1);	86 gl.clearColor(0, 0, 1, 1);

77 gl.clear(gl.COLOR_BUFFER_BIT);	87 gl.clear(gl.COLOR_BUFFER_BIT);

78	88

79 self.postMessage("");	89 self.postMessage("");

80 }	90 }

81 }	91 }

82	92

83 self.onmessage = function(e) {	93 self.onmessage = function(e) {

84 var transferredOffscreenCanvas = e.data;	94 var transferredOffscreenCanvas = e.data;

85 gl = transferredOffscreenCanvas.getContext("webgl");	95 gl = transferredOffscreenCanvas.getContext("webgl", {preserveDrawingBuffer: tr ue});

	96 gl.clearColor(1, 0, 0, 1);

	97 gl.clear(gl.COLOR_BUFFER_BIT);

86 drawLoop();	98 drawLoop();

87 };	99 };

88 </script>	100 </script>

89 <script>	101 <script>

90 var g_swapsBeforeAck = 15;	102 var g_swapsBeforeAck = 15;

91	103

92 function makeWorker(script) {	104 function makeWorker(script) {

93 var blob = new Blob([script]);	105 var blob = new Blob([script]);

94 return new Worker(URL.createObjectURL(blob));	106 return new Worker(URL.createObjectURL(blob));

95 }	107 }

(...skipping 28 matching lines...) Expand all Loading...
124 </script>	136 </script>

125 </head>	137 </head>

126 <body onload="main()">	138 <body onload="main()">

127 <div style="position:relative; width:300px; height:300px; background-color:white ">	139 <div style="position:relative; width:300px; height:300px; background-color:white ">

128 </div>	140 </div>

129 <div id="container" style="position:absolute; top:0px; left:0px">	141 <div id="container" style="position:absolute; top:0px; left:0px">

130 <canvas id="c" width="300" height="300" class="nomargin"></canvas>	142 <canvas id="c" width="300" height="300" class="nomargin"></canvas>

131 </div>	143 </div>

132 </body>	144 </body>

133 </html>	145 </html>

OLD	NEW