224161 2021-04-03 14:46:03 -0700 Broken transition when video player with MediaStream changes size 2021-04-08 11:17:40 -0700 1 1 1 Unclassified WebKit Animations Safari 14 Mac (Intel) macOS 10.15 RESOLVED FIXED InRadar P2 Critical --- 1 webkit-bugzilla youennf dino eric.carlson ews-watchlist glenn graouts jer.noble nazar philipj sergio smoley webkit-bug-importer youennf oldest_to_newest 1746819 0 webkit-bugzilla 2021-04-03 14:46:03 -0700 Reproduction: 1. Create video player element 2. Assign CSS transition to that element 2. Assign captured user media stream to that element 3. Change width and height of the element What happens: Video transitions are not smooth. Video mid-transition appears to be jerky, and sometimes black background being exposed. What expected: The transition should be smooth. Additional info: This demo reproduces this bug in Safari 14 on macOS https://jsfiddle.net/ArmorDarks/enrL02yx/35/ 1. Load the demo 2. Wait for predefined video to load 3. Click a few times the "Toggle video size" button - video will smoothly resize without any issues 4. Click "Start camera stream". It will request you camera stream and assign it to the same video player 5. Try the "Toggle video size" button again - instead of a smooth transition, the video will "jump" mid-transition and expose black background sometimes Here's the recording of the reproduction: https://www.dropbox.com/s/kcbse6bv18ri1og/Screen%20Recording%202021-04-04%20at%2000.36.15.mov?dl=0 It seems to be more prominent in heavier applications. For instance, this recording uses exactly the same positioning, but produces a much worse transition: https://www.dropbox.com/s/mjgqzd4al175f8r/Screen%20Recording%202021-04-04%20at%2000.37.44.mov?dl=0 This case is quite common for modern web-based streaming solutions, like Restream Studio, which are using transitions on video element with a user's captured video to smoothly switch between different layouts. There seems to be no way to workaround that issue. 1748068 1 smoley 2021-04-07 14:39:18 -0700 This does not reproduce for me on Safari 13.1.2, I can reproduce this on Safari 14.0.1 as well as TOT 14.2. 1748070 2 webkit-bug-importer 2021-04-07 14:39:28 -0700 <rdar://problem/76366061> 1748242 3 425486 youennf 2021-04-08 02:39:30 -0700 Created attachment 425486 Patch 1748244 4 425488 youennf 2021-04-08 02:42:39 -0700 Created attachment 425488 Patch 1748314 5 ews-feeder 2021-04-08 09:04:32 -0700 commit-queue failed to commit attachment 425488 to WebKit repository. To retry, please set cq+ flag again. 1748376 6 ews-feeder 2021-04-08 11:17:37 -0700 Committed r275662 (236298@main): <https://commits.webkit.org/236298@main> All reviewed patches have been landed. Closing bug and clearing flags on attachment 425488. 425486 2021-04-08 02:39:30 -0700 2021-04-08 02:42:35 -0700 Patch bug-224161-20210408113929.patch text/plain 1893 youennf U3VidmVyc2lvbiBSZXZpc2lvbjogMjc1MzQ5CmRpZmYgLS1naXQgYS9Tb3VyY2UvV2ViQ29yZS9D aGFuZ2VMb2cgYi9Tb3VyY2UvV2ViQ29yZS9DaGFuZ2VMb2cKaW5kZXggYzRmOGNiNGI3N2I3MDI3 OWJlNzE5NGJjYzg1MWM1MDk5MzA3NmEyNi4uZmFmNDIyY2M2ZTVlMGI2NjhjNzViNGQzNWViMTk2 ZmNmZTdiNjU1NiAxMDA2NDQKLS0tIGEvU291cmNlL1dlYkNvcmUvQ2hhbmdlTG9nCisrKyBiL1Nv dXJjZS9XZWJDb3JlL0NoYW5nZUxvZwpAQCAtMSwzICsxLDE5IEBACisyMDIxLTA0LTA4ICBZb3Vl bm4gRmFibGV0ICA8eW91ZW5uQGFwcGxlLmNvbT4KKworICAgICAgICBCcm9rZW4gdHJhbnNpdGlv biB3aGVuIHZpZGVvIHBsYXllciB3aXRoIE1lZGlhU3RyZWFtIGNoYW5nZXMgc2l6ZQorICAgICAg ICBodHRwczovL2J1Z3Mud2Via2l0Lm9yZy9zaG93X2J1Zy5jZ2k/aWQ9MjI0MTYxCisgICAgICAg IDxyZGFyOi8vcHJvYmxlbS83NjM2NjA2MT4KKworICAgICAgICBSZXZpZXdlZCBieSBOT0JPRFkg KE9PUFMhKS4KKworICAgICAgICBJbiBjYXNlIG9mIGFuaW1hdGlvbiB0aGF0IGNoYW5nZXMgdGhl IHJvb3QgbGF5ZXIgYm91bmRzLCB3ZSBuZWVkIHRvIHN5bmNocm9ub3VzbHkgdXBkYXRlCisgICAg ICAgIHRoZSBidWZmZXIgbGF5ZXIgYXMgd2VsbC4KKworICAgICAgICBNYW51YWxseSB0ZXN0ZWQu CisKKyAgICAgICAgKiBwbGF0Zm9ybS9ncmFwaGljcy9hdmZvdW5kYXRpb24vb2JqYy9NZWRpYVBs YXllclByaXZhdGVNZWRpYVN0cmVhbUFWRk9iakMubW06CisgICAgICAgIChXZWJDb3JlOjpNZWRp YVBsYXllclByaXZhdGVNZWRpYVN0cmVhbUFWRk9iakM6OnJvb3RMYXllckJvdW5kc0RpZENoYW5n ZSk6CisKIDIwMjEtMDQtMDcgIFlvdWVubiBGYWJsZXQgIDx5b3Vlbm5AYXBwbGUuY29tPgogCiAg ICAgICAgIFVwZGF0ZSBTRnJhbWUgaW1wbGVtZW50YXRpb24gdG8gbGF0ZXN0IHZlcnNpb24KZGlm ZiAtLWdpdCBhL1NvdXJjZS9XZWJDb3JlL3BsYXRmb3JtL2dyYXBoaWNzL2F2Zm91bmRhdGlvbi9v YmpjL01lZGlhUGxheWVyUHJpdmF0ZU1lZGlhU3RyZWFtQVZGT2JqQy5tbSBiL1NvdXJjZS9XZWJD b3JlL3BsYXRmb3JtL2dyYXBoaWNzL2F2Zm91bmRhdGlvbi9vYmpjL01lZGlhUGxheWVyUHJpdmF0 ZU1lZGlhU3RyZWFtQVZGT2JqQy5tbQppbmRleCA3MWEwOWQzYjBjMGI3YmFmOTRkNWZhNmU5ZmIx MTZlZjZhNmY2NjE1Li43MTBlMmNiNGQ2YmQyZTBlM2QyMzAzZDcyZDMyNDM3NGY0MmRiMjc2IDEw MDY0NAotLS0gYS9Tb3VyY2UvV2ViQ29yZS9wbGF0Zm9ybS9ncmFwaGljcy9hdmZvdW5kYXRpb24v b2JqYy9NZWRpYVBsYXllclByaXZhdGVNZWRpYVN0cmVhbUFWRk9iakMubW0KKysrIGIvU291cmNl L1dlYkNvcmUvcGxhdGZvcm0vZ3JhcGhpY3MvYXZmb3VuZGF0aW9uL29iamMvTWVkaWFQbGF5ZXJQ cml2YXRlTWVkaWFTdHJlYW1BVkZPYmpDLm1tCkBAIC0xMDQ4LDYgKzEwNDgsOSBAQCB2b2lkIE1l ZGlhUGxheWVyUHJpdmF0ZU1lZGlhU3RyZWFtQVZGT2JqQzo6Q3VycmVudEZyYW1lUGFpbnRlcjo6 cmVzZXQoKQogCiB2b2lkIE1lZGlhUGxheWVyUHJpdmF0ZU1lZGlhU3RyZWFtQVZGT2JqQzo6cm9v dExheWVyQm91bmRzRGlkQ2hhbmdlKCkKIHsKKyAgICBhdXRvIGxvY2tlciA9IGhvbGRMb2NrKG1f c2FtcGxlQnVmZmVyRGlzcGxheUxheWVyTG9jayk7CisgICAgaWYgKG1fc2FtcGxlQnVmZmVyRGlz cGxheUxheWVyKQorICAgICAgICBtX3NhbXBsZUJ1ZmZlckRpc3BsYXlMYXllci0+dXBkYXRlQm91 bmRzQW5kUG9zaXRpb24obV9zYW1wbGVCdWZmZXJEaXNwbGF5TGF5ZXItPnJvb3RMYXllcigpLmJv dW5kcywgbV92aWRlb1JvdGF0aW9uKTsKICAgICBtX3Nob3VsZFVwZGF0ZURpc3BsYXlMYXllciA9 IHRydWU7CiB9CiAK 425488 2021-04-08 02:42:39 -0700 2021-04-08 11:17:38 -0700 Patch bug-224161-20210408114237.patch text/plain 1966 youennf U3VidmVyc2lvbiBSZXZpc2lvbjogMjc1MzQ5CmRpZmYgLS1naXQgYS9Tb3VyY2UvV2ViQ29yZS9D aGFuZ2VMb2cgYi9Tb3VyY2UvV2ViQ29yZS9DaGFuZ2VMb2cKaW5kZXggYzRmOGNiNGI3N2I3MDI3 OWJlNzE5NGJjYzg1MWM1MDk5MzA3NmEyNi4uZmFmNDIyY2M2ZTVlMGI2NjhjNzViNGQzNWViMTk2 ZmNmZTdiNjU1NiAxMDA2NDQKLS0tIGEvU291cmNlL1dlYkNvcmUvQ2hhbmdlTG9nCisrKyBiL1Nv dXJjZS9XZWJDb3JlL0NoYW5nZUxvZwpAQCAtMSwzICsxLDE5IEBACisyMDIxLTA0LTA4ICBZb3Vl bm4gRmFibGV0ICA8eW91ZW5uQGFwcGxlLmNvbT4KKworICAgICAgICBCcm9rZW4gdHJhbnNpdGlv biB3aGVuIHZpZGVvIHBsYXllciB3aXRoIE1lZGlhU3RyZWFtIGNoYW5nZXMgc2l6ZQorICAgICAg ICBodHRwczovL2J1Z3Mud2Via2l0Lm9yZy9zaG93X2J1Zy5jZ2k/aWQ9MjI0MTYxCisgICAgICAg IDxyZGFyOi8vcHJvYmxlbS83NjM2NjA2MT4KKworICAgICAgICBSZXZpZXdlZCBieSBOT0JPRFkg KE9PUFMhKS4KKworICAgICAgICBJbiBjYXNlIG9mIGFuaW1hdGlvbiB0aGF0IGNoYW5nZXMgdGhl IHJvb3QgbGF5ZXIgYm91bmRzLCB3ZSBuZWVkIHRvIHN5bmNocm9ub3VzbHkgdXBkYXRlCisgICAg ICAgIHRoZSBidWZmZXIgbGF5ZXIgYXMgd2VsbC4KKworICAgICAgICBNYW51YWxseSB0ZXN0ZWQu CisKKyAgICAgICAgKiBwbGF0Zm9ybS9ncmFwaGljcy9hdmZvdW5kYXRpb24vb2JqYy9NZWRpYVBs YXllclByaXZhdGVNZWRpYVN0cmVhbUFWRk9iakMubW06CisgICAgICAgIChXZWJDb3JlOjpNZWRp YVBsYXllclByaXZhdGVNZWRpYVN0cmVhbUFWRk9iakM6OnJvb3RMYXllckJvdW5kc0RpZENoYW5n ZSk6CisKIDIwMjEtMDQtMDcgIFlvdWVubiBGYWJsZXQgIDx5b3Vlbm5AYXBwbGUuY29tPgogCiAg ICAgICAgIFVwZGF0ZSBTRnJhbWUgaW1wbGVtZW50YXRpb24gdG8gbGF0ZXN0IHZlcnNpb24KZGlm ZiAtLWdpdCBhL1NvdXJjZS9XZWJDb3JlL3BsYXRmb3JtL2dyYXBoaWNzL2F2Zm91bmRhdGlvbi9v YmpjL01lZGlhUGxheWVyUHJpdmF0ZU1lZGlhU3RyZWFtQVZGT2JqQy5tbSBiL1NvdXJjZS9XZWJD b3JlL3BsYXRmb3JtL2dyYXBoaWNzL2F2Zm91bmRhdGlvbi9vYmpjL01lZGlhUGxheWVyUHJpdmF0 ZU1lZGlhU3RyZWFtQVZGT2JqQy5tbQppbmRleCA3MWEwOWQzYjBjMGI3YmFmOTRkNWZhNmU5ZmIx MTZlZjZhNmY2NjE1Li4zYzljNWQwYjg2YmRmYjM2OWIwMGE2YTI3YzllY2Y4Mjg3NzdiZTE5IDEw MDY0NAotLS0gYS9Tb3VyY2UvV2ViQ29yZS9wbGF0Zm9ybS9ncmFwaGljcy9hdmZvdW5kYXRpb24v b2JqYy9NZWRpYVBsYXllclByaXZhdGVNZWRpYVN0cmVhbUFWRk9iakMubW0KKysrIGIvU291cmNl L1dlYkNvcmUvcGxhdGZvcm0vZ3JhcGhpY3MvYXZmb3VuZGF0aW9uL29iamMvTWVkaWFQbGF5ZXJQ cml2YXRlTWVkaWFTdHJlYW1BVkZPYmpDLm1tCkBAIC0xMDQ4LDcgKzEwNDgsOSBAQCB2b2lkIE1l ZGlhUGxheWVyUHJpdmF0ZU1lZGlhU3RyZWFtQVZGT2JqQzo6Q3VycmVudEZyYW1lUGFpbnRlcjo6 cmVzZXQoKQogCiB2b2lkIE1lZGlhUGxheWVyUHJpdmF0ZU1lZGlhU3RyZWFtQVZGT2JqQzo6cm9v dExheWVyQm91bmRzRGlkQ2hhbmdlKCkKIHsKLSAgICBtX3Nob3VsZFVwZGF0ZURpc3BsYXlMYXll ciA9IHRydWU7CisgICAgYXV0byBsb2NrZXIgPSBob2xkTG9jayhtX3NhbXBsZUJ1ZmZlckRpc3Bs YXlMYXllckxvY2spOworICAgIGlmIChtX3NhbXBsZUJ1ZmZlckRpc3BsYXlMYXllcikKKyAgICAg ICAgbV9zYW1wbGVCdWZmZXJEaXNwbGF5TGF5ZXItPnVwZGF0ZUJvdW5kc0FuZFBvc2l0aW9uKG1f c2FtcGxlQnVmZmVyRGlzcGxheUxheWVyLT5yb290TGF5ZXIoKS5ib3VuZHMsIG1fdmlkZW9Sb3Rh dGlvbik7CiB9CiAKIFdURkxvZ0NoYW5uZWwmIE1lZGlhUGxheWVyUHJpdmF0ZU1lZGlhU3RyZWFt QVZGT2JqQzo6bG9nQ2hhbm5lbCgpIGNvbnN0Cg==