scratch-render currently fails scratch-gui tests

[cwillisf]

Actual Behavior

Recent changes in scratch-render are causing this test to fail in scratch-gui:

 PASS  test/integration/blocks.test.js (37.63s)
 FAIL  test/integration/costumes.test.js (62.828s)
  ● Working with costumes › Adding an svg from file

    TimeoutError: findByXpath timed out for path: //body//*[@id='react-tabs-3']//*[contains(text(), '100 x 100')]
    Wait timed out after 20007ms

See also scratchfoundation/scratch-gui#7406

Running the test non-headless, it looks like the costume tab is reporting 0x0 for the size of the costume, where it should be 100x100. Interacting with the paint editor causes the costume size to update, so it's probably just an order-of-operations problem where the size is reported out before it gets properly initialized/updated.

It seems likely that this was introduced with #745 but it could have been anything merged in June 2021.

Steps to Reproduce

1. Check out scratch-gui and update its scratch-render dependency to current scratch-render/develop
   • Or, check out scratch-gui branch renovate/scratch-render-0.x
2. Run integration tests

[cwillisf]

@adroitwhiz do you have any thoughts on this? Is it that callback that I asked you to change? 😅😬

[adroitwhiz]

It is the callback but something that I overlooked. We're setting the skin's size inside the callback, but the VM queries it right away.

The short-term solution would be to set the skin's size outside the callback but only emit a WasAltered event inside the callback, so that the skin doesn't appear "stretched" while we're waiting for the new image to load--it's a short-term solution because the skin will technically be in an invalid state while the image is loading (its size won't match up with its texture), but the invalid state won't ever be seen. The long-term solution would be to have setSVG return a Promise which the VM can wait for before querying the skin's size.

I'll create a PR implementing the short-term solution.