ccapture.js icon indicating copy to clipboard operation
ccapture.js copied to clipboard

[BUG] CCapturer.start() breaks all of my Promises (dangerous code included)

Open ProgrammingLife opened this issue 5 years ago • 2 comments

I use CCapture in the following way: <script src="scripts/ccapture.js-1.0.9/build/CCapture.all.min.js"></script>

Tested in all latest browsers (FireFox, Chromium).

I have the code:

async function promisedFunc() {
	return new Promise(resolve => resolve());
}

async function asyncFuncTest(i) {
	if (i > 5) return ;

	console.log(`AsyncTest() 000, i = ${i}`);
	await promisedFunc().then( () => {} );
	console.log(`AsyncTest() 111`);

	setTimeout( () => { asyncFuncTest(i + 1); }, 500);
}


console.log("000");
// setTimeout( () => { asyncFuncTest(0); }, 1000);
asyncFuncTest(0);
console.log("111");

capturer = new CCapture({ format: 'png', framerate: 60, quality: 1.0, });
// capturer.start(); // <-- problem in this line

Console output is:

AsyncTest() 000, i = 0
AsyncTest() 111
AsyncTest() 000, i = 1
AsyncTest() 111
AsyncTest() 000, i = 2
AsyncTest() 111
AsyncTest() 000, i = 3
AsyncTest() 111
AsyncTest() 000, i = 4
AsyncTest() 111
AsyncTest() 000, i = 5
AsyncTest() 111

which is great, right? But when I uncomment that problem line with capturer.start() I get in the console only:

000
AsyncTest() 000, i = 0
111
AsyncTest() 111

but what's wrong with the CCapturer? Why it breaks my promises? What do I do wrong? How to avoid it?

ProgrammingLife avatar Jan 04 '20 13:01 ProgrammingLife

This not happens when I use webm-writer only without CCapture.

ProgrammingLife avatar Jan 04 '20 14:01 ProgrammingLife

Ok finally I got the warning about setTimeout() on the main page of the library:

requestAnimationFrame, setTimeout, etc. won't work as expected after capture is started. Make sure your animation loop is running

but why don't you make your own custom setTimeout() function? To not to break the standart setTimeout() functionality.

ProgrammingLife avatar Jan 04 '20 17:01 ProgrammingLife