Page MenuHomePhabricator

VisualEditor: MWExtensionNode/GeneratedContentNode should avoid emitting 'rerender' twice when rendering <img>s
Closed, ResolvedPublic

Description

ce.MWExtensionNode.onParseSuccess contains the following code:

// Rerender after images load
this.$.find( 'img' ).on( 'load', ve.bind( function () {

		this.emit( 'rerender' );

}, this ) );

Problems:

  • Why is this in MWExtensionNode? Shouldn't it just be in GCNode?
  • This potentially emits multiple rerender events, one for each image
  • The first rerender event has already been emitted because we've already resolved the promise and attached the nodes to the DOM

What we should really do is attach the nodes somewhere else (where?) so that the images load, then reattach them to a wrapper and resolve the promise with that. That way we only emit rerender once, and we correctly only resolve the promise once everything has actually loaded.

In practice, this means the math inspector moves around twice after typing LaTeX in certain cases: once because of the 'rerender' event caused by the <img> tag being put on the page (at which point it measures 0x0), and once because of the 'rerender' event caused by the image actually loading (at which point it measures correctly).

Open questions:

  • How does this work for images with invalid/unavailable sources?
  • Really what we care about here is the dimensions of the images. If those are known, we can render the node without its dimensions changing later

Version: unspecified
Severity: normal

Details

Reference
bz54584