https://gallery.googleplex.com/projects/MCHbtQVoQ2HCZZIx9p6vbtpx/files/MCHtA7U1iMGr69laPZDCC2xNn8G12BWoPZA
Issue 839675 has been merged into this issue.
The following revision refers to this bug: https://chromium.googlesource.com/chromium/src.git/+/4fcaee53139b0afb003ff1ba13b902a6a3f2a315 commit 4fcaee53139b0afb003ff1ba13b902a6a3f2a315 Author: Jazz Xu <jazzhsu@google.com> Date: Fri Oct 26 16:40:30 2018 [Media Controls] Added animation to overflow menu Toggle "closed" class when open/close menu to achieve transition animation. This CL only has opening animation. TODO: Add close animation; Add wave like animation to label when opening menu. Bug: 814507 Change-Id: I2a036297741f34905fe868c7ea0a99e9ea91cea3 Reviewed-on: https://chromium-review.googlesource.com/c/1286949 Commit-Queue: Jazz Xu <jazzhsu@google.com> Reviewed-by: Tommy Steimel <steimel@chromium.org> Cr-Commit-Position: refs/heads/master@{#603116} [modify] https://crrev.com/4fcaee53139b0afb003ff1ba13b902a6a3f2a315/third_party/WebKit/LayoutTests/http/tests/media/video-controls-download-button-saves-media-cross-origin.html [modify] https://crrev.com/4fcaee53139b0afb003ff1ba13b902a6a3f2a315/third_party/WebKit/LayoutTests/http/tests/media/video-controls-download-button-saves-media.html [modify] https://crrev.com/4fcaee53139b0afb003ff1ba13b902a6a3f2a315/third_party/WebKit/LayoutTests/http/tests/media/video-controls-overflow-menu-download-button.html [modify] https://crrev.com/4fcaee53139b0afb003ff1ba13b902a6a3f2a315/third_party/WebKit/LayoutTests/media/controls/closed-captions-dynamic-update.html [modify] https://crrev.com/4fcaee53139b0afb003ff1ba13b902a6a3f2a315/third_party/WebKit/LayoutTests/media/controls/closed-captions-on-off.html [modify] https://crrev.com/4fcaee53139b0afb003ff1ba13b902a6a3f2a315/third_party/WebKit/LayoutTests/media/controls/closed-captions-single-track.html [modify] https://crrev.com/4fcaee53139b0afb003ff1ba13b902a6a3f2a315/third_party/WebKit/LayoutTests/media/controls/closed-captions-switch-track.html [modify] https://crrev.com/4fcaee53139b0afb003ff1ba13b902a6a3f2a315/third_party/WebKit/LayoutTests/media/controls/overflow-menu-hide-on-click-item.html [add] https://crrev.com/4fcaee53139b0afb003ff1ba13b902a6a3f2a315/third_party/WebKit/LayoutTests/media/controls/overflow-menu-toggle-class-for-animation.html [modify] https://crrev.com/4fcaee53139b0afb003ff1ba13b902a6a3f2a315/third_party/WebKit/LayoutTests/media/controls/text-track-menu-keyboard-navigation.html [modify] https://crrev.com/4fcaee53139b0afb003ff1ba13b902a6a3f2a315/third_party/WebKit/LayoutTests/media/controls/text-track-menu-pointer-selection.html [modify] https://crrev.com/4fcaee53139b0afb003ff1ba13b902a6a3f2a315/third_party/WebKit/LayoutTests/media/media-controls.js [modify] https://crrev.com/4fcaee53139b0afb003ff1ba13b902a6a3f2a315/third_party/WebKit/LayoutTests/media/picture-in-picture/controls/picture-in-picture-button.html [modify] https://crrev.com/4fcaee53139b0afb003ff1ba13b902a6a3f2a315/third_party/WebKit/LayoutTests/media/picture-in-picture/picture-in-picture-interstitial-sizing.html [modify] https://crrev.com/4fcaee53139b0afb003ff1ba13b902a6a3f2a315/third_party/WebKit/LayoutTests/media/picture-in-picture/picture-in-picture-interstitial.html [modify] https://crrev.com/4fcaee53139b0afb003ff1ba13b902a6a3f2a315/third_party/WebKit/LayoutTests/media/track/text-track-selection-menu-add-track.html [modify] https://crrev.com/4fcaee53139b0afb003ff1ba13b902a6a3f2a315/third_party/WebKit/LayoutTests/media/video-controls-labels.html [modify] https://crrev.com/4fcaee53139b0afb003ff1ba13b902a6a3f2a315/third_party/WebKit/LayoutTests/media/video-controls-overflow-menu-closed-captions-button.html [modify] https://crrev.com/4fcaee53139b0afb003ff1ba13b902a6a3f2a315/third_party/WebKit/LayoutTests/media/video-controls-overflow-menu-fullscreen-button.html [modify] https://crrev.com/4fcaee53139b0afb003ff1ba13b902a6a3f2a315/third_party/WebKit/LayoutTests/media/video-controls-overflow-menu-mute-button.html [modify] https://crrev.com/4fcaee53139b0afb003ff1ba13b902a6a3f2a315/third_party/WebKit/LayoutTests/media/video-controls-overflow-menu-play-button.html [modify] https://crrev.com/4fcaee53139b0afb003ff1ba13b902a6a3f2a315/third_party/WebKit/LayoutTests/media/video-controls-track-selection-menu.html [modify] https://crrev.com/4fcaee53139b0afb003ff1ba13b902a6a3f2a315/third_party/blink/renderer/modules/media_controls/elements/media_control_overflow_menu_list_element.cc [modify] https://crrev.com/4fcaee53139b0afb003ff1ba13b902a6a3f2a315/third_party/blink/renderer/modules/media_controls/elements/media_control_overflow_menu_list_element.h [modify] https://crrev.com/4fcaee53139b0afb003ff1ba13b902a6a3f2a315/third_party/blink/renderer/modules/media_controls/elements/media_control_text_track_list_element.cc [modify] https://crrev.com/4fcaee53139b0afb003ff1ba13b902a6a3f2a315/third_party/blink/renderer/modules/media_controls/media_controls_impl.cc [modify] https://crrev.com/4fcaee53139b0afb003ff1ba13b902a6a3f2a315/third_party/blink/renderer/modules/media_controls/media_controls_impl.h [modify] https://crrev.com/4fcaee53139b0afb003ff1ba13b902a6a3f2a315/third_party/blink/renderer/modules/media_controls/resources/modernMediaControls.css
The following revision refers to this bug: https://chromium.googlesource.com/chromium/src.git/+/c32b4659479549bd0b0b6dff40c32e7a9857e424 commit c32b4659479549bd0b0b6dff40c32e7a9857e424 Author: Findit <findit-for-me@appspot.gserviceaccount.com> Date: Fri Oct 26 19:06:46 2018 Revert "[Media Controls] Added animation to overflow menu" This reverts commit 4fcaee53139b0afb003ff1ba13b902a6a3f2a315. Reason for revert: Findit (https://goo.gl/kROfz5) identified CL at revision 603116 as the culprit for flakes in the build cycles as shown on: https://findit-for-me.appspot.com/waterfall/flake/flake-culprit?key=ag9zfmZpbmRpdC1mb3ItbWVyQwsSDEZsYWtlQ3VscHJpdCIxY2hyb21pdW0vNGZjYWVlNTMxMzliMGFmYjAwM2ZmMWJhMTNiOTAyYTZhM2YyYTMxNQw Sample Failed Build: https://ci.chromium.org/buildbot/chromium.mac/WebKit%20Mac10.13%20%28retina%29/6030 Sample Failed Step: webkit_layout_tests on ATI GPU on Mac Retina on Mac-10.13.6 Sample Flaky Test: media/controls/overflow-menu-toggle-class-for-animation.html Original change's description: > [Media Controls] Added animation to overflow menu > > Toggle "closed" class when open/close menu to achieve transition animation. > This CL only has opening animation. > > TODO: Add close animation; Add wave like animation to label when opening menu. > > Bug: 814507 > > Change-Id: I2a036297741f34905fe868c7ea0a99e9ea91cea3 > Reviewed-on: https://chromium-review.googlesource.com/c/1286949 > Commit-Queue: Jazz Xu <jazzhsu@google.com> > Reviewed-by: Tommy Steimel <steimel@chromium.org> > Cr-Commit-Position: refs/heads/master@{#603116} Change-Id: Ia9b6c5e419ec201f6ac328a1de049c65528f6dc0 No-Presubmit: true No-Tree-Checks: true No-Try: true Bug: 814507 , 899335 Reviewed-on: https://chromium-review.googlesource.com/c/1302577 Cr-Commit-Position: refs/heads/master@{#603158} [modify] https://crrev.com/c32b4659479549bd0b0b6dff40c32e7a9857e424/third_party/WebKit/LayoutTests/http/tests/media/video-controls-download-button-saves-media-cross-origin.html [modify] https://crrev.com/c32b4659479549bd0b0b6dff40c32e7a9857e424/third_party/WebKit/LayoutTests/http/tests/media/video-controls-download-button-saves-media.html [modify] https://crrev.com/c32b4659479549bd0b0b6dff40c32e7a9857e424/third_party/WebKit/LayoutTests/http/tests/media/video-controls-overflow-menu-download-button.html [modify] https://crrev.com/c32b4659479549bd0b0b6dff40c32e7a9857e424/third_party/WebKit/LayoutTests/media/controls/closed-captions-dynamic-update.html [modify] https://crrev.com/c32b4659479549bd0b0b6dff40c32e7a9857e424/third_party/WebKit/LayoutTests/media/controls/closed-captions-on-off.html [modify] https://crrev.com/c32b4659479549bd0b0b6dff40c32e7a9857e424/third_party/WebKit/LayoutTests/media/controls/closed-captions-single-track.html [modify] https://crrev.com/c32b4659479549bd0b0b6dff40c32e7a9857e424/third_party/WebKit/LayoutTests/media/controls/closed-captions-switch-track.html [modify] https://crrev.com/c32b4659479549bd0b0b6dff40c32e7a9857e424/third_party/WebKit/LayoutTests/media/controls/overflow-menu-hide-on-click-item.html [delete] https://crrev.com/bc440db926560222bd83bfedf897615e21a4e32e/third_party/WebKit/LayoutTests/media/controls/overflow-menu-toggle-class-for-animation.html [modify] https://crrev.com/c32b4659479549bd0b0b6dff40c32e7a9857e424/third_party/WebKit/LayoutTests/media/controls/text-track-menu-keyboard-navigation.html [modify] https://crrev.com/c32b4659479549bd0b0b6dff40c32e7a9857e424/third_party/WebKit/LayoutTests/media/controls/text-track-menu-pointer-selection.html [modify] https://crrev.com/c32b4659479549bd0b0b6dff40c32e7a9857e424/third_party/WebKit/LayoutTests/media/media-controls.js [modify] https://crrev.com/c32b4659479549bd0b0b6dff40c32e7a9857e424/third_party/WebKit/LayoutTests/media/picture-in-picture/controls/picture-in-picture-button.html [modify] https://crrev.com/c32b4659479549bd0b0b6dff40c32e7a9857e424/third_party/WebKit/LayoutTests/media/picture-in-picture/picture-in-picture-interstitial-sizing.html [modify] https://crrev.com/c32b4659479549bd0b0b6dff40c32e7a9857e424/third_party/WebKit/LayoutTests/media/picture-in-picture/picture-in-picture-interstitial.html [modify] https://crrev.com/c32b4659479549bd0b0b6dff40c32e7a9857e424/third_party/WebKit/LayoutTests/media/track/text-track-selection-menu-add-track.html [modify] https://crrev.com/c32b4659479549bd0b0b6dff40c32e7a9857e424/third_party/WebKit/LayoutTests/media/video-controls-labels.html [modify] https://crrev.com/c32b4659479549bd0b0b6dff40c32e7a9857e424/third_party/WebKit/LayoutTests/media/video-controls-overflow-menu-closed-captions-button.html [modify] https://crrev.com/c32b4659479549bd0b0b6dff40c32e7a9857e424/third_party/WebKit/LayoutTests/media/video-controls-overflow-menu-fullscreen-button.html [modify] https://crrev.com/c32b4659479549bd0b0b6dff40c32e7a9857e424/third_party/WebKit/LayoutTests/media/video-controls-overflow-menu-mute-button.html [modify] https://crrev.com/c32b4659479549bd0b0b6dff40c32e7a9857e424/third_party/WebKit/LayoutTests/media/video-controls-overflow-menu-play-button.html [modify] https://crrev.com/c32b4659479549bd0b0b6dff40c32e7a9857e424/third_party/WebKit/LayoutTests/media/video-controls-track-selection-menu.html [modify] https://crrev.com/c32b4659479549bd0b0b6dff40c32e7a9857e424/third_party/blink/renderer/modules/media_controls/elements/media_control_overflow_menu_list_element.cc [modify] https://crrev.com/c32b4659479549bd0b0b6dff40c32e7a9857e424/third_party/blink/renderer/modules/media_controls/elements/media_control_overflow_menu_list_element.h [modify] https://crrev.com/c32b4659479549bd0b0b6dff40c32e7a9857e424/third_party/blink/renderer/modules/media_controls/elements/media_control_text_track_list_element.cc [modify] https://crrev.com/c32b4659479549bd0b0b6dff40c32e7a9857e424/third_party/blink/renderer/modules/media_controls/media_controls_impl.cc [modify] https://crrev.com/c32b4659479549bd0b0b6dff40c32e7a9857e424/third_party/blink/renderer/modules/media_controls/media_controls_impl.h [modify] https://crrev.com/c32b4659479549bd0b0b6dff40c32e7a9857e424/third_party/blink/renderer/modules/media_controls/resources/modernMediaControls.css
The following revision refers to this bug: https://chromium.googlesource.com/chromium/src.git/+/6ec9a91f0a6112ff42186a0da367109e0be38ab0 commit 6ec9a91f0a6112ff42186a0da367109e0be38ab0 Author: Jazz Xu <jazzhsu@chromium.org> Date: Mon Dec 03 20:36:07 2018 [Media Controls] Overflow menu item wave animation This CL achieve the animation by adding sequential labeled CSS class to overflow menu list item so that we can add delays to each visible items to let the items appear one after another. Bug: 814507 Change-Id: I46ee3b6e6a8cbadaad33d2417454267ff4d62a66 Reviewed-on: https://chromium-review.googlesource.com/c/1357462 Commit-Queue: Jazz Xu <jazzhsu@chromium.org> Reviewed-by: Tommy Steimel <steimel@chromium.org> Cr-Commit-Position: refs/heads/master@{#613224} [modify] https://crrev.com/6ec9a91f0a6112ff42186a0da367109e0be38ab0/third_party/blink/renderer/modules/media_controls/media_controls_impl.cc [modify] https://crrev.com/6ec9a91f0a6112ff42186a0da367109e0be38ab0/third_party/blink/renderer/modules/media_controls/media_controls_impl.h [modify] https://crrev.com/6ec9a91f0a6112ff42186a0da367109e0be38ab0/third_party/blink/renderer/modules/media_controls/resources/modernMediaControls.css [add] https://crrev.com/6ec9a91f0a6112ff42186a0da367109e0be38ab0/third_party/blink/web_tests/media/controls/overflow-menu-animation.html
Comment 1 by amyroberts@chromium.org
, Mar 29 2018