The bounding rectangle of parent has width 0, but child larger than 0 #39495
Description
TL;DR: Pls see @Loirooriol's minimal example: #39495 (comment)
Describe the bug:
To be clear, parent has display:inline.
child has display:block.
They both have position:static.
This results in panic when I do "WebDriver element screenshot" on the parent.
To Reproduce:
./mach run -r m.huaweimossel.com --screen-size=542x888 --window-size=542x888 --pref=dom_intersection_observer_enabled --pref=dom_xpath_enabled --user-agent="iphone" --webdriver --devtools=6080
You can inspect either using Devtools or WebDriver. For Devtool, run following in the console
Parent
var xpath = "/html/body/div[1]/uni-app/uni-page/uni-page-wrapper/uni-page-body/uni-view/uni-view[3]/uni-scroll-view[1]/div/div/div/uni-view[14]/uni-swiper/div/div/div/uni-swiper-item[2]/uni-view/uni-navigator/a/";
var result = document.evaluate(
xpath,
document,
null,
XPathResult.FIRST_ORDERED_NODE_TYPE,
null
);
var el = result.singleNodeValue;
console.log(el.getBoundingClientRect());Child
var xpath = "/html/body/div[1]/uni-app/uni-page/uni-page-wrapper/uni-page-body/uni-view/uni-view[3]/uni-scroll-view[1]/div/div/div/uni-view[14]/uni-swiper/div/div/div/uni-swiper-item[2]/uni-view/uni-navigator/a/img";
var result = document.evaluate(
xpath,
document,
null,
XPathResult.FIRST_ORDERED_NODE_TYPE,
null
);
var el = result.singleNodeValue;
console.log(el.getBoundingClientRect());Output
Parent has width 0..
DOMRect {
"x": 237.55,
"y": 7738.4,
"width": 0,
"height": 21.6,
"top": 7738.4,
"right": 237.55,
"bottom": 7760,
"left": 237.55
}
Child has width 216.8.
DOMRect {
"x": 237.55,
"y": 7755.533333333334,
"width": 216.8,
"height": 216.8,
"top": 7755.533333333334,
"right": 454.35,
"bottom": 7972.333333333334,
"left": 237.55
}
They should have same width