133923 2014-06-14 22:42:41 -0700 Web Inspector: Inspecting <aside> produces wrong highlight rectangle. 2015-11-02 15:05:55 -0800 1 1 1 Unclassified WebKit Web Inspector 528+ (Nightly build) All All RESOLVED INVALID http://jsfiddle.net/b9WCW/1/ InRadar P2 Normal --- 1 zalan webkit-unassigned graouts joepeck timothy webkit-bug-importer oldest_to_newest 1015749 0 zalan 2014-06-14 22:42:41 -0700 1. load http://jsfiddle.net/b9WCW/1/ 2. inspect <aside class=side> ->highlight rectangle expands beyond the <aside> box. 1015750 1 webkit-bug-importer 2014-06-14 22:42:52 -0700 <rdar://problem/17317549> 1016977 2 joepeck 2014-06-20 11:40:21 -0700 The inspector highlight information comes from the renderer. The RenderBox for the <aside> seems to say it is huge. renderBox->marginRight() is 31104. lldb> f frame #0: 0x00000001142908c5 WebCore`WebCore::(anonymous namespace)::buildRendererHighlight(renderer=0x00007ff8d17ad960, region=0x0000000000000000, highlightConfig=0x00007ff8d141d970, highlight=0x00007fff54751e80) + 741 at InspectorOverlay.cpp:141 138 139 LayoutBoxExtent margins(renderBox->marginTop(), renderBox->marginRight(), renderBox->marginBottom(), renderBox->marginLeft()); 140 -> 141 if (!renderBox->isOutOfFlowPositioned() && region) { 142 RenderBox::LogicalExtentComputedValues computedValues; 143 renderBox->computeLogicalWidthInRegion(computedValues, region); 144 margins.mutableLogicalLeft(renderBox->style().writingMode()) = computedValues.m_margins.m_start; lldb> p *renderBox ... m_frameRect = { m_location = { m_x = (m_value = 31296) m_y = (m_value = 192) } m_size = { m_width = (m_value = 19712) m_height = (m_value = 5760) } } m_marginBox = { m_top = (m_value = 0) m_right = (m_value = 31104) m_bottom = (m_value = 0) m_left = (m_value = 0) } ... 1016978 3 zalan 2014-06-20 11:41:23 -0700 omg that margin! 1016987 4 joepeck 2014-06-20 12:03:13 -0700 Can reproduce without <aside> just pure <div>s. Seems to affect a div with overflow:hidden next to a float: <style> div.one { float: left; width: 3em; } div.two { overflow: hidden; } </style> <div class="one"><p>x</p></div> <div class="two"><p>x</p></div> 1017460 5 zalan 2014-06-22 18:13:33 -0700 (In reply to comment #2) > The inspector highlight information comes from the renderer. The RenderBox for the <aside> seems to say it is huge. renderBox->marginRight() is 31104. > > lldb> f > frame #0: 0x00000001142908c5 WebCore`WebCore::(anonymous namespace)::buildRendererHighlight(renderer=0x00007ff8d17ad960, region=0x0000000000000000, highlightConfig=0x00007ff8d141d970, highlight=0x00007fff54751e80) + 741 at InspectorOverlay.cpp:141 > 138 > 139 LayoutBoxExtent margins(renderBox->marginTop(), renderBox->marginRight(), renderBox->marginBottom(), renderBox->marginLeft()); > 140 > -> 141 if (!renderBox->isOutOfFlowPositioned() && region) { > 142 RenderBox::LogicalExtentComputedValues computedValues; > 143 renderBox->computeLogicalWidthInRegion(computedValues, region); > 144 margins.mutableLogicalLeft(renderBox->style().writingMode()) = computedValues.m_margins.m_start; > > > lldb> p *renderBox > ... > m_frameRect = { > m_location = { > m_x = (m_value = 31296) > m_y = (m_value = 192) > } > m_size = { > m_width = (m_value = 19712) > m_height = (m_value = 5760) > } > } > m_marginBox = { > m_top = (m_value = 0) > m_right = (m_value = 31104) > m_bottom = (m_value = 0) > m_left = (m_value = 0) > } > ... You don't seem to have the LayoutUnit <-> CSS px conversion lldb helper applied. 31296 is 489px which looks to me like normal right margin value.