Add getPathSegmentAtLength method

[pepelsbey]

Description

Documents new getPathSegmentAtLength method shipped behind a flag in Firefox 136, enabled by default in Firefox 137.

Additional details

Already in BCD and in all relevant release notes.

• https://bugzilla.mozilla.org/show_bug.cgi?id=1934525
• https://bugzilla.mozilla.org/show_bug.cgi?id=1945312

Related issues and pull requests

• [WebAPI] Implement new path data API #37940

[github-actions]

Preview URLs

• /en-US/docs/Web/API/SVGPathElement/getPathSegmentAtLength
• /en-US/docs/Web/API/SVGPathElement

Flaws (43)

Note! 1 document with no flaws that don't need to be listed. 🎉

URL: /en-US/docs/Web/API/SVGPathElement
Title: SVGPathElement
Flaw count: 43

• macros:
  • Macro produces link /en-US/docs/Web/SVG/Element/path which is a redirect
  • Macro produces link /en-US/docs/Web/SVG/Attribute/pathLength which is a redirect
  • Can't resolve /en-US/docs/Web/API/SVGPathElement/getPathSegAtLength
  • Can't resolve /en-US/docs/Web/API/SVGAnimatedPathData/pathSegList
  • Can't resolve /en-US/docs/Web/API/SVGPathElement/createSVGPathSegClosePath
  • and 38 more flaws omitted

(comment last updated: 2025-03-28 16:33:49)

[Josh-Cena]

Force pushed to remove all the extraneous history.

[estelle]

some suggestions

[estelle]

We need to add the SVGPathSegment interface so we can link to {{domxref("SVGPathSegment")}} so the red links at https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/137 work.

Suggested change

	A path segment object. If no valid segment exists, returns null.
	A {{domxref("SVGPathSegment")}}. If no valid segment exists, returns `null`.

Then we can move the rest of this return value into the interface page, like we do with all other SVG props

[hamishwillee]

Fair enough. This one is my bad - I thought the property was essentially a dictionary.

[pepelsbey]

@estelle we were already working with @hamishwillee on this PR and another one, fixing red underlines in the release notes. The SVGPathSegment interface is not supposed to be mentioned in the release notes. It’s not supported in Firefox.

Yes, all new SVG data APIs are supposed to work with the SVGPathSegment interface, but there’s a problem: it’s not implemented anywhere. I checked all SVG interfaces listed on the SVG API page: they are all supported in browsers, with a few deprecated exceptions.

Since window['SVGPathSegment'] !== undefined returns false, I don’t think we should document an interface that’s not implemented in any browser. Instead, I called those path data “segments” and described their structure.

I’d like to move on with the existing approach and update it in the future if needed.

[estelle]

Suggested change

	console.log(path.getPathSegmentAtLength(65));
	console.dir(path.getPathSegmentAtLength(65));

or

Suggested change

	console.log(path.getPathSegmentAtLength(65));
	const pathSegment = path.getPathSegmentAtLength(65);
	console.log(pathSegment.type); // output: "v"
	console.log(pathSegment.value); // output: 64

[pepelsbey]

Unfortunately, it’s not self-evident why any of these are better than just logging. Could you please expand?

[estelle]

Suggested change

	- : Returns the segment at a given distance along the path.
	- : Returns the {{domxref("SVGPathSegment")}} at the given distance along the path.