Mirrors/servo
1
0
Fork 0
mirror of https://github.com/servo/servo.git synced 2025-06-06 16:45:39 +00:00
Code Issues Projects Releases Packages Wiki Activity
servo/tests/wpt/meta/css/css-flexbox
History
Mukilan Thiyagarajan 8a20e42de4
Add support for static SVG images using resvg crate (#36721) 
This change adds support for rendering static SVG images using the
`resvg` crate, allowing svg sources in the `img` tag and in CSS
`background` and `content` properties. There are some limitations in
using resvg:

1. There is no support for animations or interactivity as these would
require implementing the full DOM layer of SVG specification.
2. Only system fonts can be used for text rendering. There is some
mechanism to provide a custom font resolver to usvg, but that is not
explored in this change.
3. resvg's handling of certain edge cases involving lack of explicit
`width` and `height` on the root svg element deviates from what the
specification expects from browsers. For example, resvg uses the values
in `viewBox` to derive the missing width or height dimension, but
without scaling that dimension to preserve the aspect ratio. It also
doesn't allow overriding this behavior.

Demo screenshot:
![servo - resvg
img](https://github.com/user-attachments/assets/8ecb2de2-ab7c-48e2-9f08-2d09d2cb8791)

<details>
<summary>Source</summary>

```
<style>
 #svg1 {
   border: 1px solid red;
 }

 #svg2 {
   border: 1px solid red;
   width: 300px;
 }
 #svg3 {
   border: 1px solid red;
   width: 300px;
   height: 200px;
   object-fit: contain;
 }
 #svg4 {
   border: 1px solid red;
   width: 300px;
   height: 200px;
   object-fit: cover;
 }
 #svg5 {
   border: 1px solid red;
   width: 300px;
   height: 200px;
   object-fit: fill;
 }
 #svg6 {
   border: 1px solid red;
   width: 300px;
   height: 200px;
   object-fit: none;
 }
</style>
</head>
<body>
        <div>
          <img id="svg1" src="https://raw.githubusercontent.com/servo/servo/refs/heads/main/resources/servo.svg" alt="Servo logo">
        </div>
        <div>
          <img id="svg2" src="https://raw.githubusercontent.com/servo/servo/refs/heads/main/resources/servo.svg" alt="Servo logo">
          <img id="svg3" src="https://raw.githubusercontent.com/servo/servo/refs/heads/main/resources/servo.svg" alt="Servo logo">
          <img id="svg4" src="https://raw.githubusercontent.com/servo/servo/refs/heads/main/resources/servo.svg" alt="Servo logo">
        </div>
        <div>
          <img id="svg5" src="https://raw.githubusercontent.com/servo/servo/refs/heads/main/resources/servo.svg" alt="Servo logo">
          <img id="svg6" src="https://raw.githubusercontent.com/servo/servo/refs/heads/main/resources/servo.svg" alt="Servo logo">
        </div>
</body>
```

</details>

---------

Signed-off-by: Mukilan Thiyagarajan <mukilan@igalia.com>
Signed-off-by: Martin Robinson <mrobinson@igalia.com>
Co-authored-by: Martin Robinson <mrobinson@igalia.com>
2025-05-27 11:02:40 +00:00
..
abspos layout: Stop ignoring containing block padding for the static position (#36051) 2025-03-19 11:47:52 +00:00
alignment Enable layout_grid_enabled pref for all tests (#36316) 2025-04-03 18:48:05 +00:00
animation Let animations&transitions fall back to discrete interpolation (#34981) 2025-01-30 20:36:55 +00:00
intrinsic-size layout: Fix min-content inline size of multi-line row flex container (#37011) 2025-05-21 06:57:50 +00:00
parsing Update web-platform-tests to revision b'9d20f3ae600d00673a27a69f69e13d4cd8eca443' (#36195) 2025-03-28 06:07:42 +00:00
align-baseline.html.ini
align-content-wmvert-001.html.ini Fix offsetLeft/offsetTop to match major browsers (#32761) 2024-11-16 15:28:38 +00:00
align-content-wrap-001.html.ini layout2020 (flexbox): Implement start, end, and space-evenly content alignment (#31724) 2024-04-28 23:17:11 +00:00
align-content-wrap-003.html.ini layout: align-content with default value normal should behave as strech in flex container (#35178) 2025-02-03 08:27:55 +00:00
align-items-004.htm.ini
align-items-007.html.ini Add support for static SVG images using resvg crate (#36721) 2025-05-27 11:02:40 +00:00
align-items-baseline-column-horz.html.ini
align-items-baseline-column-vert-lr-flexbox-item.html.ini Fix offsetLeft/offsetTop to match major browsers (#32761) 2024-11-16 15:28:38 +00:00
align-items-baseline-column-vert-lr-grid-item.html.ini Fix offsetLeft/offsetTop to match major browsers (#32761) 2024-11-16 15:28:38 +00:00
align-items-baseline-column-vert-lr-table-item.html.ini Fix offsetLeft/offsetTop to match major browsers (#32761) 2024-11-16 15:28:38 +00:00
align-items-baseline-column-vert-rl-flexbox-item.html.ini
align-items-baseline-column-vert-rl-grid-item.html.ini
align-items-baseline-column-vert-rl-items.html.ini
align-items-baseline-column-vert-rl-table-item.html.ini
align-items-baseline-column-vert.html.ini
align-items-baseline-row-horz.html.ini
align-items-baseline-row-vert.html.ini
align-items-baseline-vert-lr-column-horz-flexbox-item.html.ini Fix offsetLeft/offsetTop to match major browsers (#32761) 2024-11-16 15:28:38 +00:00
align-items-baseline-vert-lr-column-horz-grid-item.html.ini Fix offsetLeft/offsetTop to match major browsers (#32761) 2024-11-16 15:28:38 +00:00
align-items-baseline-vert-lr-column-horz-items.html.ini Fix offsetLeft/offsetTop to match major browsers (#32761) 2024-11-16 15:28:38 +00:00
align-items-baseline-vert-lr-column-horz-table-item.html.ini
align-items-baseline-vert-rl-column-horz-flexbox-item.html.ini Fix offsetLeft/offsetTop to match major browsers (#32761) 2024-11-16 15:28:38 +00:00
align-items-baseline-vert-rl-column-horz-grid-item.html.ini Fix offsetLeft/offsetTop to match major browsers (#32761) 2024-11-16 15:28:38 +00:00
align-items-baseline-vert-rl-column-horz-items.html.ini Fix offsetLeft/offsetTop to match major browsers (#32761) 2024-11-16 15:28:38 +00:00
align-items-baseline-vert-rl-column-horz-table-item.html.ini
aspect-ratio-intrinsic-size-003.html.ini
aspect-ratio-intrinsic-size-004.html.ini
aspect-ratio-intrinsic-size-005.html.ini
aspect-ratio-intrinsic-size-007.html.ini Add support for static SVG images using resvg crate (#36721) 2025-05-27 11:02:40 +00:00
aspect-ratio-intrinsic-size-008.html.ini Update web-platform-tests to revision b'4c3d068f942231dc905ea283e4f82bd70801c37c' (#33461) 2024-09-15 01:26:41 +00:00
aspect-ratio-intrinsic-size-009.html.ini Update web-platform-tests to revision b'4c3d068f942231dc905ea283e4f82bd70801c37c' (#33461) 2024-09-15 01:26:41 +00:00
aspect-ratio-intrinsic-size-010.html.ini Update web-platform-tests to revision b'38623a53d6598cb7aab4be8a810102b352a652df' (#34622) 2024-12-15 03:52:07 +00:00
aspect-ratio-transferred-max-size.html.ini Sync WPT with upstream (06-10-2024) (#33668) 2024-10-06 02:45:43 +00:00
auto-margins-003.html.ini
baseline-outside-flex-item.html.ini Sync WPT with upstream (06-10-2024) (#33668) 2024-10-06 02:45:43 +00:00
baseline-synthesis-001.html.ini
baseline-synthesis-002.html.ini
baseline-synthesis-003.html.ini
baseline-synthesis-004.html.ini
baseline-synthesis-vert-lr-line-under.html.ini Sync WPT with upstream (24-10-2023) (#30607) 2023-10-25 07:26:53 +00:00
content-height-with-scrollbars.html.ini
cross-axis-scrollbar.html.ini
css-flexbox-row-reverse-wrap-reverse.html.ini
css-flexbox-row-reverse-wrap.html.ini
css-flexbox-row-reverse.html.ini
css-flexbox-row-wrap-reverse.html.ini
css-flexbox-row-wrap.html.ini
css-flexbox-row.html.ini
css-flexbox-test1.html.ini
dynamic-isize-change-004.html.ini
fieldset-as-container-justify-center.tentative.html.ini Obey min and max properties when computing main size of column flex (#34450) 2024-12-02 22:14:54 +00:00
fieldset-baseline-alignment.html.ini layout: Implement support for line-height and vertical-align (#30902) 2024-01-08 14:49:50 +00:00
fixed-table-layout-with-percentage-width-in-flex-item.html.ini
flex-aspect-ratio-img-column-008.html.ini
flex-aspect-ratio-img-column-013.html.ini
flex-aspect-ratio-img-column-014.html.ini
flex-aspect-ratio-img-column-015.html.ini
flex-aspect-ratio-img-column-017.html.ini
flex-aspect-ratio-img-column-018.html.ini
flex-aspect-ratio-img-row-008.html.ini
flex-aspect-ratio-img-row-009.html.ini
flex-aspect-ratio-img-row-010.html.ini
flex-aspect-ratio-img-row-011.html.ini
flex-aspect-ratio-img-row-015.html.ini
flex-basis-009.html.ini
flex-basis-intrinsics-001.html.ini layout: Basic implementation of size keywords on flex-basis (#35413) 2025-02-13 15:24:06 +00:00
flex-container-max-content-001.html.ini
flex-container-max-content-002.tentative.html.ini layout: Obey intrinsic min/max block sizes on flex containers (#36973) 2025-05-15 07:57:07 +00:00
flex-container-min-content-001.html.ini
flex-container-min-content-002.tentative.html.ini layout: Fix min-content inline size of multi-line row flex container (#37011) 2025-05-21 06:57:50 +00:00
flex-factor-less-than-one.html.ini layout: Initial implementation of flex-direction: column and column-reverse (#33031) 2024-08-14 14:25:09 +00:00
flex-flow-013.html.ini layout: Properly calculate free space in flexbox flexible length resolution (#34150) 2024-11-05 13:32:34 +00:00
flex-inline.html.ini layout: Implement support for line-height and vertical-align (#30902) 2024-01-08 14:49:50 +00:00
flex-item-compressible-001.html.ini layout: Add very basic support for showing text in input boxes (#32365) 2024-06-20 10:13:50 +00:00
flex-item-compressible-002.html.ini layout: Initial implementation of flex-direction: column and column-reverse (#33031) 2024-08-14 14:25:09 +00:00
flex-item-contains-strict.html.ini Fix intrinsic sizing of column flex containers (#33299) 2024-09-04 06:44:31 +00:00
flex-item-transferred-sizes-padding-border-sizing.html.ini
flex-item-transferred-sizes-padding-content-sizing.html.ini
flex-minimum-height-flex-items-029.html.ini
flex-minimum-height-flex-items-031.html.ini Fix automatic minimum size for column flexbox (#33248) 2024-08-29 16:55:44 +00:00
flex-minimum-size-002.html.ini Obey min and max properties when computing main size of column flex (#34450) 2024-12-02 22:14:54 +00:00
flex-one-sets-flex-basis-to-zero-px.html.ini Update web-platform-tests to revision b'4c3d068f942231dc905ea283e4f82bd70801c37c' (#33461) 2024-09-15 01:26:41 +00:00
flex-shorthand-calc.html.ini Update web-platform-tests to revision b'9d20f3ae600d00673a27a69f69e13d4cd8eca443' (#36195) 2025-03-28 06:07:42 +00:00
flexbox-align-self-baseline-horiz-001b.xhtml.ini
flexbox-align-self-baseline-horiz-003.xhtml.ini
flexbox-align-self-baseline-horiz-005.xhtml.ini
flexbox-align-self-baseline-horiz-006.xhtml.ini
flexbox-align-self-baseline-horiz-007.xhtml.ini
flexbox-align-self-baseline-horiz-008.xhtml.ini
flexbox-align-self-horiz-004.xhtml.ini
flexbox-align-self-vert-001.xhtml.ini
flexbox-align-self-vert-002.xhtml.ini
flexbox-align-self-vert-003.xhtml.ini
flexbox-align-self-vert-004.xhtml.ini
flexbox-align-self-vert-rtl-005.xhtml.ini
flexbox-baseline-align-self-baseline-vert-001.html.ini
flexbox-baseline-multi-item-horiz-001a.html.ini
flexbox-baseline-multi-item-horiz-001b.html.ini
flexbox-baseline-multi-item-vert-001a.html.ini
flexbox-baseline-multi-item-vert-001b.html.ini
flexbox-baseline-multi-line-horiz-001.html.ini layout: Implement support for line-height and vertical-align (#30902) 2024-01-08 14:49:50 +00:00
flexbox-baseline-multi-line-horiz-002.html.ini
flexbox-baseline-multi-line-horiz-003.html.ini
flexbox-baseline-multi-line-horiz-004.html.ini
flexbox-baseline-multi-line-vert-001.html.ini
flexbox-baseline-multi-line-vert-002.html.ini
flexbox-baseline-single-item-001a.html.ini layout: Implement support for line-height and vertical-align (#30902) 2024-01-08 14:49:50 +00:00
flexbox-baseline-single-item-001b.html.ini layout: Implement support for line-height and vertical-align (#30902) 2024-01-08 14:49:50 +00:00
flexbox-basic-block-horiz-001v.xhtml.ini
flexbox-basic-block-vert-001v.xhtml.ini
flexbox-collapsed-item-baseline-001.html.ini
flexbox-collapsed-item-horiz-001.html.ini layout: Compute intrinsic sizes for flex items and flex containers (#32854) 2024-08-02 06:45:11 +00:00
flexbox-collapsed-item-horiz-002.html.ini
flexbox-collapsed-item-horiz-003.html.ini
flexbox-column-row-gap-001.html.ini
flexbox-column-row-gap-002.html.ini
flexbox-column-row-gap-004.html.ini
flexbox-definite-sizes-003.html.ini
flexbox-definite-sizes-004.html.ini
flexbox-flex-wrap-flexing-003.html.ini Update web-platform-tests to revision b'38623a53d6598cb7aab4be8a810102b352a652df' (#34622) 2024-12-15 03:52:07 +00:00
flexbox-flex-wrap-vert-002.html.ini
flexbox-items-as-stacking-contexts-002.html.ini
flexbox-justify-content-horiz-001a.xhtml.ini
flexbox-justify-content-horiz-001b.xhtml.ini
flexbox-justify-content-horiz-003.xhtml.ini
flexbox-justify-content-horiz-005.xhtml.ini
flexbox-justify-content-horiz-006.xhtml.ini
flexbox-justify-content-vert-005.xhtml.ini
flexbox-justify-content-vert-006.xhtml.ini
flexbox-justify-content-wmvert-001.xhtml.ini
flexbox-justify-content-wmvert-002.html.ini
flexbox-justify-content-wmvert-003.html.ini
flexbox-mbp-horiz-002v.xhtml.ini
flexbox-mbp-horiz-003-reverse.xhtml.ini Mark flexbox-mbp-horiz-003 tests as only failing on linux (#32762) 2024-07-17 07:49:41 +00:00
flexbox-mbp-horiz-003.xhtml.ini Mark flexbox-mbp-horiz-003 tests as only failing on linux (#32762) 2024-07-17 07:49:41 +00:00
flexbox-mbp-horiz-003v.xhtml.ini Mark flexbox-mbp-horiz-003 tests as only failing on linux (#32762) 2024-07-17 07:49:41 +00:00
flexbox-min-width-auto-006.html.ini
flexbox-safe-overflow-position-001.html.ini
flexbox-safe-overflow-position-003.html.ini
flexbox-safe-overflow-position-004.html.ini Sync WPT with upstream (28-01-2024) (#31204) 2024-01-28 18:33:58 +00:00
flexbox-safe-overflow-position-006.html.ini layout: Add support for basic transform css properties (#35926) 2025-03-14 14:46:20 +00:00
flexbox-sizing-vert-001.xhtml.ini
flexbox-writing-mode-002.html.ini
flexbox-writing-mode-003.html.ini
flexbox-writing-mode-004.html.ini
flexbox-writing-mode-005.html.ini
flexbox-writing-mode-006.html.ini
flexbox-writing-mode-008.html.ini
flexbox-writing-mode-009.html.ini
flexbox-writing-mode-010.html.ini
flexbox-writing-mode-011.html.ini
flexbox-writing-mode-012.html.ini
flexbox-writing-mode-013.html.ini
flexbox-writing-mode-014.html.ini
flexbox-writing-mode-015.html.ini
flexbox-writing-mode-slr-row-mix.html.ini Update web-platform-tests to revision b'3634d5a63f2fa3969616396d95537c91c3348fe5' (#32959) 2024-08-07 10:15:56 +00:00
flexbox-writing-mode-slr-rtl.html.ini Update web-platform-tests to revision b'3634d5a63f2fa3969616396d95537c91c3348fe5' (#32959) 2024-08-07 10:15:56 +00:00
flexbox-writing-mode-slr.html.ini Update web-platform-tests to revision b'3634d5a63f2fa3969616396d95537c91c3348fe5' (#32959) 2024-08-07 10:15:56 +00:00
flexbox-writing-mode-srl-row-mix.html.ini Update web-platform-tests to revision b'3634d5a63f2fa3969616396d95537c91c3348fe5' (#32959) 2024-08-07 10:15:56 +00:00
flexbox-writing-mode-srl-rtl.html.ini Update web-platform-tests to revision b'3634d5a63f2fa3969616396d95537c91c3348fe5' (#32959) 2024-08-07 10:15:56 +00:00
flexbox-writing-mode-srl.html.ini Update web-platform-tests to revision b'3634d5a63f2fa3969616396d95537c91c3348fe5' (#32959) 2024-08-07 10:15:56 +00:00
flexbox_align-items-stretch-3.html.ini Resolve cyclic margin and padding percentages against zero (#30085) 2023-08-10 11:38:44 +00:00
flexbox_inline.html.ini
flexbox_justifycontent-left-001.html.ini
flexbox_justifycontent-left-002.html.ini
flexbox_justifycontent-right-001.html.ini
flexbox_justifycontent-right-002.html.ini
flexbox_justifycontent-rtl-001.html.ini layout: Right-to-left support for other layout modes (#33375) 2024-09-11 13:40:11 +00:00
flexbox_rtl-flow-reverse.html.ini
flexbox_rtl-flow.html.ini
flexbox_rtl-order.html.ini
flexbox_visibility-collapse-line-wrapping.html.ini
flexbox_visibility-collapse.html.ini
flexbox_writing_mode_vertical_lays_out_contents_from_top_to_bottom.html.ini
gap-006-lr.html.ini
gap-006-ltr.html.ini
gap-006-rl.html.ini
gap-006-rtl.html.ini
gap-015.html.ini
gap-018.html.ini
grid-flex-item-001.html.ini
hittest-overlapping-margin.html.ini
hittest-overlapping-order.html.ini
inline-flexbox-wrap-vertically-width-calculation.html.ini Update web-platform-tests to revision b'ec9b870fec350e59e9db48ae2858e914a07f38d6' (#33359) 2024-09-08 01:41:09 +00:00
intrinsic-width-orthogonal-writing-mode.html.ini layout: Compute intrinsic sizes for flex items and flex containers (#32854) 2024-08-02 06:45:11 +00:00
justify-content-sideways-001.html.ini Update web-platform-tests to revision b'4c3d068f942231dc905ea283e4f82bd70801c37c' (#33461) 2024-09-15 01:26:41 +00:00
multiline-min-max.html.ini
multiline-reverse-wrap-baseline.html.ini
multiline-shrink-to-fit.html.ini Update web-platform-tests to revision b'ec9b870fec350e59e9db48ae2858e914a07f38d6' (#33359) 2024-09-08 01:41:09 +00:00
negative-overflow-002.html.ini
negative-overflow-003.html.ini Update web-platform-tests to revision b'8e164c249d2b93a4234a2710a5e2cc5a16fab499' (#33515) 2024-09-22 01:24:38 +00:00
negative-overflow.html.ini layout: Account for transform in scrollable overflow (#36138) 2025-04-29 09:37:27 +00:00
overflow-auto-005.html.ini
overflow-top-left.html.ini
percentage-heights-000.html.ini layout: Initial implementation of flex-direction: column and column-reverse (#33031) 2024-08-14 14:25:09 +00:00
percentage-heights-003.html.ini layout: Initial implementation of flex-direction: column and column-reverse (#33031) 2024-08-14 14:25:09 +00:00
percentage-heights-004.html.ini layout: Initial implementation of flex-direction: column and column-reverse (#33031) 2024-08-14 14:25:09 +00:00
percentage-heights-012.html.ini
percentage-heights-013.html.ini Sync WPT with upstream (04-10-2023) (#30493) 2023-10-06 00:51:48 +00:00
percentage-padding-003.html.ini
percentage-padding-004.html.ini
percentage-size-quirks-002.html.ini Take spaces into account in the max-content size of an IFC (#31613) 2024-03-11 12:01:53 +00:00
scrollbars-auto.html.ini
scrollbars-no-margin.html.ini
scrollbars.html.ini
stretch-input-in-column.html.ini
svg-no-natural-size-grandchild.html.ini
svg-root-as-flex-item-001.html.ini
svg-root-as-flex-item-002.html.ini
svg-root-as-flex-item-003.html.ini
svg-root-as-flex-item-004.html.ini
svg-root-as-flex-item-005.html.ini
svg-root-as-flex-item-006.html.ini Update web-platform-tests to revision b'7aaad11d87d7a02515081e55609d31ab6ff173fc' (#30753) 2023-11-19 09:40:18 +00:00
table-as-item-flex-cross-size.html.ini
table-as-item-large-intrinsic-size.html.ini
table-as-item-stretch-cross-size-2.html.ini
table-as-item-stretch-cross-size-5.html.ini
table-as-item-stretch-cross-size.html.ini