Commit graph

5 commits

Author SHA1 Message Date
Andrei Volykhin
4cbadde144
htmlimageelement: Reject decode promises on the current request mutation (#37828)
Follow the HTML specification and reject the pending image decode
promises
on any current request mutation.
https://html.spec.whatwg.org/multipage/#updating-the-image-data (step
18)
https://html.spec.whatwg.org/multipage/#dom-img-decode (step 3)

Fulfill and reject image decode promises by queueing
a global tasks on the DOM manipulation task source.

Testing: Improvements in the following tests
- html/semantics/embedded-content/the-img-element/decode/*

Signed-off-by: Andrei Volykhin <andrei.volykhin@gmail.com>
2025-07-02 09:29:47 +00:00
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
Servo WPT Sync
1af3ad8a74
Update web-platform-tests to revision b'3b3beee1bf2469013583bafe702f2d4821d76c1f' (#33000)
Signed-off-by: WPT Sync Bot <ghbot+wpt-sync@servo.org>
2024-08-11 01:31:50 +00:00
Taym Haddadi
1d048f4f6a
Implement HTMLImageElement decode (#31269)
* Implement HTMLImageElement decode

Signed-off-by: Bentaimia Haddadi <haddadi.taym@gmail.com>

* Fix Decode doc link

Signed-off-by: Bentaimia Haddadi <haddadi.taym@gmail.com>

* Temp

* Decode HTML Image

Signed-off-by: Bentaimia Haddadi <haddadi.taym@gmail.com>

* Fix doc link

Signed-off-by: Bentaimia Haddadi <haddadi.taym@gmail.com>

* Move image decode to process_image_response_for_environment_change

Signed-off-by: Bentaimia Haddadi <haddadi.taym@gmail.com>

* Update some wpt test result

Signed-off-by: Bentaimia Haddadi <haddadi.taym@gmail.com>

* Handle multiple image decode promises

Signed-off-by: Bentaimia Haddadi <haddadi.taym@gmail.com>

* Remove unnecessary promise calls

Signed-off-by: Bentaimia Haddadi <haddadi.taym@gmail.com>

* Update more wpt test result

Signed-off-by: Bentaimia Haddadi <haddadi.taym@gmail.com>

* Undo body-size-cross-origin.https.html.ini changes

Signed-off-by: Bentaimia Haddadi <haddadi.taym@gmail.com>

* Reject decode when src and srcset are missing

Signed-off-by: Bentaimia Haddadi <haddadi.taym@gmail.com>

* Revert "Reject decode when src and srcset are missing"

This reverts commit 1b57ab978f9fc24facafc8af97ee8851d5142533.

* Drain promises vec and run update_the_image_data when element is created

Signed-off-by: Bentaimia Haddadi <haddadi.taym@gmail.com>

* resolve decode promise in abort_request when request is CompletelyAvailable

Signed-off-by: Bentaimia Haddadi <haddadi.taym@gmail.com>

* Update wpt test

Signed-off-by: Bentaimia Haddadi <haddadi.taym@gmail.com>

* Move storing promise in decode task

Signed-off-by: Bentaimia Haddadi <haddadi.taym@gmail.com>

* Remove the resolve logic from decode task

Signed-off-by: Bentaimia Haddadi <haddadi.taym@gmail.com>

* Revert "Remove the resolve logic from decode task"

This reverts commit eee6096d50.

* reject or reject current promise before storing it

Signed-off-by: Bentaimia Haddadi <haddadi.taym@gmail.com>

* Add comment to explain why resolve promise when state is CompletelyAvailable

Signed-off-by: Bentaimia Haddadi <haddadi.taym@gmail.com>

---------

Signed-off-by: Bentaimia Haddadi <haddadi.taym@gmail.com>
2024-06-13 10:15:49 +00:00
Oriol Brufau
963104e5fc
Run same tests for layout-2020 and layout-2013 (#30092)
Most tests were only being run for layout-2013, not for layout-2020.
This wasn't great since layout-2020 is now the default.

So this patch unifies the lists of included tests for both layouts.
For layout-2013 this implies adding css/css-content/, css/css-logical/
and css/css-masking/clip/.
For layout-2020 this implies adding several additional css tests, and
also tests like dom/, js/, html/, etc.
2023-08-15 00:28:32 +00:00