mirror of
https://github.com/mozilla/gecko-dev.git
synced 2024-11-29 07:42:04 +00:00
Bug 820891 part 3. Make scroll* properties for tables work with the table wrapper box, not the table box. r=dholbert
--HG-- rename : testing/web-platform/tests/css/cssom-view/table-client-props.html => testing/web-platform/tests/css/cssom-view/table-scroll-props.html
This commit is contained in:
Boris Zbarsky
parent
ebe5685319
commit
e2156c39cb
@ -658,13 +658,6 @@ Element::GetElementsByTagName(const nsAString& aLocalName)
|
||||
return NS_GetContentList(this, kNameSpaceID_Unknown, aLocalName);
|
||||
}
|
||||
|
||||
nsIFrame*
|
||||
Element::GetStyledFrame()
|
||||
{
|
||||
nsIFrame *frame = GetPrimaryFrame(FlushType::Layout);
|
||||
return frame ? nsLayoutUtils::GetStyleFrame(frame) : nullptr;
|
||||
}
|
||||
|
||||
nsIScrollableFrame*
|
||||
Element::GetScrollFrame(nsIFrame **aFrame, FlushType aFlushType)
|
||||
{
|
||||
@ -1004,12 +997,13 @@ Element::ScrollHeight()
|
||||
if (IsSVGElement())
|
||||
return 0;
|
||||
|
||||
nsIScrollableFrame* sf = GetScrollFrame();
|
||||
nsIFrame* frame;
|
||||
nsIScrollableFrame* sf = GetScrollFrame(&frame);
|
||||
nscoord height;
|
||||
if (sf) {
|
||||
height = sf->GetScrollRange().Height() + sf->GetScrollPortRect().Height();
|
||||
} else {
|
||||
height = GetScrollRectSizeForOverflowVisibleFrame(GetStyledFrame()).height;
|
||||
height = GetScrollRectSizeForOverflowVisibleFrame(frame).height;
|
||||
}
|
||||
|
||||
return nsPresContext::AppUnitsToIntCSSPixels(height);
|
||||
@ -1021,12 +1015,13 @@ Element::ScrollWidth()
|
||||
if (IsSVGElement())
|
||||
return 0;
|
||||
|
||||
nsIScrollableFrame* sf = GetScrollFrame();
|
||||
nsIFrame* frame;
|
||||
nsIScrollableFrame* sf = GetScrollFrame(&frame);
|
||||
nscoord width;
|
||||
if (sf) {
|
||||
width = sf->GetScrollRange().Width() + sf->GetScrollPortRect().Width();
|
||||
} else {
|
||||
width = GetScrollRectSizeForOverflowVisibleFrame(GetStyledFrame()).width;
|
||||
width = GetScrollRectSizeForOverflowVisibleFrame(frame).width;
|
||||
}
|
||||
|
||||
return nsPresContext::AppUnitsToIntCSSPixels(width);
|
||||
|
||||
@ -1913,8 +1913,6 @@ protected:
|
||||
InternalGetAttrNameFromQName(const nsAString& aStr,
|
||||
nsAutoString* aNameToUse = nullptr) const;
|
||||
|
||||
nsIFrame* GetStyledFrame();
|
||||
|
||||
virtual Element* GetNameSpaceElement() override
|
||||
{
|
||||
return this;
|
||||
|
||||
@ -44,7 +44,7 @@ function run_test() {
|
||||
t3('td1' ,[1,1,69,44],[16,16,71,46],[0,0,69,46],'table1');
|
||||
t3('tr1' ,[0,0,71,46],[16,16,71,46],[0,0,71,44],'table1');
|
||||
t3('span2',[10,0,20,20],[27,12,30,20],[0,0,20,20],'td2');
|
||||
t3('table1',[0,0,103,131],[10,10,103,131],[0,0,85,50],'body');
|
||||
t3('table1',[0,0,103,131],[10,10,103,131],[0,0,103,131],'body');
|
||||
t3('div1',[10,10,-1,131],[0,0,-1,151],[0,0,-1,85],'body');
|
||||
|
||||
t3('span2b',[10,0,20,20],[25,-1,30,20],[0,0,20,20],'body');
|
||||
@ -56,7 +56,7 @@ function run_test() {
|
||||
t3('td3' ,[0,0,35,20],[0,0,35,20],[0,0,35,20],'table3');
|
||||
t3('tr3' ,[0,0,35,20],[0,0,35,20],[0,0,35,22],'table3');
|
||||
t3('span4' ,[0,0,20,20],[0,0,20,20],[0,0,20,20],'td4');
|
||||
t3('table3',[0,0,35,40],[0,0,35,40],[0,0,35,50],'div3');
|
||||
t3('table3',[0,0,35,40],[0,0,35,40],[0,0,35,40],'div3');
|
||||
t3('div3',[10,10,-1,40],[0,151,-1,60],[0,0,-1,70],'body');
|
||||
|
||||
t3('span5' ,[0,0,20,20],[1,1,20,20],[0,0,20,20],'td5');
|
||||
@ -70,21 +70,21 @@ function run_test() {
|
||||
t3('td7' ,[1,1,37,22],[9,9,39,24],[0,0,37,22],'table7');
|
||||
t3('tr7' ,[0,0,39,24],[9,9,39,24],[0,0,39,22],'table7');
|
||||
t3('span8' ,[0,0,20,20],[26,37,20,20],[0,0,20,20],'table7');
|
||||
t3('table7',[0,0,57,68],[10,319,57,68],[0,0,43,50],'body');
|
||||
t3('table7',[0,0,57,68],[10,319,57,68],[0,0,57,68],'body');
|
||||
t3('div7',[10,10,-1,68],[0,309,-1,88],[0,0,-1,70],'body');
|
||||
|
||||
t3('span9' ,[0,0,20,20],[1,1,20,20],[0,0,20,20],'td9');
|
||||
t3('td9' ,[1,1,22,22],[15,15,24,24],[0,0,22,24],'table9');
|
||||
t3('tr9' ,[0,0,24,24],[15,15,24,24],[0,0,24,22],'table9');
|
||||
t3('span10' ,[0,0,20,20],[17,43,20,20],[0,0,20,20],'table9');
|
||||
t3('table9',[0,0,54,60],[10,407,54,60],[0,0,28,50],'body');
|
||||
t3('table9',[0,0,54,60],[10,407,54,60],[0,0,54,60],'body');
|
||||
t3('div9',[10,10,-1,0],[0,397,-1,20],[0,0,-1,70],'body');
|
||||
|
||||
t3('span11' ,[0,0,20,20],[1,1,20,20],[0,0,20,20],'td11');
|
||||
t3('td11' ,[0,0,22,22],[2,2,22,22],[0,0,22,22],'table11');
|
||||
t3('tr11' ,[0,0,22,22],[2,2,22,22],[0,0,22,22],'table11');
|
||||
t3('span12' ,[0,0,20,20],[28,454,20,20],[0,0,20,20],'body');
|
||||
t3('table11',[0,0,26,30],[10,427,26,30],[0,0,26,50],'body');
|
||||
t3('table11',[0,0,26,30],[10,427,26,30],[0,0,26,30],'body');
|
||||
t3('div11',[10,10,-1,30],[0,417,-1,50],[0,0,-1,70],'body');
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -68,9 +68,9 @@ function run_test() {
|
||||
// without hard-coding the scrollbar width?
|
||||
t3('div1',[20,20,-1,-1],[10,10,200,160],[0,0,230,20],'body');
|
||||
t3('abs1',[20,20,-1,-1],[500,170,200,160],[0,0,230,20],'body');
|
||||
t3('table1',[0,0,306,306],[10,170,306,306],[0,0,266,20],'body');
|
||||
t3('table1',[0,0,306,306],[10,170,306,306],[0,0,306,306],'body');
|
||||
t3('table2',[0,0,206,206],[0,0,206,206],[0,0,206,20],'table2parent');
|
||||
t3('table3',[0,0,228,228],[0,0,228,228],[0,0,208,228],'table3parent');
|
||||
t3('table3',[0,0,228,228],[0,0,228,228],[0,0,228,228],'table3parent');
|
||||
t3('table3parent',[0,0,228,228],[300,100,228,228],[0,0,228,228],'body');
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -324872,6 +324872,12 @@
|
||||
{}
|
||||
]
|
||||
],
|
||||
"css/cssom-view/table-scroll-props.html": [
|
||||
[
|
||||
"/css/cssom-view/table-scroll-props.html",
|
||||
{}
|
||||
]
|
||||
],
|
||||
"css/cssom-view/ttwf-js-cssomview-getclientrects-length.html": [
|
||||
[
|
||||
"/css/cssom-view/ttwf-js-cssomview-getclientrects-length.html",
|
||||
@ -548817,6 +548823,10 @@
|
||||
"7327b44c0f8ed0c8ff2d4a36b89255eca85a064f",
|
||||
"testharness"
|
||||
],
|
||||
"css/cssom-view/table-scroll-props.html": [
|
||||
"f8a18c1a89a24551113eebed4937729a5a581de8",
|
||||
"testharness"
|
||||
],
|
||||
"css/cssom-view/ttwf-js-cssomview-getclientrects-length.html": [
|
||||
"7f3440e65abbe692e3c28f1f1d04671054ecc815",
|
||||
"testharness"
|
||||
|
||||
@ -0,0 +1,83 @@
|
||||
<!doctype html>
|
||||
<meta charset=utf-8>
|
||||
<title>scroll* properties on tables</title>
|
||||
<link rel="help" href="https://drafts.csswg.org/cssom-view/#extension-to-the-element-interface">
|
||||
<script src=/resources/testharness.js></script>
|
||||
<script src=/resources/testharnessreport.js></script>
|
||||
<div id="test-target" style="position: absolute"></div>
|
||||
<script>
|
||||
test(function() {
|
||||
// Each test consists of four elements: the markup to use, the expected
|
||||
// value of offsetWidth on the table, the expected value of offsetHeight
|
||||
// on the table, and the description string.
|
||||
var tests = [
|
||||
[ `<table style="width: 20px; height: 30px">`,
|
||||
20, 30,
|
||||
"Basic table" ],
|
||||
[ `<table><caption style="width: 40px; height: 50px">`,
|
||||
40, 50,
|
||||
"Basic caption" ],
|
||||
[ `<table style="width: 20px; height: 30px">
|
||||
<caption style="width: 10px; height: 20px">`,
|
||||
20, 50,
|
||||
"Table and narrower caption" ],
|
||||
[ `<table style="width: 20px; height: 30px">
|
||||
<caption style="width: 40px; height: 20px">`,
|
||||
40, 50,
|
||||
"Table and wider caption" ],
|
||||
[ `<table style="width: 20px; height: 30px; padding: 1px 2px 3px 4px">`,
|
||||
20, 30,
|
||||
"Table with padding" ],
|
||||
[ `<table style="width: 20px; height: 30px; padding: 1px 2px 3px 4px;
|
||||
box-sizing: content-box">`,
|
||||
26, 34,
|
||||
"Table with padding and content-box sizing" ],
|
||||
[ `<table style="width: 20px; height: 30px;
|
||||
border-width: 1px 2px 3px 4px; border-style: solid;
|
||||
border-collapse: separate; box-sizing: content-box">`,
|
||||
26, 34,
|
||||
"Table with separated border" ],
|
||||
[ `<table style="width: 20px; height: 30px;
|
||||
border-width: 2px 4px 6px 8px; border-style: solid;
|
||||
border-collapse: collapse; box-sizing: content-box">
|
||||
<tr><td>`,
|
||||
26, 34,
|
||||
"Table with collapsed border" ],
|
||||
[ `<table>
|
||||
<caption style="width: 40px; height: 50px; padding: 1px 2px 3px 4px">`,
|
||||
46, 54,
|
||||
"Caption with padding" ],
|
||||
[ `<table>
|
||||
<caption style="width: 40px; height: 50px;
|
||||
border-width: 1px 2px 3px 4px; border-style: solid">`,
|
||||
46, 54,
|
||||
"Caption with border" ],
|
||||
[ `<table>
|
||||
<caption style="width: 40px; height: 50px; margin: 1px 2px 3px 4px;">`,
|
||||
46, 54,
|
||||
"Caption with margin" ],
|
||||
[ `<table style="caption-side: bottom">
|
||||
<caption style="width: 40px; height: 50px;">`,
|
||||
40, 50,
|
||||
"Bottom caption" ],
|
||||
];
|
||||
|
||||
function target() {
|
||||
return document.getElementById("test-target");
|
||||
}
|
||||
|
||||
function table() {
|
||||
return target().querySelector("table");
|
||||
}
|
||||
|
||||
for (var t of tests) {
|
||||
test(function() {
|
||||
target().innerHTML = t[0];
|
||||
assert_equals(table().scrollWidth, t[1], t[3] + " scrollWidth");
|
||||
assert_equals(table().scrollHeight, t[2], t[3] + " scrollHeight");
|
||||
assert_equals(table().scrollLeft, 0, t[3] + " scrollLeft");
|
||||
assert_equals(table().scrollTop, 0, t[3] + " scrollTop");
|
||||
}, t[3]);
|
||||
}
|
||||
}, "Overall test to make sure there are no exceptions");
|
||||
</script>
|
||||
Loading…
Reference in New Issue
Block a user