240871 2022-05-24 07:29:09 -0700 REGRESSION (r252945): accelerated animations prevent videos from taking up entire screen in fullscreen mode 2026-10-30 04:47:32 -0700 1 1 1 Unclassified WebKit Animations Safari 15 Unspecified Unspecified RESOLVED CONFIGURATION CHANGED InRadar P2 Normal --- 276855 1 ldebeasi webkit-unassigned dino fred.wang graouts jer.noble simon.fraser webkit-bug-importer oldest_to_newest 1871483 0 459722 ldebeasi 2022-05-24 07:29:09 -0700 Created attachment 459722 Code reproduction Running an accelerated animation on an element prevents the containing <video> element from taking up the entire screen when in fullscreen mode. Steps to reproduce: 1. Open attached code reproduction in Safari for macOS. 2. Click the fullscreen button on the video. Observe that the video goes fullscreen and takes up the entire screen. 3. Exit fullscreen. 4. Click "Add Animation" 5. Click the fullscreen button on the video. Observe that the video goes fullscreen but does not take up the entire screen. Expected Behavior: I expect that the video takes up the entire screen when in fullscreen mode. Actual Behavior: The video does not take up the entire screen when in fullscreen mode. Other Information: - I reproduced this on both Safari 15.5 and STP 145. - This issue does not reproduce on Chrome or Firefox. 1871490 1 graouts 2022-05-24 07:45:16 -0700 Thanks for filing this Liam. Do you have any indication that this behavior could have regressed? 1871491 2 webkit-bug-importer 2022-05-24 07:45:26 -0700 <rdar://problem/93831877> 1871505 3 ldebeasi 2022-05-24 09:09:19 -0700 Thanks for taking a look. This does appear to have regressed. Safari 12.1 does not reproduce the issue, but Safari 13.1+ does. 1871516 4 jer.noble 2022-05-24 09:40:25 -0700 The current fullscreen implementation works by forcibly removing/overriding all styles that create a stacking context between the root and the fullscreen element. In this case, the animation is creating a stacking context that limits the width and height of the video element in fullscreen to the size of the .wrapper div. 1871518 5 graouts 2022-05-24 09:47:47 -0700 (In reply to Liam DeBeasi from comment #3) > Thanks for taking a look. > > This does appear to have regressed. Safari 12.1 does not reproduce the > issue, but Safari 13.1+ does. Are you sure that it wasn't the case that the repro you create uses the Web Animations API which wasn't available in Safari 12.1 and thus no animation is added? 1871521 6 459727 ldebeasi 2022-05-24 09:59:49 -0700 Created attachment 459727 CSS only reproduction Ah, good point! I attached a reproduction that only uses CSS Animations. However, I get the same results as before: Safari 12.1 does not reproduce the issue, but Safari 13.1+ does. 1871530 7 graouts 2022-05-24 10:30:50 -0700 This regressed when we enabled Web Animations for CSS-originated animations in r252945. 2271864 8 482068 fred.wang 2026-10-30 04:44:16 -0700 Created attachment 482068 testcase with a different video The link to the video seems broken, here is the testcase with the video URL tweaked. 2271866 9 fred.wang 2026-10-30 04:47:32 -0700 I cannot reproduce in Safari 27.0.1, so tentatively closing this. Feel free to reopen if you still see it. 459722 2022-05-24 07:29:09 -0700 2022-05-24 07:29:09 -0700 Code reproduction index.html text/html 962 ldebeasi PCFET0NUWVBFIGh0bWw+CjxodG1sPgogIDxoZWFkPgogICAgPG1ldGEgY2hhcnNldD0iVVRGLTgi IC8+CiAgICA8dGl0bGU+VmlkZW8gLSBBY2NlbGVyYXRlZCBBbmltYXRpb248L3RpdGxlPgogICAg PG1ldGEKICAgICAgbmFtZT0idmlld3BvcnQiCiAgICAgIGNvbnRlbnQ9IndpZHRoPWRldmljZS13 aWR0aCwgaW5pdGlhbC1zY2FsZT0xLjAsIHZpZXdwb3J0LWZpdD1jb3ZlciIKICAgIC8+CiAgICA8 c3R5bGU+CiAgICAgIC53cmFwcGVyIHsKICAgICAgICB3aWR0aDogNjAwcHg7CiAgICAgICAgaGVp Z2h0OiA0MDBweDsKICAgICAgfQogICAgPC9zdHlsZT4KICA8L2hlYWQ+CgogIDxib2R5PgogICAg PGRpdiBjbGFzcz0id3JhcHBlciI+CiAgICAgIDx2aWRlbwogICAgICAgIGNvbnRyb2xzCiAgICAg ICAgcHJlbG9hZD0iYXV0byIKICAgICAgICBhdXRvcGxheQogICAgICA+CiAgICAgICAgPHNvdXJj ZSBzcmM9Imh0dHA6Ly90ZWNoc2xpZGVzLmNvbS9kZW1vcy9zYW1wbGUtdmlkZW9zL3NtYWxsLm1w NCIgdHlwZT0idmlkZW8vbXA0IiAvPgogICAgICA8L3ZpZGVvPgogICAgPC9kaXY+CiAgICAKICAg IDxidXR0b24gb25jbGljaz0iYWRkQW5pbWF0aW9uKCkiPkFkZCBBbmltYXRpb248L2J1dHRvbj4K ICAgIAogICAgPHNjcmlwdD4KICAgICAgY29uc3Qgd3JhcHBlciA9IGRvY3VtZW50LnF1ZXJ5U2Vs ZWN0b3IoJy53cmFwcGVyJyk7CiAgICAgIGNvbnN0IGFkZEFuaW1hdGlvbiA9ICgpID0+IHsKICAg ICAgICB3cmFwcGVyLmFuaW1hdGUoWwogICAgICAgICAgeyBvZmZzZXQ6IDAsIHRyYW5zZm9ybTog J3RyYW5zbGF0ZVkoMHB4KScgfSwKICAgICAgICAgIHsgb2Zmc2V0OiAxLCB0cmFuc2Zvcm06IGB0 cmFuc2xhdGVZKDBweClgIH0sCiAgICAgICAgXSwgewogICAgICAgICAgZmlsbDogJ2JvdGgnCiAg ICAgICAgfSk7CiAgICAgIH0KICAgIDwvc2NyaXB0PgogIDwvYm9keT4KPC9odG1sPgo= 459727 2022-05-24 09:59:49 -0700 2022-05-24 09:59:49 -0700 CSS only reproduction index.html text/html 868 ldebeasi PCFET0NUWVBFIGh0bWw+CjxodG1sPgogIDxoZWFkPgogICAgPG1ldGEgY2hhcnNldD0iVVRGLTgi IC8+CiAgICA8dGl0bGU+VmlkZW8gLSBBY2NlbGVyYXRlZCBBbmltYXRpb24gLSBDU1MgQW5pbWF0 aW9uPC90aXRsZT4KICAgIDxtZXRhCiAgICAgIG5hbWU9InZpZXdwb3J0IgogICAgICBjb250ZW50 PSJ3aWR0aD1kZXZpY2Utd2lkdGgsIGluaXRpYWwtc2NhbGU9MS4wLCB2aWV3cG9ydC1maXQ9Y292 ZXIiCiAgICAvPgogICAgPHN0eWxlPgogICAgICAud3JhcHBlciB7CiAgICAgICAgd2lkdGg6IDYw MHB4OwogICAgICAgIGhlaWdodDogNDAwcHg7CiAgICAgICAgCiAgICAgICAgYW5pbWF0aW9uOiB0 cmFuc2Zvcm07CiAgICAgICAgYW5pbWF0aW9uLWR1cmF0aW9uOiAwczsKICAgICAgICBhbmltYXRp b24tZmlsbC1tb2RlOiBib3RoOwogICAgICB9CiAgICAgIAogICAgICBAa2V5ZnJhbWVzIHRyYW5z Zm9ybSB7CiAgICAgICAgZnJvbSB7CiAgICAgICAgICB0cmFuc2Zvcm06IHRyYW5zbGF0ZVkoMHB4 KQogICAgICAgIH0KICAgICAgICB0byB7CiAgICAgICAgICB0cmFuc2Zvcm06IHRyYW5zbGF0ZVko MHB4KQogICAgICAgIH0KICAgICAgfQogICAgPC9zdHlsZT4KICA8L2hlYWQ+CgogIDxib2R5Pgog ICAgPGRpdiBjbGFzcz0id3JhcHBlciI+CiAgICAgIDx2aWRlbwogICAgICAgIGNvbnRyb2xzCiAg ICAgICAgcHJlbG9hZD0iYXV0byIKICAgICAgICBhdXRvcGxheQogICAgICA+CiAgICAgICAgPHNv dXJjZSBzcmM9Imh0dHA6Ly90ZWNoc2xpZGVzLmNvbS9kZW1vcy9zYW1wbGUtdmlkZW9zL3NtYWxs Lm1wNCIgdHlwZT0idmlkZW8vbXA0IiAvPgogICAgICA8L3ZpZGVvPgogICAgPC9kaXY+CiAgPC9i b2R5Pgo8L2h0bWw+Cg== 482068 2026-10-30 04:44:16 -0700 2026-10-30 04:44:16 -0700 testcase with a different video index.html text/html 997 fred.wang PCFET0NUWVBFIGh0bWw+CjxodG1sPgogIDxoZWFkPgogICAgPG1ldGEgY2hhcnNldD0iVVRGLTgi IC8+CiAgICA8dGl0bGU+VmlkZW8gLSBBY2NlbGVyYXRlZCBBbmltYXRpb248L3RpdGxlPgogICAg PG1ldGEKICAgICAgbmFtZT0idmlld3BvcnQiCiAgICAgIGNvbnRlbnQ9IndpZHRoPWRldmljZS13 aWR0aCwgaW5pdGlhbC1zY2FsZT0xLjAsIHZpZXdwb3J0LWZpdD1jb3ZlciIKICAgIC8+CiAgICA8 c3R5bGU+CiAgICAgIC53cmFwcGVyIHsKICAgICAgICB3aWR0aDogNjAwcHg7CiAgICAgICAgaGVp Z2h0OiA0MDBweDsKICAgICAgfQogICAgPC9zdHlsZT4KICA8L2hlYWQ+CgogIDxib2R5PgogICAg PGRpdiBjbGFzcz0id3JhcHBlciI+CiAgICAgIDx2aWRlbwogICAgICAgIGNvbnRyb2xzCiAgICAg ICAgcHJlbG9hZD0iYXV0byIKICAgICAgICBhdXRvcGxheQogICAgICA+CiAgICAgICAgPHNvdXJj ZSBzcmM9Imh0dHBzOi8vYXJjaGl2ZS5vcmcvZG93bmxvYWQvQmlnQnVja0J1bm55XzEyNC9Db250 ZW50L2JpZ19idWNrX2J1bm55XzcyMHBfc3Vycm91bmQubXA0IiB0eXBlPSJ2aWRlby9tcDQiIC8+ CiAgICAgIDwvdmlkZW8+CiAgICA8L2Rpdj4KICAgIAogICAgPGJ1dHRvbiBvbmNsaWNrPSJhZGRB bmltYXRpb24oKSI+QWRkIEFuaW1hdGlvbjwvYnV0dG9uPgogICAgCiAgICA8c2NyaXB0PgogICAg ICBjb25zdCB3cmFwcGVyID0gZG9jdW1lbnQucXVlcnlTZWxlY3RvcignLndyYXBwZXInKTsKICAg ICAgY29uc3QgYWRkQW5pbWF0aW9uID0gKCkgPT4gewogICAgICAgIHdyYXBwZXIuYW5pbWF0ZShb CiAgICAgICAgICB7IG9mZnNldDogMCwgdHJhbnNmb3JtOiAndHJhbnNsYXRlWSgwcHgpJyB9LAog ICAgICAgICAgeyBvZmZzZXQ6IDEsIHRyYW5zZm9ybTogYHRyYW5zbGF0ZVkoMHB4KWAgfSwKICAg ICAgICBdLCB7CiAgICAgICAgICBmaWxsOiAnYm90aCcKICAgICAgICB9KTsKICAgICAgfQogICAg PC9zY3JpcHQ+CiAgPC9ib2R5Pgo8L2h0bWw+Cg==