Closed Bug 1746794 Opened 3 years ago Closed 3 years ago

Incorrect bounding boxes and positions for some svg elements

Categories

(Core :: SVG, defect, P3)

Product:
Core
Component:
SVG
Version:
Firefox 97
Platform:
x86_64
Windows 10
Type:
defect

Tracking

()

Status:
RESOLVED FIXED
Milestone:
98 Branch
Tracking Flags:
Tracking Status
firefox98 --- fixed

People

(Reporter: calixte, Assigned: emilio)

References

Details

Attachments

(2 files)

plop.html
286 bytes, text/html
Details
Bug 1746794 - Make more nsLayoutUtils functions SVG-text aware. r=jfkthame!
48 bytes, text/x-phabricator-request
Details | Review
Attached file plop.html —

STR:

  • open the following html in firefox:
<html>
<body>
  <div>
    <svg width="200" height="200" xmlns="http://www.w3.org/2000/svg">
      <text>
        <tspan x="50 60 70 80 90 100" y="50">hello1</tspan>
        <tspan x="50 60 70 80 90 100" y="100">hello2</tspan>
      </text>
    </svg>
  </div>
</body>
</html>
  • open the devtools
  • mouse over the 2 tspans in the inspector
  • observe the highlighted bounding boxes: dimensions are incorrect and the top-left corner for the second tspan is wrong.

It works correctly in Chrome.

The severity field is not set for this bug.
:jdescottes, could you have a look please?

For more information, please visit auto_nag documentation.

Flags: needinfo?(jdescottes)

Seems to be a long standing issue (went back to 68.5) so P3 S3.
Keeping the ni? to at least add pointers about the origin of the problem.

Severity: -- → S3
Priority: -- → P3

Hi Emilio!

To position the highlighters, DevTools uses getBoxQuads (at https://searchfox.org/mozilla-central/rev/fbf1e796ecead9484deced4d99f199f327ba25ab/devtools/shared/layout/utils.js#165-169). But for the test case here, the quad returned doesn't really match the position where the <tspan>'s text is displayed. However, getBoundingClientRect returns the correct information. Do you think this is a bug in getBoxQuads or is this expected?

Note: Historically I think we used getBoxQuads instead of getBoundingClientRect mostly because we drew the highlighter in the topmost frame, so we needed to compute the position of the element compared to the topmost document. But now that we have one target per frame (since Bug 1731740), we might be able to use getBoundingClientRect again.

Flags: needinfo?(jdescottes) → needinfo?(emilio)

The issue is that getBoundingClientRect hits this special-case, but getBoxQuads doesn't... SVG text seems quite messy in that regard. Will try to fix.

Assignee: nobody → emilio
Attachment #9257710 - Attachment description: WIP: Bug 1746794 - Make TransformRect deal with SVG text correctly, and use that from GeometryUtils. r=#layout-reviewers → Bug 1746794 - Make TransformRect deal with SVG text correctly, and use that from GeometryUtils. r=#layout-reviewers
Status: NEW → ASSIGNED
Flags: needinfo?(emilio)

Thanks for working on this Emilio!

There's a r+ patch which didn't land and no activity in this bug for 2 weeks.
:emilio, could you have a look please?
For more information, please visit auto_nag documentation.

Flags: needinfo?(jfkthame)
Flags: needinfo?(emilio)

Yeah, there's a failing test I need to look into.

Flags: needinfo?(jfkthame)
Attachment #9257710 - Attachment description: Bug 1746794 - Make TransformRect deal with SVG text correctly, and use that from GeometryUtils. r=#layout-reviewers → Bug 1746794 - Make more nsLayoutUtils functions SVG-text aware. r=jfkthame!
Flags: needinfo?(emilio)
Pushed by ealvarez@mozilla.com: https://hg.mozilla.org/integration/autoland/rev/14297312b359 Make more nsLayoutUtils functions SVG-text aware. r=layout-reviewers,jfkthame
Created web-platform-tests PR https://github.com/web-platform-tests/wpt/pull/32596 for changes under testing/web-platform/tests

https://hg.mozilla.org/mozilla-central/rev/14297312b359

Status: ASSIGNED → RESOLVED
Closed: 3 years ago
status-firefox98: --- → fixed
Resolution: --- → FIXED
Target Milestone: --- → 98 Branch
Upstream PR merged by moz-wptsync-bot
Regressions: 1752693
Regressions: 1753105
Regressions: 1755770
Component: Inspector → SVG
Product: DevTools → Core
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Creator:
Created:
Updated:
Size: