If the site CSS has -webkit-appearance:none; (not the UA) and the CSS is updated or the video element is created then we should add a CSS class to the element to clear the background image.
If the site CSS has -webkit-appearance:none; (not the UA) and the CSS is updated or the video element is created then we should add a CSS class to the element to clear the background image. Design: https://docs.google.com/document/d/1QjWB4eUspYDnsr42Jxasv_FVZTe8anDL_XIqE57Rs4k/edit?usp=sharing
The following revision refers to this bug: https://chromium.googlesource.com/chromium/src.git/+/9d6f3016641f26e4e330da6baf70fa2133f62721 commit 9d6f3016641f26e4e330da6baf70fa2133f62721 Author: Becca Hughes <beccahughes@chromium.org> Date: Fri Sep 08 11:53:22 2017 Media Controls: Clear background image if appearance is none. To ensure backwards compatiblity with our new media controls, we need to clear the user agent background image if the user set's -webkit-appearance to one on a -webkit-media-controls* element. If the user supplies a custom background image then that will be used. BUG= 747378 Change-Id: I99b8ec08789fdf14996fb774a4cd58668cfb65bd Reviewed-on: https://chromium-review.googlesource.com/589169 Commit-Queue: Becca Hughes <beccahughes@chromium.org> Reviewed-by: Bugs Nash <bugsnash@chromium.org> Reviewed-by: Mounir Lamouri <mlamouri@chromium.org> Reviewed-by: meade_UTC10 <meade@chromium.org> Reviewed-by: Ian Vollick <vollick@chromium.org> Cr-Commit-Position: refs/heads/master@{#500570} [add] https://crrev.com/9d6f3016641f26e4e330da6baf70fa2133f62721/third_party/WebKit/LayoutTests/media/controls/paint-controls-webkit-appearance-none-custom-bg.html [add] https://crrev.com/9d6f3016641f26e4e330da6baf70fa2133f62721/third_party/WebKit/LayoutTests/media/controls/paint-controls-webkit-appearance-none.html [add] https://crrev.com/9d6f3016641f26e4e330da6baf70fa2133f62721/third_party/WebKit/LayoutTests/platform/linux/media/controls/paint-controls-webkit-appearance-none-custom-bg-expected.png [add] https://crrev.com/9d6f3016641f26e4e330da6baf70fa2133f62721/third_party/WebKit/LayoutTests/platform/linux/media/controls/paint-controls-webkit-appearance-none-expected.png [add] https://crrev.com/9d6f3016641f26e4e330da6baf70fa2133f62721/third_party/WebKit/LayoutTests/platform/linux/virtual/new-remote-playback-pipeline/media/controls/paint-controls-webkit-appearance-none-custom-bg-expected.png [add] https://crrev.com/9d6f3016641f26e4e330da6baf70fa2133f62721/third_party/WebKit/LayoutTests/platform/linux/virtual/new-remote-playback-pipeline/media/controls/paint-controls-webkit-appearance-none-expected.png [add] https://crrev.com/9d6f3016641f26e4e330da6baf70fa2133f62721/third_party/WebKit/LayoutTests/platform/mac/media/controls/paint-controls-webkit-appearance-none-custom-bg-expected.png [add] https://crrev.com/9d6f3016641f26e4e330da6baf70fa2133f62721/third_party/WebKit/LayoutTests/platform/mac/media/controls/paint-controls-webkit-appearance-none-custom-bg-expected.txt [add] https://crrev.com/9d6f3016641f26e4e330da6baf70fa2133f62721/third_party/WebKit/LayoutTests/platform/mac/media/controls/paint-controls-webkit-appearance-none-expected.png [add] https://crrev.com/9d6f3016641f26e4e330da6baf70fa2133f62721/third_party/WebKit/LayoutTests/platform/mac/media/controls/paint-controls-webkit-appearance-none-expected.txt [add] https://crrev.com/9d6f3016641f26e4e330da6baf70fa2133f62721/third_party/WebKit/LayoutTests/platform/mac/virtual/new-remote-playback-pipeline/media/controls/paint-controls-webkit-appearance-none-custom-bg-expected.png [add] https://crrev.com/9d6f3016641f26e4e330da6baf70fa2133f62721/third_party/WebKit/LayoutTests/platform/mac/virtual/new-remote-playback-pipeline/media/controls/paint-controls-webkit-appearance-none-custom-bg-expected.txt [add] https://crrev.com/9d6f3016641f26e4e330da6baf70fa2133f62721/third_party/WebKit/LayoutTests/platform/mac/virtual/new-remote-playback-pipeline/media/controls/paint-controls-webkit-appearance-none-expected.png [add] https://crrev.com/9d6f3016641f26e4e330da6baf70fa2133f62721/third_party/WebKit/LayoutTests/platform/mac/virtual/new-remote-playback-pipeline/media/controls/paint-controls-webkit-appearance-none-expected.txt [add] https://crrev.com/9d6f3016641f26e4e330da6baf70fa2133f62721/third_party/WebKit/LayoutTests/platform/win/media/controls/paint-controls-webkit-appearance-none-custom-bg-expected.png [add] https://crrev.com/9d6f3016641f26e4e330da6baf70fa2133f62721/third_party/WebKit/LayoutTests/platform/win/media/controls/paint-controls-webkit-appearance-none-custom-bg-expected.txt [add] https://crrev.com/9d6f3016641f26e4e330da6baf70fa2133f62721/third_party/WebKit/LayoutTests/platform/win/media/controls/paint-controls-webkit-appearance-none-expected.png [add] https://crrev.com/9d6f3016641f26e4e330da6baf70fa2133f62721/third_party/WebKit/LayoutTests/platform/win/media/controls/paint-controls-webkit-appearance-none-expected.txt [add] https://crrev.com/9d6f3016641f26e4e330da6baf70fa2133f62721/third_party/WebKit/LayoutTests/platform/win/virtual/new-remote-playback-pipeline/media/controls/paint-controls-webkit-appearance-none-custom-bg-expected.png [add] https://crrev.com/9d6f3016641f26e4e330da6baf70fa2133f62721/third_party/WebKit/LayoutTests/platform/win/virtual/new-remote-playback-pipeline/media/controls/paint-controls-webkit-appearance-none-custom-bg-expected.txt [add] https://crrev.com/9d6f3016641f26e4e330da6baf70fa2133f62721/third_party/WebKit/LayoutTests/platform/win/virtual/new-remote-playback-pipeline/media/controls/paint-controls-webkit-appearance-none-expected.png [add] https://crrev.com/9d6f3016641f26e4e330da6baf70fa2133f62721/third_party/WebKit/LayoutTests/platform/win/virtual/new-remote-playback-pipeline/media/controls/paint-controls-webkit-appearance-none-expected.txt [modify] https://crrev.com/9d6f3016641f26e4e330da6baf70fa2133f62721/third_party/WebKit/Source/core/css/CSSPrimitiveValueMappings.h [modify] https://crrev.com/9d6f3016641f26e4e330da6baf70fa2133f62721/third_party/WebKit/Source/core/css/CSSValueKeywords.json5 [modify] https://crrev.com/9d6f3016641f26e4e330da6baf70fa2133f62721/third_party/WebKit/Source/core/css/resolver/StyleAdjuster.cpp [modify] https://crrev.com/9d6f3016641f26e4e330da6baf70fa2133f62721/third_party/WebKit/Source/core/css/resolver/StyleAdjuster.h [modify] https://crrev.com/9d6f3016641f26e4e330da6baf70fa2133f62721/third_party/WebKit/Source/core/css/resolver/StyleResolver.cpp [modify] https://crrev.com/9d6f3016641f26e4e330da6baf70fa2133f62721/third_party/WebKit/Source/core/css/resolver/StyleResolver.h [modify] https://crrev.com/9d6f3016641f26e4e330da6baf70fa2133f62721/third_party/WebKit/Source/core/style/ComputedStyle.h [modify] https://crrev.com/9d6f3016641f26e4e330da6baf70fa2133f62721/third_party/WebKit/Source/platform/ThemeTypes.h
Comment 1 by beccahughes@chromium.org
, Jul 24 2017