Skip to content
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.

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

Define <meta media>. Fixes #6495. #6569

Merged
merged 11 commits into from
Jun 23, 2021
Merged

Define <meta media>. Fixes #6495. #6569

merged 11 commits into from
Jun 23, 2021

Conversation

hober
Copy link
Contributor

@hober hober commented Apr 9, 2021

(See WHATWG Working Mode: Changes for more details.)


/acknowledgements.html ( diff )
/indices.html ( diff )
/semantics.html ( diff )

@hober hober added normative change addition/proposal New features or enhancements needs implementer interest Moving the issue forward requires implementers to express interest do not merge yet Pull request must not be merged per rationale in comment document conformance needs tests Moving the issue forward requires someone to write tests topic: style labels Apr 9, 2021
@hober hober requested a review from annevk April 9, 2021 20:44
@hober hober self-assigned this Apr 9, 2021
Copy link
Member

@annevk annevk left a comment

Choose a reason for hiding this comment

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

Looks reasonable to me.

You also need to update the element index to add media to meta.

source Outdated Show resolved Hide resolved
source Outdated Show resolved Hide resolved
@hober
Copy link
Contributor Author

hober commented Apr 15, 2021

You also need to update the element index to add media to meta.

Good catch. Fixed in 43d605f.

@hober hober force-pushed the meta-media-6495 branch from 43d605f to 4d28596 Compare April 16, 2021 17:26
Copy link
Member

@annevk annevk left a comment

Choose a reason for hiding this comment

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

Looks good to me modulo nits.

Because of the IDL attribute we need to require tests and implementer support, I think.

source Show resolved Hide resolved
source Show resolved Hide resolved
source Show resolved Hide resolved
source Show resolved Hide resolved
@hober
Copy link
Contributor Author

hober commented Apr 19, 2021

Looks good to me modulo nits.

I fixed them in 0381fe9.

Because of the IDL attribute we need to require tests and implementer support, I think.

Yup! I've filed Implementation bugs & a Mozilla standards-positions issue, and @gsnedders is going to write some tests.

@annevk
Copy link
Member

annevk commented Apr 20, 2021

Looking at the history of theme-color it seems Adam Barth was involved. @domenic do you know if Google still has an interest here?

@domenic
Copy link
Member

domenic commented Apr 20, 2021

My understanding is that we generally nudge people toward web app manifests instead, but I will ask around.

<li><p>If <var>element</var> has a <code data-x="attr-link-media">media</code> attribute
and the value of <var>element</var>'s <code data-x="attr-meta-media">media</code>
attribute does not <span data-x="matches the environment">match the environment</span>, then
<span>continue</span>.</p></li>
Copy link
Member

Choose a reason for hiding this comment

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

@bgrins pointed out to me that this step would preclude updating the theme color if the user changed their preferences, e.g., from light to dark mode. That doesn't seem great?

Copy link
Member

Choose a reason for hiding this comment

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

For link@rel=stylesheet in https://html.spec.whatwg.org/multipage/links.html#link-type-stylesheet it just relies on CSSOM to define this; for all other link types it seems like https://html.spec.whatwg.org/multipage/semantics.html#processing-the-media-attribute doesn't actually reprocess media either.

Copy link
Member

Choose a reason for hiding this comment

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

I think that's one of the reasons we have to be careful about using media with <link> (and why I pushed back on it for rel=manifest).

Copy link
Contributor Author

Choose a reason for hiding this comment

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

@bgrins pointed out to me that this step would preclude updating the theme color if the user changed their preferences, e.g., from light to dark mode. That doesn't seem great?

I don't think that's true? If the user updates their preferences (to dark mode, say), this step will cause <meta ... media="(prefers-color-scheme: light)"> to be skipped. Which is what you want. On a subsequent iteration of the loop, when this step looks at <meta ... media="(prefers-color-scheme: dark)">, it won't skip it.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Oh, I see what you mean. Nothing causes the algorithm to be re-run when the environment changes. I think I've fixed this in 66167db. Let me know what you think, @annevk.

@hober
Copy link
Contributor Author

hober commented Apr 22, 2021

My understanding is that we generally nudge people toward web app manifests instead, but I will ask around.

At the time <meta name=brand-color> was proposed, Adam and others made this compelling (to me anyway) argument:

Unfortunately, the manifest isn't a good fit for this feature because the manifest is fetched asynchronously. If we want to use the brand-color to select the color of the tabstrip or the omnibox, we'll have a jaring experience if the color appears asynchronously after a network round-trip.
[…]
Generally speaking, I agree that it makes sense to move as much from meta tags to manifest as practical, but we need to weigh each feature individually to understand what creates the best user experience. In this case, the user experience would be markedly worse if we used the manifest.

