avoid jitter while resizing instructions

[davidsbailey]

Description

Fixes a bug in minecraft instructions as described here:

• zendesk ticket
• slack thread

Repro steps

1. zoom out to 90%
2. navigate to a minecraft level
3. press run
4. press reset
5. wait a while

usually, the screen becomes unresponsive by this point, and a few seconds later a "maximum stack depth exceeded" error appears. If you do not experience this, you can test whether the problem has been hit by running window.addEventListener('resize', function() {console.log('resize');} and pressing Run / Reset again.

Root cause

The root cause is that the instructions area can get into an infinite loop where it responds to its inputs changing by modifying the same input. In this particular case, it causes the renderedHeight to go up and down by 1 forever. The many resize events are secondary to this.

Solution

Only update the rendered height of the instructions if it is changing by more than 1. This eliminates the specific problem, but would not (for example) protect against other loops which modify the value by say +/- 2 on each iteration.

Testing story

Manually verified the issue is resolved. Since the repro steps are super-specific and involve changing the screen zoom level, I'm not adding a regression test to catch this exact problem.

Future work

LP-838 tracks implementing a more robust solution, by eliminating the potential feedback loop rather than just dampening it.

Reviewer Checklist:

• Tests provide adequate coverage
• Code is well-commented
• New features are translatable or updates will not break translations
• Relevant documentation has been added or updated
• User impact is well-understood and desirable
• Pull Request is labeled appropriately
• Follow-up work items (including potential tech debt) are tracked and linked

[jmkulwik]

Awesome. Looks like it'll definitely fix the break we're seeing. I pulled on my local machine, and didn't repro any issues with minecraft. I am a bit concerned about adding this workaround - are you planning to make a follow-up task to do a more in-depth fix and take out the workaround?

[davidsbailey]

Great, thanks for verifying!

Yeah, we should have a follow-up for this: https://codedotorg.atlassian.net/browse/LP-838

[jmkulwik]

LGTM. Although I am not very familiar with this space and would prefer someone from LP signed off instead of me.

[davidsbailey]

makes sense @jmkulwik . In that case, @dmcavoy , can you also review?

[dmcavoy]

Looks good Dave! Thanks for figuring this out as a work around for now