Re: [blink-dev] Intent to Ship: object-fit and object-position apply to SVG documents in and

Wed, 07 Oct 2026 08:11:36 -0700

LGTM3 with the same requirement

On Fri, Oct 2, 2026 at 7:00 PM Chris Harrelson <[email protected]>
wrote:

> Great! LGTM2 contingent on landing cross-origin object support and a
> corresponding test.
>
> On Fri, Oct 2, 2026 at 9:34 AM Felipe Erias <[email protected]>
> wrote:
>
>> This Intent was initially about enabling the current implementation by
>> default, but I agree that it should also work for cross-origin objects
>> before shipping.
>>
>> The remaining gap is out-of-process frames. I am implementing the fix and
>> will upload the CLs shortly.
>>
>> This feature only covers SVG documents in <object> and <embed>. It will
>> not apply to responsively-sized iframes, at least not in this Intent. The
>> CSS Sizing 4 spec limits responsive sizing to HTML documents in iframes,
>> and excludes SVG documents for the time being:
>>
>> > Note: Currently, the HTML <meta> element appearing in the <head> of an
>> HTML document is the only way for an embedded document to opt into this
>> feature in HTML. This means that SVG documents in <iframe> cannot do so.
>>
>> https://drafts.csswg.org/css-sizing-4/#iframe-frame-sizing
>>
>> On Thursday, 1 October 2026 at 00:20:13 UTC+9 Chris Harrelson wrote:
>>
>>> I think this needs to work for cross-origin objects before shipping,
>>> could you please implement the TODO?
>>>
>>> Also, a feature for responsively sized iframes was recently shipped,
>>> should this layout feature apply to those iframes?
>>>
>>> On Tue, Sep 29, 2026 at 7:22 AM Felipe Erias <[email protected]>
>>> wrote:
>>>
>>>> Thank you.
>>>>
>>>> This Intent is only about <embed> and <object>, which are the cases
>>>> covered by WPT tests and supported by other browsers (already implemented
>>>> in Firefox, open bug in WebKit).
>>>>
>>>> My first CL placed this change in LayoutEmbeddedContent, so it would
>>>> have also applied to iframes. This did not have any actual impact because
>>>> iframes don't report natural dimensions, and the code was moved to
>>>> LayoutEmbeddedObject in a second CL.
>>>>
>>>> The current implementation does not yet support the case where the SVG
>>>> comes from a different site and is rendered in a separate process:
>>>> <object data="https://other-site.net/chart.svg"; style="width: 400px;
>>>> height: 400px; object-fit: contain"></object>
>>>>
>>>> This is a known limitation, noted with a TODO in
>>>> LayoutEmbeddedObject::ReplacedContentRectFrom:
>>>> // TODO(crbug.com/41302806): Only works for same-origin content
>>>> (LocalFrame).
>>>>
>>>> Best,
>>>> Felipe
>>>>
>>>> On Tuesday, 22 September 2026 at 05:46:57 UTC+9 Stephen Chenney wrote:
>>>>
>>>>> On Mon, Sep 21, 2026 at 3:03 PM Mike Taylor <[email protected]>
>>>>> wrote:
>>>>>
>>>>>>
>>>>>> On 9/20/26 10:54 p.m., Chromestatus wrote:
>>>>>>
>>>>>> *Contact emails*
>>>>>> [email protected]
>>>>>>
>>>>>> *Specification*
>>>>>>
>>>>>> https://html.spec.whatwg.org/multipage/rendering.html#embedded-content-rendering-rules
>>>>>>
>>>>>> *Summary*
>>>>>> SVG documents loaded through <object> or <embed> are sized and
>>>>>> positioned inside the element's content box according to the CSS 
>>>>>> object-fit
>>>>>> and object-position properties, the same way <img> content is. Previously
>>>>>> Chrome ignored both properties for embedded SVG documents and always
>>>>>> stretched the document viewport to the whole content box.
>>>>>>
>>>>>> *Blink component*
>>>>>> Blink>SVG
>>>>>> <https://issues.chromium.org/issues?q=customfield1222907:%22Blink%3ESVG%22>
>>>>>>
>>>>>> *Web Feature ID*
>>>>>> object-fit <https://webstatus.dev/features/object-fit>
>>>>>>
>>>>>> *Motivation*
>>>>>> Authors use object-fit and object-position to control how replaced
>>>>>> content is scaled and placed inside its box.
>>>>>> https://drafts.csswg.org/css-images-3/#the-object-fit
>>>>>> https://drafts.csswg.org/css-images-3/#the-object-position
>>>>>> Currently, Chrome applies them to images and videos but ignores them for
>>>>>> SVG documents loaded through <object> or <embed>, which are always
>>>>>> stretched to fill the element. The fix has been implemented behind the
>>>>>> SVGEmbeddedAsReplacedElement flag since M141. This entry ships it by
>>>>>> default.
>>>>>>
>>>>>> *Initial public proposal*
>>>>>> *No information provided*
>>>>>>
>>>>>> *Search tags*
>>>>>> svg <http:///features#tags:svg>, object-fit
>>>>>> <http:///features#tags:object-fit>, object-position
>>>>>> <http:///features#tags:object-position>
>>>>>>
>>>>>> *TAG review*
>>>>>> *No information provided*
>>>>>>
>>>>>> *TAG review status*
>>>>>> Not applicable
>>>>>>
>>>>>> *Goals for experimentation*
>>>>>> None
>>>>>>
>>>>>> *Risks*
>>>>>>
>>>>>>
>>>>>> *Interoperability and Compatibility*
>>>>>> With the initial values (object-fit: fill; object-position: 50% 50%)
>>>>>> the replaced content rect is the whole content box, so pages that do not
>>>>>> set these properties render as before. Rendering changes where authors
>>>>>> intentionally set object-fit / object-position on an <object>/<embed>
>>>>>> hosting an SVG document. Firefox already applies both properties in this
>>>>>> case; Safari not yet (https://bugs.webkit.org/show_bug.cgi?id=317804).
>>>>>> Rendering also changes in fullscreen, where the UA stylesheet sets
>>>>>> object-fit: contain for a fullscreen <object>/<embed>. This is tested by
>>>>>> https://wpt.fyi/results/fullscreen/rendering/backdrop-object.html
>>>>>> (Firefox and Safari time out on that test for harness reasons, test can 
>>>>>> be
>>>>>> verified manually on Firefox.) Only <object> and <embed> are affected;
>>>>>> <iframe> is unchanged, as in Firefox. Known limitation: SVG documents
>>>>>> hosted in an out-of-process frame are not covered and keep the old
>>>>>> behaviour.
>>>>>>
>>>>>> Could you elaborate on why the OOPIF behavior differs? Sometimes SVG
>>>>> is embedded in an iframe and I would expect sizing to work the same in 
>>>>> that
>>>>> context.
>>>>>
>>>>>>
>>>>>>
>>>>>> *Gecko*: Shipped/Shipping (https://wpt.fyi/results/css/css-images) See
>>>>>> the related WPT tests in the css-images folders.
>>>>>>
>>>>>> *WebKit*: No signal (https://bugs.webkit.org/show_bug.cgi?id=317804) Bug
>>>>>> still in the NEW status.
>>>>>>
>>>>>> Can we request an official signal from WebKit please?
>>>>>>
>>>>>>
>>>>>> *Web developers*: No signals
>>>>>>
>>>>>> *Other signals*:
>>>>>>
>>>>>> *WebView application risks*
>>>>>>
>>>>>> Does this intent deprecate or change behavior of existing APIs, such
>>>>>> that it has potentially high risk for Android WebView-based applications?
>>>>>> None.
>>>>>>
>>>>>>
>>>>>> *Debuggability*
>>>>>> No changes, as object-fit and object-position are already supported
>>>>>> by DevTools.
>>>>>>
>>>>>> *Will this feature be supported on all six Blink platforms (Windows,
>>>>>> Mac, Linux, ChromeOS, Android, and Android WebView)?*
>>>>>> Yes
>>>>>>
>>>>>> *Is this feature fully tested by web-platform-tests
>>>>>> <https://chromium.googlesource.com/chromium/src/+/main/docs/testing/web_platform_tests.md>?*
>>>>>> Yes
>>>>>>
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-contain-svg-001e.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-contain-svg-001o.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-contain-svg-002e.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-contain-svg-002o.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-contain-svg-003e.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-contain-svg-003o.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-contain-svg-004e.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-contain-svg-004o.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-contain-svg-005e.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-contain-svg-005o.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-contain-svg-006e.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-contain-svg-006o.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-cover-svg-001e.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-cover-svg-001o.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-cover-svg-002e.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-cover-svg-002o.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-cover-svg-003e.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-cover-svg-003o.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-cover-svg-004e.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-cover-svg-004o.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-cover-svg-005e.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-cover-svg-005o.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-cover-svg-006e.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-cover-svg-006o.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-dyn-aspect-ratio-001.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-dyn-aspect-ratio-002.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-fill-svg-001e.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-fill-svg-001o.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-fill-svg-002e.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-fill-svg-002o.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-fill-svg-003e.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-fill-svg-003o.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-fill-svg-004e.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-fill-svg-004o.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-fill-svg-005e.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-fill-svg-005o.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-fill-svg-006e.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-fill-svg-006o.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-none-svg-001e.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-none-svg-001o.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-none-svg-002e.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-none-svg-002o.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-none-svg-003e.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-none-svg-003o.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-none-svg-004e.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-none-svg-004o.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-none-svg-005e.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-none-svg-005o.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-none-svg-006e.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-none-svg-006o.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-scale-down-svg-001e.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-scale-down-svg-001o.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-scale-down-svg-002e.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-scale-down-svg-002o.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-scale-down-svg-003e.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-scale-down-svg-003o.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-scale-down-svg-004e.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-scale-down-svg-004o.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-scale-down-svg-005e.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-scale-down-svg-005o.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-scale-down-svg-006e.html
>>>>>> https://wpt.fyi/results/css/css-images/object-fit-scale-down-svg-006o.html
>>>>>>
>>>>>> *Flag name on about://flags*
>>>>>> SVGEmbeddedAsReplacedElement
>>>>>>
>>>>>> *Finch feature name*
>>>>>> SVGEmbeddedAsReplacedElement
>>>>>>
>>>>>> *Rollout plan*
>>>>>> Will ship enabled for all users
>>>>>>
>>>>>> *Requires code in //chrome?*
>>>>>> False
>>>>>>
>>>>>> *Tracking bug*
>>>>>> https://issues.chromium.org/41302806
>>>>>>
>>>>>> *Estimated milestones*
>>>>>> Shipping on desktop 157
>>>>>> Shipping on Android 157
>>>>>> Shipping on WebView 157
>>>>>>
>>>>>> *Anticipated spec changes*
>>>>>>
>>>>>> Open questions about a feature may be a source of future web compat
>>>>>> or interop issues. Please list open issues (e.g. links to known github
>>>>>> issues in the project for the feature specification) whose resolution may
>>>>>> introduce web compat/interop risk (e.g., changing to naming or structure 
>>>>>> of
>>>>>> the API in a non-backward-compatible way).
>>>>>> None.
>>>>>>
>>>>>> *Link to entry on the Chrome Platform Status*
>>>>>>
>>>>>> https://chromestatus.com/feature/4886345347629056?gate=4869870255734784
>>>>>>
>>>>>> This intent message was generated by Chrome Platform Status
>>>>>> <https://chromestatus.com>.
>>>>>> --
>>>>>> You received this message because you are subscribed to the Google
>>>>>> Groups "blink-dev" group.
>>>>>> To unsubscribe from this group and stop receiving emails from it,
>>>>>> send an email to [email protected].
>>>>>> To view this discussion visit
>>>>>> https://groups.google.com/a/chromium.org/d/msgid/blink-dev/6ab09c5b.60d96795.386b54.0022.GAE%40google.com
>>>>>> <https://groups.google.com/a/chromium.org/d/msgid/blink-dev/6ab09c5b.60d96795.386b54.0022.GAE%40google.com?utm_medium=email&utm_source=footer>
>>>>>> .
>>>>>>
>>>>>> --
>>>>>> You received this message because you are subscribed to the Google
>>>>>> Groups "blink-dev" group.
>>>>>> To unsubscribe from this group and stop receiving emails from it,
>>>>>> send an email to [email protected].
>>>>>>
>>>>> To view this discussion visit
>>>>>> https://groups.google.com/a/chromium.org/d/msgid/blink-dev/93ad2edf-af73-4e2e-a3e9-81700e2aeb0e%40chromium.org
>>>>>> <https://groups.google.com/a/chromium.org/d/msgid/blink-dev/93ad2edf-af73-4e2e-a3e9-81700e2aeb0e%40chromium.org?utm_medium=email&utm_source=footer>
>>>>>> .
>>>>>>
>>>>> --
>>>> You received this message because you are subscribed to the Google
>>>> Groups "blink-dev" group.
>>>> To unsubscribe from this group and stop receiving emails from it, send
>>>> an email to [email protected].
>>>>
>>> To view this discussion visit
>>>> https://groups.google.com/a/chromium.org/d/msgid/blink-dev/500023cb-1801-472e-8543-591b8a030ecdn%40chromium.org
>>>> <https://groups.google.com/a/chromium.org/d/msgid/blink-dev/500023cb-1801-472e-8543-591b8a030ecdn%40chromium.org?utm_medium=email&utm_source=footer>
>>>> .
>>>>
>>> --
>> You received this message because you are subscribed to the Google Groups
>> "blink-dev" group.
>> To unsubscribe from this group and stop receiving emails from it, send an
>> email to [email protected].
>> To view this discussion visit
>> https://groups.google.com/a/chromium.org/d/msgid/blink-dev/008228d2-dbae-4647-a30f-21c0e0a1383fn%40chromium.org
>> <https://groups.google.com/a/chromium.org/d/msgid/blink-dev/008228d2-dbae-4647-a30f-21c0e0a1383fn%40chromium.org?utm_medium=email&utm_source=footer>
>> .
>>
> --
> You received this message because you are subscribed to the Google Groups
> "blink-dev" group.
> To unsubscribe from this group and stop receiving emails from it, send an
> email to [email protected].
> To view this discussion visit
> https://groups.google.com/a/chromium.org/d/msgid/blink-dev/CAOMQ%2Bw-uvLAwvoJ3dmpsbNnvKy2yQWnz5AJumuDhEsTE8owRtQ%40mail.gmail.com
> <https://groups.google.com/a/chromium.org/d/msgid/blink-dev/CAOMQ%2Bw-uvLAwvoJ3dmpsbNnvKy2yQWnz5AJumuDhEsTE8owRtQ%40mail.gmail.com?utm_medium=email&utm_source=footer>
> .
>

-- 
You received this message because you are subscribed to the Google Groups 
"blink-dev" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to [email protected].
To view this discussion visit 
https://groups.google.com/a/chromium.org/d/msgid/blink-dev/CAFUtAY9%2B%2BHH44UBmVHov5kHhV32fqnGnTGOeitFHH3hfbnWd7g%40mail.gmail.com.

Reply via email to