Looking to hook into the Chess Streak render function

[mitenko]

Hi all,

I am writing a Firefox extension. The idea is that the games feature isn't available until a certain number of iterations of the chess streak feature have been completed (https://lichess.org/streak). I have a very basic version working that checks streak stats via the API but what I would like to do is to keep track of the streak counter as each puzzle is completed (for example, then you could have a "minor" prize at 30 steps and a "major" prize at 40).

Ideally, I would like my javascript to receive the PuzzleStreak data as it is updated.

My limited javascript knowledge makes me think I should hook into the streak render function and use the data as it passes through there. I can see that the render function is here.

As the people that developed this code, what would be the best way to do this?

[ornicar]

I suppose a MutationObserver would do?

[mitenko]

Thank-you Thibault,

I think you're right and a MutationObserver works but again, I'm not super familiar with javascript. I'm not sure which div I should be hooking into. I think if I hook into the "puzzle__side__streak__score text" div, that is overwritten by the render code so the MutationObeserver doesn't fire. Do you have a suggestion on which div I should hook into?