74451 2011-12-13 15:02:07 -0800 Part of page incorrectly aligned when inserting an empty beforeLoad listener 2022-08-12 14:51:45 -0700 1 1 1 Unclassified WebKit UI Events 528+ (Nightly build) Unspecified Windows 7 RESOLVED CONFIGURATION CHANGED http://highslide.com/examples/gallery-horizontal-strip.html P2 Normal --- 0 fam.lam webkit-unassigned aestes ahmad.saleem792 ap bfulgham brent.montrose eason.goodale fam.lam jberlin rniwa simon.fraser zalan oldest_to_newest 520395 0 119090 fam.lam 2011-12-13 15:02:07 -0800 Created attachment 119090 Chrome test extension When an empty beforeLoad handler is inserted into a page (for example by an extension), a part of the page can be incorrectly aligned. Verified to be broken in WebKit r102684 on Windows 7 Reproduction steps: 1. Install attached extension (if you use Chrome). Otherwise, create an extension that uses this code in it's content script: document.addEventListener("beforeload", function(event) {}, true); Alternatively, you could use the AdBlock extension (http://safariadblock.com/) instead, although it's beforeload handler is not empty. 2. navigate to http://highslide.com/examples/gallery-horizontal-strip.html 3. click the first image 4. notice the bottom (navigation) bar is shifted to the right. 5. remove the extension and repeat steps 2, 3 and 4 and notice the issue has gone away. Expected: the bottom navigation bar should be centered Instead: the bottom bar is shifted to the right as if it was centered before it had it's size being applied (in that case it's a possible side effect of fixed bug 45586) 520736 1 119168 trev 2011-12-14 00:01:51 -0800 Created attachment 119168 Minimized test case I can confirm the bug, minimized test case (no longer requiring an extension) is attached. Took me a while to figure this out but what this site does apparently: * It preloads thumbnail images. * When the user clicks an image it fills the thumbnail row with new images using the same src as for preloaded images. * It expects the offsetWidth for the thumbnail row to be correct immediately after inserting the images. It's that last step that fails - if a beforeload event handler is present the width is reported as if the width of all images were zero. That's what the testcase demonstrate: if you create a copy of a preloaded image and insert it into a table then the reported offsetWidth of the image container is usually immediately correct, not if you have a beforeload event listener however. The strange thing is: if you test img2.width you will get the correct value before offsetWidth of the container is accessed and zero afterwards. I guess that accessing offsetWidth triggers a reflow and something goes wrong there. 943367 2 eason.goodale 2013-10-24 17:22:47 -0700 Sorry to bring this up from the dead, but is there a fix planned? 1891002 3 ahmad.saleem792 2022-08-12 14:51:32 -0700 I am able to reproduce this bug in Safari 15.6 on macOS 12.5 on using attached test case and following instruction and by putting beforeload event, the image contain width becomes "2" rather than "102" as before and other browsers (Chrome Canary 106 and Firefox Nightly 105) does not change width even if event is added. Although it is fixed in Safari Technical Preview 151 and it does not change the image width. Since it is fixed, I am going to mark this "RESOLVED CONFIGURATION CHANGED". I don't know what fixed it but appreciate if someone can comment and share some input. Thanks! 119090 2011-12-13 15:02:07 -0800 2011-12-13 15:02:07 -0800 Chrome test extension BeforeLoad.crx application/x-chrome-extension 935 fam.lam Q3IyNAIAAACiAAAAgAAAADCBnzANBgkqhkiG9w0BAQEFAAOBjQAwgYkCgYEAwYnJMqduFOpMUmDn TRX1KkN3WKBTyDOiBu6BToJiA+roI5wEkOwwY020z4BE+G6subrMn03zLUugT6xCXngNoiCOZLuY WWH7PJC31j+foVTRdxg9vDloCdAxXe6loHZFOjD8gl5hTb3U+HdSOBIvupT9SLw7Rkg3vAGjfdsY PVkCAwEAAQ1WHzjDdVjW99tEbprrD4nh7J8yRHbCRaIfZQ2dGvf7adpHlcOuJKfRtHpLTC8dHnvP TehlgPGju4GoMc/neSTklGMDsMSl3P0gt+L4JCYLatWyEhMo/cHoBsPTdlwh2kfQsCLjz5UmsVub SeAy35oibFhyqv7WKoq6rctHD6bAUEsDBBQAAAAIAAAAAAB716Ii3AAAAKoBAAANAAAAYmVmb3Jl bG9hZC5qc21Qy07DMBC85ysGn2xR8gFEHLnxB1WFTLxJLLlr5Ed6oPw7W4wqUvWw0u5oZmd2V5sw 2jIu5N59oWPGC/aHoVsFD3GeyQkw2ZBp6Fwc65G49Na511WaN58LMSWtPmiKiUK0Tu0wVR6Lj6zp QjL46gA/QT+0hUZGbE37z5qXRu9rCjifobiGoMwgZBL3pomcY6Be9kCrJ0DhEfdV3zuUVEm67uTZ xdOd0LdxW9J/Jlr9pRQ3cdpGDsRzWQRW5llKlNd/XZxllpdAe3jeKs3tLddTNrS9P7Q7fr9vhh9Q SwMEFAAAAAgAAAAAANO5SC23AAAAYQEAAA0AAABtYW5pZmVzdC5qc29ufVC5DoMwDN0r8Q9RRoSg XRn7Dd2qCqWJUahyIMd0Qf335kCFqZPld/lYqxNj3AkLvGf8CqNHMF4oRhAIkDeZfwOGybskubTn DVQQJE4zbcQtGgIjDey5p2jhlPnFzIB2CikpRMc9YRHVRHPfdXVX86Z0YWuT4FGs0jsCR0MZebCv pUSJFSQ1ZOpPZsnLhlfR7uu2ETnwuLhBULpNebnYPJ4EEt8lwphhxPi9FEW4QGE+efPqFOsXUEsB AgAAFAAAAAgAAAAAAHvXoiLcAAAAqgEAAA0AAAAAAAAAAQAAAAAAAAAAAGJlZm9yZWxvYWQuanNQ SwECAAAUAAAACAAAAAAA07lILbcAAABhAQAADQAAAAAAAAABAAAAAAAHAQAAbWFuaWZlc3QuanNv blBLBQYAAAAAAgACAHYAAADpAQAAAAA= 119168 2011-12-14 00:01:51 -0800 2011-12-14 00:01:51 -0800 Minimized test case beforeload_bug.html text/html 4060 trev PCFET0NUWVBFIGh0bWw+Cgo8aHRtbD4KPGhlYWQ+CiAgPHRpdGxlPmJlZm9yZWxvYWQgZXZlbnQg aGFuZGxlciBpbmZsdWVuY2luZyBpbWFnZSBsb2FkPC90aXRsZT4KCiAgPHNjcmlwdCB0eXBlPSJ0 ZXh0L2phdmFzY3JpcHQiPgogICAgZnVuY3Rpb24gcnVuVGVzdCgpCiAgICB7CiAgICAgIHZhciBp bWcgPSBkb2N1bWVudC5jcmVhdGVFbGVtZW50KCJpbWciKTsKICAgICAgaW1nLm9ubG9hZCA9IGZ1 bmN0aW9uKCkKICAgICAgewogICAgICAgIHZhciBpbWcyID0gZG9jdW1lbnQuY3JlYXRlRWxlbWVu dCgiaW1nIik7CiAgICAgICAgaW1nMi5zcmMgPSBpbWcuc3JjOwogICAgICAgIGRvY3VtZW50Lmdl dEVsZW1lbnRCeUlkKCJpbWFnZUNvbnRhaW5lciIpLmFwcGVuZENoaWxkKGltZzIpOwogICAgICAg IGRvY3VtZW50LmdldEVsZW1lbnRCeUlkKCJyZXN1bHQiKS50ZXh0Q29udGVudCA9ICJJbWFnZSBj b250YWluZXIgd2lkdGg6ICIgKyBkb2N1bWVudC5nZXRFbGVtZW50QnlJZCgiaW1hZ2VDb250YWlu ZXIiKS5vZmZzZXRXaWR0aDsKICAgICAgICBkb2N1bWVudC5nZXRFbGVtZW50QnlJZCgiaW1hZ2VD b250YWluZXIiKS5yZW1vdmVDaGlsZChpbWcyKTsKICAgICAgfQogICAgICBpbWcuc3JjID0gImRh dGE6aW1hZ2UvcG5nO2Jhc2U2NCxpVkJPUncwS0dnb0FBQUFOU1VoRVVnQUFBR1FBQUFCa0NBTUFB QUJIUEdWbUFBQUN0VkJNVkVYJTJGJTJGd0FBQUFEJTJCJTJGZ0FCQVFEMzl3RGIyd0FORFFEMDlB RDklMkZRRHQ3UUFzTEFBS0NnRFMwZ0Q4JTJGQURPemdDbHBRRDI5Z0NRa0FBbUpnRDYlMkJnRDcl MkJ3Q29xQUFTRWdCNmVnQUNBZ0NPamdBSEJ3RGQzUUJoWVFBTEN3QUpDUUJQVHdEbTVnRGMzQUFE QXdDRmhRQXZMd0RyNndBT0RnQ1Bqd0RUMHdCM2R3Q1VsQURoNFFCJTJCZmdEbDVRRGo0d0FVRkFC dGJRQkxTd0MlMkJ2Z0R5OGdEMTlRQUZCUUJmWHdBZEhRRE16QUFSRVFDM3R3QjlmUUFFQkFCJTJG ZndCUVVBRHc4QUNzckFCVlZRRGUzZ0FURXdESHh3QSUyRlB3QzZ1Z0N6c3dCMmRnQWVIZ0RGeFFB MU5RREx5d0FNREFBR0JnQXBLUUNucHdBJTJCUGdDd3NBQmlZZ0JDUWdCWVdBQjBkQUNwcVFBWEZ3 RG82QUJzYkFENSUyQlFBV0ZnQ05qUUJsWlFDZ29BRHo4d0J2YndDeHNRRHA2UUJ1YmdEaTRnQ1ds Z0NrcEFDNHVBRFIwUUFmSHdESnlRQm5ad0JEUXdCZFhRQUlDQURVMUFCR1JnQVFFQUFZR0FCN2V3 REd4Z0JIUndCYld3QktTZ0RXMWdCeGNRRGs1QURZMkFCTVRBQ2hvUUJnWUFCcWFnQWFHZ0RxNmdD TGl3Q0Rnd0JOVFFDeXNnQkpTUUNTa2dEYTJnQzl2UUJ3Y0FENCUyQkFBN093QVpHUUJyYXdBdUxn Q21wZ0JCUVFERXhBQzJ0Z0I0ZUFDWm1RRHg4UUJwYVFBNE9BQTJOZ0I4ZkFBVkZRQXJLd0F0TFFC YVdnQ1ZsUURaMlFEWDF3QlhWd0FrSkFEZzRBQ3Zyd0EzTndBcUtnREJ3UUJqWXdEQXdBQ0NnZ0Rm M3dEVjFRQW9LQUNkblFDMXRRQ2Zud0FqSXdDTWpBQTBOQUE4UEFDMHRBQlVWQUFjSEFCa1pBRG41 d0FoSVFDUmtRQTZPZ0NhbWdDS2lnQjFkUUM4dkFCVFV3Q2VuZ0JjWEFEdjd3Q0lpQUE5UFFCZVhn Q0VoQUJPVGdBUER3REl5QUF3TUFBbkp3QyUyRnZ3Q3VyZ0F5TWdEQ3dnQkVSQUFiR3dBbEpRQlpX UUJ5Y2dCSVNBQkZSUUNZbUFCV1ZnQnpjd0NxcWdERHd3RFB6d0I1ZVFCb2FBREt5Z0FpSWdDdHJR RE56UUIlMkJXNG01QUFBRTVrbEVRVlI0WHUzYVU3UHNXQmpINGZkTm05dTJiZHUyZVd6YnRtM2JH TnUyYmMlMkZubUszT1NYYXlrblIzY2plJTJGMiUyRiUyRkZVNmxVclZTcUZxQzBVbTZ0V2o3cDJB MDFqT1N4cnRGciUyQjZhcUxTcVVsQlRFdSUyRk9ObmRNOGdSUDFibnJSaG9OeUlFdlQ0bWRRUUc2 clM5Y3lKNUhJb2pBUUxUVG1XU2VRVGhjMVNFcGZYZXp2R05MV1RvSDA2a044N1VlTVQxckF2cDQ0 WUNjU0ZGY0NkamN3WWRBZXBPRU9PTlREMVpJUjFWb2RPSmglMkJXNU0wWkhBV09ORzl4NlFneGx4 d3FvUUY0a2hWRWppWjdwSVlFcElCVG1lWkxveTg1UXB5MUMyRWhLaEJudmFSa2FvTWtDbjlCeVNr SlJSa3kzVUpQNUppQlJrTHZjMkhoQjhCV1p1bjVVR21nTXlkNUNKZlpzcU5VTSUyQlBSMHoxSUhz Slc4WWhjYUJBRzltSWU0WVNpT2RLRnJJUkZHbGVJUU41VlElMkZLMVBFSThhMGhBMkZlYmpHdFY0 SGJqTkpYJTJGR2FaUlpDSHdUVHlQcEZJUHZReER0WFVFUWJzb21wVGhvZmdyc1hDeW53YThTSVpa dnBiJTJCbklsYXlodnNBM0xxZ1VSYSUyQkVZWXZRZ0dFbnVTSmZEZkJiRE0waFhZUlZVUXNhUUlp QzBHUm1WTVlaRTVyQ0FFa0xhUjVIb2NzSWVFTVJFVEJwNm1EYklIQXBYQ0NFbGRTUElMdExlaXF6 YzZDR2ZQUlNBVUhFanlFelM3TWRHVXVuaGNmYXdTUkM1bzBMQXZDU0pTRDhKeVJaRWRFOGg0Rkhp ZklTTnZFNFB4OW5EQ1JCc0NnSjJFOWNyaTVpR3Y1a2VRcjJaZ3lwZEdHbEZVRDFIbmdPWnlBN0dV TXNjRGxoRWpwWm1xSWdpenclMkZxa080ODglMkZ6b3U0QjAybm9RenRVZGJsbUFYT1ZjJTJCdlNZ elJvV3Q5aUd2RjlCcklWd1NYRFhYSXNlSmt6RlptQ1hIRGp5WHZ4WFZvSm9mckFjaE51emUzcnEw MmJnOW1EbWxQNzNHa0ZDVTJFU0tKNFY2cFZIWG9JRTVSRlhVQ3VQNkJVRSUyRnUlMkYlMkZQSlFu S0VoU0hsRkRvJTJGSklGSGdwajhUQ2ZlV1JmTWhXSG9tSE5rcHhaRDRjTEZIYThEZ012dWxLSTVw Z3dFU2xrWnNJdUZwcHhBY0JldzNLR2dPSEVSQmRsRVZ5dzRlUk1tV1JDQnhHems5VDBuQzlNSUpn RE85S1JkeXpCMWhUY0lwMzJJdWp5Qm1LYjUyQTJwbDZ5VWJwQyUyRmdpN3hBNGhvUyUyRkNkenlz eER4b3puU2lJVE5qRDlYVmhyVEdJSTd1T09jcFRqYzBnZ0pMeXp6dFRvY3puY3FkMXVPTnNSJTJG QldlMFJ1Sm8xeSUyQkxNQmt1RFRoYURoZVo0VTBqbUFhY0RIZHhyTHI3WmpJUnNOdUlZMjBJNE00 bjhCRVNQaHU0OWJqYm1PQzB0OWRZZ051Tm5uZnliRVJ2RE1VMTFnY3hFRHpyQWR6NlVyVm9hOUda Y3oyNWZmdHRrNmRoenMwUGwwVFRjM2pYZXVCcElUSVI5QU8lMkJyTmVZZjlsWjNzYVFpZDAlMkJQ cldueTg3Mk5pT2pCYk9CciUyQlBJUmlxdUFHJTJCZnJNcERrWUxUZGdKdmhwWnhDQzdSQTM4YW4w OVZTTzZ6UTdsQWFDMk9SM0Fia0JyNFBMV2hpUSUyRkl1aDM0eFdRZ1ZhUGlJa0ZmQVRsUHpjblRY MSUyRlglMkJ0S0FhVzVib0o5MVA1QXIlMkZ3YTVDSDZiRE1LNUpoJTJGenVoeFJVTERkYmRiZWdN bDZFRXpYaVh3SUh0V0JiT2tuSWolMkJDMzNuS2hpUWlDY0YlMkJ1UXczSkNQNHZUeEd2RW9Jd1gw VzJaNkRqR0MyMDIlMkJmU2tReEJIOVk1NXd4ZVNLS0kyaGM0WXl4NTBlVWdtRDBUNDRiVTNNa1gx JTJGNE9jd3hZdXN2S3BTTVlNNGtpd05HelVVN3I1VHMlMkJzMWVJamJiJTJGc3N4V1hkJTJGdDRj SSUyQkVPTFpJUmMwSiUyRnpwQkpYejZVNGZHR3B1YmpVSUM3b3FqdTB6bDI5bWh1WGZrcElVUDhW Y1ZHR1MyU3F2NmU3eEdieUFRT2FmM3dpQ3hHZFElMkJqODNSZE9hUDgzTkZNJTJGQ2xEcXFOajgl MkJQbVJKcFRVZjRGQTFyRENpUG03QUFBQUFFbEZUa1N1UW1DQyI7CiAgICB9CiAgPC9zY3JpcHQ+ Cgo8L2hlYWQ+Cjxib2R5PgoKPHA+CiAgQ2xpY2sgdGhlIGJ1dHRvbiB0byBsb2FkIHRoZSBpbWFn ZS4gTm90ZSB0aGF0IHRoZSByZXN1bHRpbmcgaW1hZ2UgY29udGFpbmVyIHdpZHRoIGlzIDEwMi4K ICBOb3cgY2xpY2sgdGhlIG90aGVyIGJ1dHRvbiB0byBhZGQgYmVmb3JlbG9hZCBldmVudCBsaXN0 ZW5lciBhbmQgbG9hZCBpbWFnZSBhZ2Fpbi4gSXQKICBzaG91bGRuJ3QgbWFrZSBhbnkgZGlmZmVy ZW5jZSB5ZXQgdGhlIGltYWdlIGNvbnRhaW5lciB3aWR0aCBpcyBub3cgYmVpbmcgcmVwb3J0ZWQg YXMgMi4KPC9wPgoKPGJ1dHRvbiBvbmNsaWNrPSJydW5UZXN0KCkiPkNsaWNrIHRvIGxvYWQgaW1h Z2U8L2J1dHRvbj4KCjxidXR0b24gb25jbGljaz0iZG9jdW1lbnQuYWRkRXZlbnRMaXN0ZW5lcign YmVmb3JlbG9hZCcsIGZ1bmN0aW9uKGUpe30sIHRydWUpOyI+Q2xpY2sgdG8gYWRkIGJlZm9yZWxv YWQgZXZlbnQgbGlzdGVuZXI8L2J1dHRvbj4KCjx0YWJsZT4KPHRyPjx0ZCBpZD0iaW1hZ2VDb250 YWluZXIiPgo8L3RkPjwvdHI+CjwvdGFibGU+Cgo8ZGl2IGlkPSJyZXN1bHQiPjwvZGl2PgoKPC9i b2R5Pgo8L2h0bWw+Cg==