@myakura
Copy link

myakura commented Apr 22, 2021

My understanding is that we generally nudge people toward web app manifests instead, but I will ask around.

At the time <meta name=brand-color> was proposed, Adam and others made this compelling (to me anyway) argument:

theme_color (or other Web App Manifest members in general) are only supported in installed PWAs but not in normal web pages or homescreen PWAs (in Chrome).
https://bugs.chromium.org/p/chromium/issues/detail?id=924451

theme-color metatag, does however, support both normal content and PWAs. so <meta media> will reach a broader forms of web.

@aarongustafson
Copy link
Contributor

Since it's Edge rather than Chromium overall that expresses interest, we'd like to follow the additional recommendations of https://whatwg.org/working-mode#additions. @aarongustafson do you plan to implement this soon? Is there an intent to ship underway or will this only ship in Edge?

We are supportive of the feature, but have not assigned anyone to implement it. I am asking around to see where this might fall in the backlog. Discussion about that is on the Chrome bug.

@jensimmons
Copy link

Any movement on this? I would really like to see this land in HTML this week. I hear no objections. We have consensus about the syntax — there's nothing left to debate. We have interest from two implementors. Spec work is underway to add this ability to web manifest files as well, so that we have parity. What's the blocker?

@domenic
Copy link
Member

domenic commented Jun 7, 2021

The blocker is a second implementer that has the feature on their near term roadmap, per the WHATWG working mode's "should". See Anne's comment from 28 days ago.

@beaufortfrancois
Copy link

For multiple equally appropriate link rel="icon", the last one is always picked as specified in the HTML spec

If there are multiple equally appropriate icons, user agents must use the last one declared in tree order at the time that the user agent collected the list of icons.

Why is this different for meta name="theme-color"?
Why not picked the last one for consistency?

@hober
Copy link
Contributor Author

hober commented Jun 8, 2021

For multiple equally appropriate link rel="icon", the last one is always picked as specified in the HTML spec

If there are multiple equally appropriate icons, user agents must use the last one declared in tree order at the time that the user agent collected the list of icons.

Why is this different for meta name="theme-color"?
Why not picked the last one for consistency?

This PR doesn't change that aspect of <meta name=theme-color>. If you think this is a bug, please file an issue on the spec!

@beaufortfrancois
Copy link

This PR doesn't change that aspect of <meta name=theme-color>. If you think this is a bug, please file an issue on the spec!

@hober You're right it doesn't change that aspect specifically. The addition of the media attribute however makes it so that multiple <meta> elements will now be expected while it didn't make much sense before.

@hober
Copy link
Contributor Author

hober commented Jun 11, 2021

There's an in-progress Chromium CL by @beaufortfrancois of the Chrome team that adds support for this. Does this count as a second implementer?

@domenic
Copy link
Member

domenic commented Jun 11, 2021

Yeah, that seems really promising. Let's wait to see if they actually intend to prototype or ship (by sending the corresponding email to blink-dev), but if that happens and this doesn't just end up a personal experiment in a branch, we'll be in good shape.

@tomayac
Copy link

tomayac commented Jun 11, 2021

@beaufortfrancois has the email in draft. It’s not just an experiment. 😃

@beaufortfrancois
Copy link

Yep @beaufortfrancois is excited to bring this feature to Chrome ;) Expect an intent to be sent next week.

FYI @b1tr0t

@beaufortfrancois
Copy link

And here's our intent to prototype and ship: https://groups.google.com/a/chromium.org/g/blink-dev/c/6I-I3lZWy5k

source Show resolved Hide resolved
pull bot pushed a commit to Yannic/chromium that referenced this pull request Jun 18, 2021
This CL makes sure the media HTML attribute is supported for the meta
HTML element when name is "theme-color" so that the status bar color
is reflected when media features change (light/dark mode for instance).

Intent to prototype: https://groups.google.com/a/chromium.org/g/blink-dev/c/6I-I3lZWy5k
Spec PR: whatwg/html#6569
Demo: https://media-meta-theme-color.glitch.me/

