How to hide background for ::cue pseudo-element on Safari?

Question

I'm trying to hide captions on a video element:

I'm using the following css:

video::cue { visibility: hidden; }

It works fine in Chrome, but on Safari it only hides the text, and still renders the caption background, like this:

I tried adding background: none as well, but there's no change. How else can I hide the captions on Safari, besides modifying the text track list programmatically? Could this be a Safari bug?

Answer 1

One solution is already mentioned here: Hiding a video text track with Safari. That is, if what you're trying to do is not display your captions directly in the video anyway, just use the track kind "metadata". In my case:

<track default label="English" kind="metadata" srclang="en" src="../static/captions/mexicocity_en.vtt" >