Skip to content

Clarify how manifest image resources are fetched #1171

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 3 commits into
base: main
Choose a base branch
from
Open

Clarify how manifest image resources are fetched #1171

Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
3f6dc86
Clarify how manifest image resources are fetched
marcoscaceres Apr 24, 2025
8dd36ea
Merge branch 'main' into sub-resource
marcoscaceres Jun 26, 2025
cb68f59
Update index.html
marcoscaceres Jun 26, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
64 changes: 11 additions & 53 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1836,24 +1836,29 @@ <h2>
Manifest image resources
</h2>
<p>
Each <dfn>manifest image resource</dfn> is an [=image resource=] that
is conceptually part of a web application, suitable to use in various
contexts depending on the semantics of the member that is using the
object (e.g., an icon that is part of an application menu, etc.).
Each <dfn>manifest image resource</dfn> is an [=image resource=]. The
context in which an manifest image resource is presented is determnined
by the semantics of the associated manifest member (e.g., an
[=manifest/icons=] member is generally used to represent the
application icon).
</p>
<p>
A [=manifest image resource=] differs from a [=image resource=] in that
it can have an additional [=manifest image resource/purpose=] member.
</p>
<p>
User agents MAY modify the images associated with an [=manifest image
resource=] to better match the platform’s visual style before
User agents MAY modify the images associated with a [=manifest image
resource=] to better match the platform's visual style before
displaying it to the user, for example by rounding the corners or
painting it in a specific color. It is recommended that developers
prepare their image resources for such scenarios to avoid losing
important information through, e.g., change of color or clipped
corners.
</p>
<p>
User agents MUST [=fetch=] an [=manifest image resource=] by running the
Copy link
Member Author

@marcoscaceres marcoscaceres Jun 26, 2025 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This needs a request to be passed, a response to be handled.

At written, this doesn't make sense at the moment, because the other spec takes an optional request .... the request needs to come from some context...

We might be able to get away with putting this int the spec with an issue, but it won't buy us much.

This needs to describe, for example, how this interacts with the Cache API via service workers, for instance.

[=fetching an image resource=] algorithm.
</p>
<section>
<h3>
`purpose` member
Expand Down Expand Up @@ -1959,53 +1964,6 @@ <h3>
</li>
</ol>
</section>
<section>
<h3>
Content security policy
</h3>
<p>
The security policy that governs whether a <a>user agent</a> can
fetch an icon image is governed by the `img-src` directive [[CSP3]]
associated with the manifest's owner {{Document}}.
</p>
<aside class="example" title="Content security policy of icons">
<p>
For example, given the following `img-src` directive in the
`Content-Security-Policy` HTTP header of the manifest's owner
{{Document}}:
</p>
<pre class="http">
HTTP/1.1 200 OK
Content-Type: text/html
Content-Security-Policy: img-src icons.example.com

&lt;!doctype&gt;
&lt;html&gt;
&lt;link rel="manifest" href="manifest.webmanifest"&gt;
</pre>
<p>
And given the following `manifest.webmanifest`:
</p>
<pre class="json">
{
"name": "custom manifest",
"start_url": "https://boo",
"icons": [
{
"src": "//icons.example.com/lowres"
},
{
"src": "//other.com/hi-res"
}
]
}
</pre>
<p>
The fetching of icon resources from `icons.example.com/lowres`
would succeed, while fetching from `other.com/hi-res` would fail.
</p>
</aside>
</section>
<section id="icon-masks">
<h2>
Icon masks and safe zone
Expand Down
Loading