Change-Id: Id284c9b67f6d61635680357f337211f1a8c14dc6
Bug: 1200528
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2945116
Commit-Queue: François Beaufort <[email protected]>
Reviewed-by: Yoav Weiss <[email protected]>
Reviewed-by: Rune Lillesveen <[email protected]>
Reviewed-by: David Roger <[email protected]>
Cr-Commit-Position: refs/heads/master@{#893838}
blueboxd pushed a commit to blueboxd/chromium-legacy that referenced this pull request Jun 21, 2021
This CL enables by default the flag to honor the media HTML attribute
for <meta name="theme-color">.

Intent to ship: https://groups.google.com/a/chromium.org/g/blink-dev/c/6I-I3lZWy5k
Spec PR: whatwg/html#6569
Demo: https://media-meta-theme-color.glitch.me/

Bug: 1200528
Change-Id: Ic8fed423a4610a4f2dfbad31728715400aa0de24
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2959617
Reviewed-by: Yoav Weiss <[email protected]>
Reviewed-by: Rune Lillesveen <[email protected]>
Commit-Queue: François Beaufort <[email protected]>
Cr-Commit-Position: refs/heads/master@{#894186}
@beaufortfrancois
Copy link

beaufortfrancois commented Jun 22, 2021

FYI It's in Chrome Canary as well now: https://twitter.com/quicksave2k/status/1407326048526770176

@hober hober requested a review from domenic June 23, 2021 00:14
Copy link
Member

@domenic domenic left a comment

Choose a reason for hiding this comment

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

Thanks for your patience and edits!

source Outdated
@@ -13689,7 +13689,7 @@ interface <dfn>HTMLLinkElement</dfn> : <span>HTMLElement</span> {
data-x="attr-link-media">media</code> attribute is prescriptive. The user agent must apply the
external resource when the <code data-x="attr-link-media">media</code> attribute's value
<span>matches the environment</span> and the other relevant conditions apply, and must not apply
it otherwise.</p><!-- note similar text in <style> element section -->
it otherwise.</p><!-- note similar text in <style> and <meta> element sections -->
Copy link
Member

Choose a reason for hiding this comment

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

This comment change should be reverted. I will fix and then merge.

@domenic domenic merged commit cf222a3 into whatwg:main Jun 23, 2021
@hober hober deleted the meta-media-6495 branch June 23, 2021 23:47
gsnedders added a commit to web-platform-tests/wpt that referenced this pull request Jan 21, 2022
moz-v2v-gh pushed a commit to mozilla/gecko-dev that referenced this pull request Feb 5, 2022
…attribute, a=testonly

Automatic update from web-platform-tests
Add reflection tests for the meta@media attribute

For whatwg/html#6569.

--

wpt-commits: 8be2ce944ac18cae010c851f23b7f3f06826f913
wpt-pr: 28876
jamienicol pushed a commit to jamienicol/gecko that referenced this pull request Feb 7, 2022
…attribute, a=testonly

Automatic update from web-platform-tests
Add reflection tests for the meta@media attribute

For whatwg/html#6569.

--

wpt-commits: 8be2ce944ac18cae010c851f23b7f3f06826f913
wpt-pr: 28876
mjfroman pushed a commit to mjfroman/moz-libwebrtc-third-party that referenced this pull request Oct 14, 2022
This CL makes sure the media HTML attribute is supported for the meta
HTML element when name is "theme-color" so that the status bar color
is reflected when media features change (light/dark mode for instance).

Intent to prototype: https://groups.google.com/a/chromium.org/g/blink-dev/c/6I-I3lZWy5k
Spec PR: whatwg/html#6569
Demo: https://media-meta-theme-color.glitch.me/

Change-Id: Id284c9b67f6d61635680357f337211f1a8c14dc6
Bug: 1200528
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2945116
Commit-Queue: François Beaufort <[email protected]>
Reviewed-by: Yoav Weiss <[email protected]>
Reviewed-by: Rune Lillesveen <[email protected]>
Reviewed-by: David Roger <[email protected]>
Cr-Commit-Position: refs/heads/master@{#893838}
NOKEYCHECK=True
GitOrigin-RevId: 99a4b42f00c0839bb0b5b3d56cca2a06315dd1b0
mjfroman pushed a commit to mjfroman/moz-libwebrtc-third-party that referenced this pull request Oct 14, 2022
This CL enables by default the flag to honor the media HTML attribute
for <meta name="theme-color">.

Intent to ship: https://groups.google.com/a/chromium.org/g/blink-dev/c/6I-I3lZWy5k
Spec PR: whatwg/html#6569
Demo: https://media-meta-theme-color.glitch.me/

Bug: 1200528
Change-Id: Ic8fed423a4610a4f2dfbad31728715400aa0de24
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2959617
Reviewed-by: Yoav Weiss <[email protected]>
Reviewed-by: Rune Lillesveen <[email protected]>
Commit-Queue: François Beaufort <[email protected]>
Cr-Commit-Position: refs/heads/master@{#894186}
NOKEYCHECK=True
GitOrigin-RevId: 4ad19e2adda9a33a5ff79cedcfbe5d7d39387491
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Development

Successfully merging this pull request may close these issues.

New feature proposal: add support for media attribute to <meta name="theme-color">