Closed Bug 1691115 Opened 4 years ago Closed 2 years ago

Media control interface doesn't show artist on CBC Music Playlists

Categories

(Core :: Audio/Video: Playback, defect)

Firefox 86
Desktop
Windows 10
defect

Tracking

()

RESOLVED DUPLICATE of bug 1767412
Webcompat Priority ?

People

(Reporter: mathew.hodson, Unassigned)

References

Details

(Keywords: parity-chrome, parity-edge, platform-parity)

Attachments

(1 file)

User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:86.0) Gecko/20100101 Firefox/86.0

Steps to reproduce:

  1. Go to https://www.cbc.ca/listen/cbc-music-playlists
  2. Click the play button for one of the playlists
  3. Press the volume button on your keyboard to show the media control interface

Actual results:

The name of the playlist is shown under the song title.

Expected results:

The name of the artist should be shown. This works correctly on Microsoft Edge.

In the attached screenshot, it should show "Tito Puente & Eddie Palmieri" instead of "Salsa".

The Bugbug bot thinks this bug should belong to the 'Core::Audio/Video: Playback' component, and is moving the bug to that component. Please revert this change in case you think the bot is wrong.

Component: Untriaged → Audio/Video: Playback
Product: Firefox → Core
Severity: -- → S3
Priority: -- → P3

Thank you for reporting! However, this is a website issue, when I use Firefox on my Ubuntu 20.04, I did see the website setting correct artist name. But on Windows 10, they only set the playlist name instead. So this issue should be reported to the website.

Status: UNCONFIRMED → RESOLVED
Closed: 4 years ago
Flags: needinfo?(mathew.hodson)
Resolution: --- → INVALID
Status: RESOLVED → UNCONFIRMED
Component: Audio/Video: Playback → Desktop
Flags: needinfo?(mathew.hodson)
OS: Unspecified → Windows 10
Product: Core → Web Compatibility
Hardware: Unspecified → Desktop
Resolution: INVALID → ---

I changed the component to Web Compatibility because it works on Edge and Chrome. Maybe the website is doing some kind of user agent sniffing.

Yes, that site treats things differently based on the platform and the UA. On Firefox Windows, it really set the "Salsa" as the album title, instead of "Tito Puente & Eddie Palmieri", but on Firefox Linux, they set the album correctly to "Tito Puente & Eddie Palmieri". It won't help even if moving this bug to Web Compatibility, because that is website's issue.

:alwu, is it possible that on Windows specifically, we are setting an unexpected/different keycode for the volume up/down media key event, which is causing them to use a different code-path?

Flags: needinfo?(alwu)

No, the song/artist/album name are setting from MediaSession API, which is not related with any keycode. Here are some examples how websites set their customized metadata.

Flags: needinfo?(alwu)

It seems that the site is setting the artist name correctly and I didn't find any signs of a different codepath for Firefox on Windows.
This is the code that they're using to set metadata in https://www.cbc.ca/i/caffeine/js/Caffeine.modules.js:

...
    get artist() {
      if ('music' === a.getContentArea().toLowerCase()) return a.getShowName()
    },
    get album() {
      if ('music' === a.getContentArea().toLowerCase()) return a.getDescription()
    },
...
function s() {
    t = n.session.modelsManager.getClip(n.player.currentClip);
    navigator.mediaSession.metadata = (e = t.getHostImage() || t.getThumbnail() || 'https://www.cbc.ca/i/caffeine/images/default_video_image.jpg', new o({
      title: t.getTitle(),
      artist: t.getShowName(),
      album: t.getDescription(),
      artwork: [
...
    }));

If I console.log navigator.mediaSession.metadata this is the result in both browsers:

{ 
album: "Jazz Songbook"
artist: "Tony Bennett,Diana Krall"
artwork: (6) [{…}, {…}, {…}, {…}, {…}, {…}]
title: "Alright, Okay, You Win"
}

Based on it Chrome is showing title and artist, and Firefox is showing title and album on Windows.

I've found this example https://googlechrome.github.io/samples/media-session/audio.html where a similar difference can be reproduced.

If you press play, and press the volume control Frefox will show Snow Fight / Sintel and Chrome Snow Fight / Jan Morgenstern for this metadata:

{
      src: BASE_URL + 'sintel/snow-fight.mp3',
      title: 'Snow Fight',
      artist: 'Jan Morgenstern',
      album: 'Sintel',
      artwork: [...]
    }

Hi Alastor, I wonder if we actually showing album instead of artist on Windows in the media controller ui? (and sounds like on Linux it matches Chrome's behaviour)

Flags: needinfo?(alwu)

Thank you for debugging this! I must admit that I made the decision too rush, so I was wrong about the assumption of CBC setting different metadata based on platform and UA.

Your debugging leads to an interesting finding. Per comment7, we can see that those attributes (title/artist/album) were all not empty, and on Windows Firefox did pass all of them to SystemMediaTransportControls (SMTC) via IMusicDisplayProperties::put_XXX methods, which is the system API used to display the metadata.

However, SMTC's display interface only has two displayed attributes, so that means they think the priority of album is higher than artist. Chrome only set title and artist, that is why their result is different than ours.

I've checked the Microsoft's documentation, and couldn't find any information about what SMTC would do if we set more than two attributes. So it's really depending on each platform's implementation. For example, I saw the different result on Unbuntu, but we actually are doing the same thing, providing all attributes, which websites gave us, to the platform. On linux, they seems to regard artist is more important than album.

Firefox honestly passes all metadata to the platform, and let the platform determine the most important attribute. If a website only set album and artist then Chrome would miss another attribute and only shows title.

In addition, when checking other player, like Spotify. If I play a song from an album which made by one person, then their display would show title and album, if I play a song from a playlist which contains multiple artists, then their display would show title and artist.

here are the result on different platforms.
Windows : title (always), album (second priority), artist (third priority)
Linux (using gnome) : title (always), artist (second priority), album (ignore)
MacOS (11) : title (always), artist (second priority), album (ignore)


From the pespective of sending a completed metadata to the platform, I won't say it's a bug. However, from another pespective, I would prefer to keep the displayed result consistent among different platforms, so we can probably do some adjustment on Windows, which is setting album only if artist is empty, in order to show title and artist on all platforms.

Chun-min, any thought about this?

Thank you.

Flags: needinfo?(alwu) → needinfo?(cchang)

It's easy to adjust our code to make the UI shows the same result as what Chrome gives. But my question will be: "Is this important to the website owner? If we make the change, will others complain the album name is gone? "

I prefer to make the priority of title, artist, and album consistent on every platform. If we take this approach, we should also add some notes for the priorities of the displayed attributes to our Media Session API page. It could provide more information when the developer faces the same problem here.

Flags: needinfo?(cchang)

It sounds like this could be improved on the Firefox side.

Component: Desktop → Audio/Video: Playback
Product: Web Compatibility → Core

The product::component has been changed since the backlog priority was decided, so we're resetting it.
For more information, please visit auto_nag documentation.

Priority: P3 → --
Keywords: platform-parity
Webcompat Priority: --- → ?
Status: UNCONFIRMED → RESOLVED
Closed: 4 years ago2 years ago
Resolution: --- → DUPLICATE
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Creator:
Created:
Updated:
Size: