fix: size text with computed styles even when hidden #8572
Merged
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
The basics
The details
Resolves
Re-fixes #8277
Proposed Changes
Recently, code that was calling
getFastTextWidth()
was updated to callgetTextWidth()
instead, becausegetFastTextWidth()
required knowledge of some styling attributes. Historically, these were derived from the theme/renderer, but with recent changes to move towards using CSS for this purpose, it was thought that we needed to usegetTextWidth()
instead, which relied on thegetComputedTextLength()
method of SVG text elements.Unfortunately,
getComputedTextLength()
has a significant limitation: it doesn't work when the SVG text element (or any of its parents) hasdisplay: none
or similar set. This could result in blocks being incorrectly sized when manipulated while not visible, e.g. gonfunko/scratch-blocks#163.This PR modifies the implementation of
getTextWidth()
to instead usegetComputedStyle()
to dynamically calculate the CSS styles applied to an SVG text element, whether through Blockly's built-in styles, injected styles, or user agent stylesheets. This method returns a live CSSStyleDeclaration object, which allows accessing the currently-applicable value of any CSS property. AIUI, this doesn't calculate anything up front, only determining the value of properties when they are accessed, so performance should be (and appears to be) quite good. Moreover, this appears to return e.g. the font size/weight/face applied to an element even if it is hidden at the moment, and resolves the aforementioned issues.This PR additionally removes exception handling and size estimation code that was presumably present due to an IE 10 behavior that caused
getComputedTextLength()
to throw for hidden elements.