servo/components/script
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
..
docs doc: fix broken link to UnrootedMustRoot plugin (#36198) 2025-03-28 10:23:41 +00:00
dom Add support for static SVG images using resvg crate (#36721) 2025-05-27 11:02:40 +00:00
layout_dom Add support for static SVG images using resvg crate (#36721) 2025-05-27 11:02:40 +00:00
resources Embed user agent stylesheets and media control resouces in libservo (#36803) 2025-05-04 18:48:09 +00:00
svgpath Add Path2D (#35783) 2025-03-26 12:12:44 +00:00
xpath Use version of markup5ever with web_atoms crate (#36542) 2025-04-19 11:49:37 +00:00
animation_timeline.rs script: Limit public exports. (#34915) 2025-01-10 08:19:19 +00:00
animations.rs Animation: update image active frame when update the rendering (#36286) 2025-05-23 03:13:35 +00:00
body.rs fix: ReadableStream::get_in_memory_bytes too large (#36914) 2025-05-12 16:00:14 +00:00
build.rs script: copy include! files from script_bindings to script's OUT_DIR (#36384) 2025-04-08 19:22:24 +00:00
canvas_context.rs Don't attempt to resize Offscreencanvas without a rendering context (#36855) 2025-05-11 15:27:33 +00:00
canvas_state.rs Add support for static SVG images using resvg crate (#36721) 2025-05-27 11:02:40 +00:00
Cargo.toml Removing unused dependencies in crates. (#37096) 2025-05-23 12:58:00 +00:00
clipboard_provider.rs Move ScriptToConstellationMsg to constellation_traits (#36364) 2025-04-05 22:13:29 +00:00
conversions.rs suppress build warnings when disabling webgpu and webxr (#35379) 2025-02-08 08:16:21 +00:00
devtools.rs devtools: Allow highlighting elements from the inspector (#35822) 2025-05-05 10:10:25 +00:00
document_collection.rs Update rustfmt to the 2024 style edition (#35764) 2025-03-03 11:26:53 +00:00
document_loader.rs script: LoadBlocker's drop impl shouldn't run after termination. (#36508) 2025-04-21 07:17:00 +00:00
drag_data_store.rs Add support for static SVG images using resvg crate (#36721) 2025-05-27 11:02:40 +00:00
fetch.rs Correct event_target for CSP violations (#36887) 2025-05-08 10:46:31 +00:00
iframe_collection.rs Move ScriptToConstellationMsg to constellation_traits (#36364) 2025-04-05 22:13:29 +00:00
image_animation.rs Add support for static SVG images using resvg crate (#36721) 2025-05-27 11:02:40 +00:00
init.rs Make generated bindings generic over DOM types (#35169) 2025-01-25 05:08:49 +00:00
layout_image.rs Correct event_target for CSP violations (#36887) 2025-05-08 10:46:31 +00:00
lib.rs Switch to data_url::mime for document content type (#36522) 2025-04-15 17:12:48 +00:00
links.rs Use version of markup5ever with web_atoms crate (#36542) 2025-04-19 11:49:37 +00:00
messaging.rs Add support for static SVG images using resvg crate (#36721) 2025-05-27 11:02:40 +00:00
microtask.rs Start adding support for transforms in readable and writable streams (#36470) 2025-04-28 11:02:55 +00:00
mime.rs Switch to data_url::mime for document content type (#36522) 2025-04-15 17:12:48 +00:00
navigation.rs constellation: Pass system theme to new Pipelines (#37132) 2025-05-26 12:05:38 +00:00
network_listener.rs Propagate CanGc arguments through callers in constructors (#35541) 2025-02-20 16:17:45 +00:00
realms.rs Move generated bindings to script_bindings (#36323) 2025-04-04 06:45:08 +00:00
routed_promise.rs script: add TaskSource argument to route_promise (#36831) 2025-05-04 17:05:27 +00:00
script_module.rs Correct event_target for CSP violations (#36887) 2025-05-08 10:46:31 +00:00
script_runtime.rs Correct event_target for CSP violations (#36887) 2025-05-08 10:46:31 +00:00
script_thread.rs Add support for static SVG images using resvg crate (#36721) 2025-05-27 11:02:40 +00:00
security_manager.rs Correct event_target for CSP violations (#36887) 2025-05-08 10:46:31 +00:00
serviceworker_manager.rs Move ScriptToConstellationMsg to constellation_traits (#36364) 2025-04-05 22:13:29 +00:00
stylesheet_loader.rs Use spec compliant content-type extraction in more places and enable a <stylesheet> quirk (#28321) 2025-05-19 11:38:01 +00:00
stylesheet_set.rs script: Limit public exports. (#34915) 2025-01-10 08:19:19 +00:00
task.rs Migrate to the 2024 edition (#35755) 2025-03-13 10:28:11 +00:00
task_manager.rs async clipboard: implement writeText (#36498) 2025-04-14 13:49:43 +00:00
task_queue.rs Use strum to iterate through enum variants and get their names (#35933) 2025-03-13 12:00:31 +00:00
task_source.rs async clipboard: implement writeText (#36498) 2025-04-14 13:49:43 +00:00
test.rs script: Refactor dom/headers to match spec better (#36943) 2025-05-21 19:07:32 +00:00
textinput.rs Fix Backspace deleting entire previous line in <textarea> (#36112) 2025-03-26 18:37:48 +00:00
timers.rs Animation: update image active frame when update the rendering (#36286) 2025-05-23 03:13:35 +00:00
unminify.rs Update rustfmt to the 2024 style edition (#35764) 2025-03-03 11:26:53 +00:00
webdriver_handlers.rs Implement trusted HTML sinks for Element (#36941) 2025-05-12 10:53:03 +00:00
window_named_properties.rs Migrate to the 2024 edition (#35755) 2025-03-13 10:28:11 +00:00