Rendering does not work after using "display: none"
Reported by
patrick....@gmail.com,
Aug 23 2016
|
|||||
Issue descriptionUserAgent: Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/52.0.2743.116 Safari/537.36 Example URL: Steps to reproduce the problem: 1. Hide an element with display none (hidden at page load) 2. Change the display attribute to show the element It does not happen every at every try. You have to retry it a few times. Example: https://bamboo.tobit.software/Bestellen What is the expected behavior? The element should be shown correctly. If you resize the browser it will be rendered. What went wrong? The element is not displayed.If you resize the browser it will be rendered. Does it occur on multiple sites: Yes Is it a problem with a plugin? No Did this work before? Yes Does this work in other browsers? Yes Chrome version: 52.0.2743.116 Channel: stable OS Version: 10.0 Flash Version: Shockwave Flash 22.0 r0
,
Aug 24 2016
Thanks for the report & example. CL: https://chromium.googlesource.com/chromium/src/+log/efb0407ede1da3162449ba51c7743a5b5a477589..714109e6afe66297e7fe02cb8c499840856d1d5b Unable to find the culprit, requesting Dev team to check the issue and assign to concerned owner. Good Build: 52.0.2715.0 Bad Build: 52.0.2717.0 Able to reproduce the issue on Win7, Mac OS X 10.11.5, Ubuntu 14.04 using Chrome 52.0.2743.116, Beta 53.0.2785.70, Dev 54.0.2837.0 & Canary#54.0.2837.0
,
Aug 24 2016
,
Aug 25 2016
Hey, I checked the issue and came to the following conclusion:
The inner iFrame 'CustomTappIFrame' is resized via a message that is send to the top frame in an interval. The resize function is wrapped with window.requestAnimationFrame. The iFrames initial height is 500px, but because React didn't render anything in the first 200ms the new height of the inner iFrame is now 0. An element with the height 0 is not rendered and thus the resize function that is wrapped by the requestAnimationFrame gets not called again, even tho the interval is triggered every 200ms. After a resize the browser rerenders and fires the requestAnimationFrame callback. Thats why the iFrame is visible after resizing the window.
Did chromium change something in the way render cycles are handled/the requestAnimationFrame method worked? Is this intended behavior or a bug?
Here is part of the resize code for a better understanding:
var resizeHandler = function resizeHandler() {
window.requestAnimationFrame(() => {
let height = document.body.offsetHeight;
if (heightCache === height || height === 0) {
return;
}
window.parent.postMessage('height: ' + height, '*')
heightCache = height;
});
};
setInterval(resizeHandler, 200);
,
Aug 25 2016
Is that code running in a cross origin frame? Chrome recently stopped running requestAnimationFrame callbacks in invisible cross origin frames -- see https://www.chromestatus.com/feature/4514713492783104
,
Aug 26 2016
I'm trying to reproduce at https://bamboo.tobit.software/Bestellen. What should I be looking for? Could you please provide a screenshot or video of what is wrong?
,
Aug 29 2016
Feedback needed for both Comment 5 and Comment 6. In the regression range given in comment 2, this might be it: Add FrameView::updateAllLifecyclePhasesExceptPaint and use it in a few cases. https://chromium.googlesource.com/chromium/src/+/04e4faa37b382d13044fa6ceb41fc5308dbc8c2c
,
Nov 2 2016
Mark it as WontFix since there are no feedback from user more than a month.Feel free to raise a new issue if sill facing. Thank you! |
|||||
►
Sign in to add a comment |
|||||
Comment 1 by junov@chromium.org
, Aug 23 2016