Bug 1086948 - Remove scroll-behavior: instant CSS value option. r=bz

- Removed "instant" CSS keyword and references used by scroll-behavior.
- Updated tests, removing scroll-behavior: instant test cases.
This commit is contained in:
Kearwood (Kip) Gilbert 2014-10-22 11:37:00 +02:00
parent e6256d996f
commit be01a51ee2
10 changed files with 40 additions and 106 deletions

View File

@ -18,8 +18,7 @@ struct ScrollbarStyles
// or NS_STYLE_OVERFLOW_AUTO.
uint8_t mHorizontal;
uint8_t mVertical;
// Always one of NS_STYLE_SCROLL_BEHAVIOR_AUTO,
// NS_STYLE_SCROLL_BEHAVIOR_INSTANT, or
// Always one of NS_STYLE_SCROLL_BEHAVIOR_AUTO or
// NS_STYLE_SCROLL_BEHAVIOR_SMOOTH
uint8_t mScrollBehavior;
ScrollbarStyles(uint8_t aH, uint8_t aV, uint8_t aB) : mHorizontal(aH),

View File

@ -1789,15 +1789,7 @@ ScrollFrameHelper::AsyncScroll::InitTimingFunction(nsSMILKeySpline& aTimingFunct
bool
ScrollFrameHelper::IsSmoothScrollingEnabled()
{
if (!Preferences::GetBool(SMOOTH_SCROLL_PREF_NAME, false)) {
return false;
}
if (gfxPrefs::ScrollBehaviorEnabled()) {
ScrollbarStyles styles = GetScrollbarStylesFromFrame();
return styles.mScrollBehavior != NS_STYLE_SCROLL_BEHAVIOR_INSTANT;
} else {
return true;
}
return Preferences::GetBool(SMOOTH_SCROLL_PREF_NAME, false);
}
class ScrollFrameActivityTracker MOZ_FINAL : public nsExpirationTracker<ScrollFrameHelper,4> {

View File

@ -37,16 +37,13 @@
overflow: scroll;
}
#scroll_1, #scroll_2, #scroll_3, #scroll_7 {
#scroll_1, #scroll_2, #scroll_3, #scroll_6 {
scroll-behavior: smooth;
}
#scroll_4 {
scroll-behavior: instant;
}
#scroll_5 {
scroll-behavior: auto;
}
}
</style>
@ -76,10 +73,6 @@
<div id="box6a" class="a_box"></div>
<div id="box6b" class="another_box"></div>
</div>
<div id="scroll_7" class="scroll_box">
<div id="box7a" class="a_box"></div>
<div id="box7b" class="another_box"></div>
</div>
<script>
function doTest() {
if (document.location.search != '?ref') {
@ -88,11 +81,10 @@
document.getElementById("box3b").scrollIntoView({block: "end", behavior: "smooth"});
document.getElementById("box4b").scrollIntoView({block: "end", behavior: "smooth"});
document.getElementById("box5b").scrollIntoView({block: "end", behavior: "smooth"});
document.getElementById("box6b").scrollIntoView({block: "end", behavior: "smooth"});
document.getElementById("box7b").scrollIntoView(false);
document.getElementById("box6b").scrollIntoView(false);
// Interrupt any smooth scrolling
for (var i=1; i <= 7; i++) {
for (var i=1; i <= 6; i++) {
document.getElementById("scroll_" + i).scrollLeft
= document.getElementById("scroll_" + i).scrollLeft;
document.getElementById("scroll_" + i).scrollTop
@ -101,7 +93,7 @@
}
document.documentElement.removeAttribute("class");
}
for (var i=1; i <= 7; i++) {
for (var i=1; i <= 6; i++) {
document.getElementById("box" + i + "a")
.scrollIntoView({block: "start", behavior: "instant"});
}

View File

@ -37,15 +37,11 @@
overflow: scroll;
}
#scroll_2, #scroll_6, #scroll_9, #scroll_12 {
#scroll_1, #scroll_4, #scroll_6, #scroll_8 {
scroll-behavior: auto;
}
#scroll_1, #scroll_5, #scroll_8, #scroll_11 {
scroll-behavior: instant;
}
#scroll_4 {
#scroll_3 {
scroll-behavior: smooth;
}
@ -92,59 +88,39 @@
<div id="box10a" class="a_box"></div>
<div id="box10b" class="another_box"></div>
</div>
<div id="scroll_11" class="scroll_box">
<div id="box11a" class="a_box"></div>
<div id="box11b" class="another_box"></div>
</div>
<div id="scroll_12" class="scroll_box">
<div id="box12a" class="a_box"></div>
<div id="box12b" class="another_box"></div>
</div>
<div id="scroll_13" class="scroll_box">
<div id="box13a" class="a_box"></div>
<div id="box13b" class="another_box"></div>
</div>
<div id="scroll_14" class="scroll_box">
<div id="box14a" class="a_box"></div>
<div id="box14b" class="another_box"></div>
</div>
<script>
function doTest() {
if (document.location.search != '?ref') {
document.getElementById("box1b").scrollIntoView({block: "end"});
document.getElementById("box2b").scrollIntoView({block: "end"});
document.getElementById("box3b").scrollIntoView({block: "end"});
document.getElementById("box3b").scrollIntoView({block: "end", behavior: "instant"});
document.getElementById("box4b").scrollIntoView({block: "end", behavior: "instant"});
document.getElementById("box5b").scrollIntoView({block: "end", behavior: "instant"});
document.getElementById("box6b").scrollIntoView({block: "end", behavior: "instant"});
document.getElementById("box7b").scrollIntoView({block: "end", behavior: "instant"});
document.getElementById("box8b").scrollIntoView({block: "end", behavior: "auto"});
document.getElementById("box9b").scrollIntoView({block: "end", behavior: "auto"});
document.getElementById("box10b").scrollIntoView({block: "end", behavior: "auto"});
document.getElementById("box11b").scrollIntoView(false);
document.getElementById("box12b").scrollIntoView(false);
document.getElementById("box13b").scrollIntoView(false);
document.getElementById("box6b").scrollIntoView({block: "end", behavior: "auto"});
document.getElementById("box7b").scrollIntoView({block: "end", behavior: "auto"});
document.getElementById("box8b").scrollIntoView(false);
document.getElementById("box9b").scrollIntoView(false);
// Scroll_14 is a control, expected to scroll smoothly
document.getElementById("box14b").scrollIntoView({block: "end", behavior: "smooth"});
// Scroll_10 is a control, expected to scroll smoothly
document.getElementById("box10b").scrollIntoView({block: "end", behavior: "smooth"});
// Interrupt any smooth scrolling
for (var i=1; i <= 14; i++) {
for (var i=1; i <= 10; i++) {
document.getElementById("scroll_" + i).scrollLeft
= document.getElementById("scroll_" + i).scrollLeft;
document.getElementById("scroll_" + i).scrollTop
= document.getElementById("scroll_" + i).scrollTop;
}
} else {
// Scroll all boxes except box 14
for (var i=1; i <= 13; i++) {
// Scroll all boxes except box 10
for (var i=1; i <= 9; i++) {
document.getElementById("box" + i + "b").scrollIntoView({block: "end", behavior: "instant"});
}
}
document.documentElement.removeAttribute("class");
}
for (var i=1; i <= 14; i++) {
for (var i=1; i <= 10; i++) {
document.getElementById("box" + i + "a")
.scrollIntoView({block: "start", behavior: "instant"});
}

View File

@ -42,11 +42,7 @@
scroll-behavior: auto;
}
#scroll_1, #scroll_5, #scroll_8 {
scroll-behavior: instant;
}
#scroll_4 {
#scroll_3 {
scroll-behavior: smooth;
}
@ -65,37 +61,33 @@
<div id="box3a" class="a_box"></div>
<a name="test_anchor_3" id="box3b" class="another_box"></a>
</div>
<div id="scroll_4" class="scroll_box">
<div id="box4a" class="a_box"></div>
<a name="test_anchor_4" id="box4b" class="another_box"></a>
</div>
<script>
function doTest() {
if (document.location.search != '?ref') {
// Scroll_1 to Scroll_3 are expected to scroll instantly
// Scroll_1 to Scroll_2 are expected to scroll instantly
window.location.hash = "test_anchor_1";
window.location.hash = "test_anchor_2";
window.location.hash = "test_anchor_3";
// Scroll_4 is expected to scroll smoothly
document.getElementById("box4b").scrollIntoView({block: "end", behavior: "smooth"});
// Scroll_3 is expected to scroll smoothly
document.getElementById("box3b").scrollIntoView({block: "end", behavior: "smooth"});
// Interrupt any smooth scrolling
for (var i=1; i <= 4; i++) {
for (var i=1; i <= 3; i++) {
document.getElementById("scroll_" + i).scrollLeft
= document.getElementById("scroll_" + i).scrollLeft;
document.getElementById("scroll_" + i).scrollTop
= document.getElementById("scroll_" + i).scrollTop;
}
} else {
for (var i=1; i <= 3; i++) {
// Scroll all boxes except for Scroll_3
for (var i=1; i <= 2; i++) {
document.getElementById("box" + i + "b").scrollIntoView({block: "end", behavior: "instant"});
}
}
document.documentElement.removeAttribute("class");
}
for (var i=1; i <= 4; i++) {
for (var i=1; i <= 3; i++) {
document.getElementById("box" + i + "a")
.scrollIntoView({block: "start", behavior: "instant"});
}

View File

@ -37,15 +37,11 @@
overflow: scroll;
}
#scroll_2, #scroll_5 {
#scroll_2, #scroll_4 {
scroll-behavior: auto;
}
#scroll_3, #scroll_6 {
scroll-behavior: instant;
}
#scroll_7, #scroll_8 {
#scroll_5, #scroll_6 {
scroll-behavior: smooth;
}
@ -74,15 +70,7 @@
</div>
<div id="scroll_6" class="scroll_box">
<div id="box6a" class="a_box"></div>
<div id="box6b" class="another_box"></div>
</div>
<div id="scroll_7" class="scroll_box">
<div id="box7a" class="a_box"></div>
<div id="box7b" class="another_box"></div>
</div>
<div id="scroll_8" class="scroll_box">
<div id="box8a" class="a_box"></div>
<div id="box8b" class="another_box"></div>
<div id="box6b" class="another_box"></div>
</div>
<script>
function doTest() {
@ -90,29 +78,27 @@
// Expect instantaneous scroll:
document.getElementById("scroll_1").scrollTo({left: 0, top: 0});
document.getElementById("scroll_2").scrollTo({left: 0, top: 0});
document.getElementById("scroll_3").scrollTo({left: 0, top: 0});
document.getElementById("scroll_3").scrollTo(0, 0);
document.getElementById("scroll_4").scrollTo(0, 0);
document.getElementById("scroll_5").scrollTo(0, 0);
document.getElementById("scroll_6").scrollTo(0, 0);
// Expect smooth scroll:
document.getElementById("scroll_7").scrollTo({left: 0, top: 0});
document.getElementById("scroll_8").scrollTo(0, 0);
document.getElementById("scroll_5").scrollTo({left: 0, top: 0});
document.getElementById("scroll_6").scrollTo(0, 0);
// Interrupt any smooth scrolling
for (var i=1; i <= 8; i++) {
for (var i=1; i <= 6; i++) {
document.getElementById("scroll_" + i).scrollTo();
}
} else {
// Scroll all boxes except for box7a and box8a
for (var i=1; i <= 6; i++) {
// Scroll all boxes except for box5a and box6a
for (var i=1; i <= 4; i++) {
document.getElementById("box" + i + "a").scrollIntoView({block: "end", behavior: "instant"});
}
}
document.documentElement.removeAttribute("class");
}
for (var i=1; i <= 8; i++) {
for (var i=1; i <= 6; i++) {
document.getElementById("box" + i + "b")
.scrollIntoView({block: "start", behavior: "instant"});
}

View File

@ -310,7 +310,6 @@ CSS_KEY(inline-grid, inline_grid)
CSS_KEY(inline-table, inline_table)
CSS_KEY(inset, inset)
CSS_KEY(inside, inside)
CSS_KEY(instant, instant)
CSS_KEY(interpolatematrix, interpolatematrix)
CSS_KEY(isolate, isolate)
CSS_KEY(invert, invert)

View File

@ -1592,7 +1592,6 @@ const KTableValue nsCSSProps::kResizeKTable[] = {
const KTableValue nsCSSProps::kScrollBehaviorKTable[] = {
eCSSKeyword_auto, NS_STYLE_SCROLL_BEHAVIOR_AUTO,
eCSSKeyword_instant, NS_STYLE_SCROLL_BEHAVIOR_INSTANT,
eCSSKeyword_smooth, NS_STYLE_SCROLL_BEHAVIOR_SMOOTH,
eCSSKeyword_UNKNOWN,-1
};

View File

@ -1071,8 +1071,7 @@ static inline mozilla::css::Side operator++(mozilla::css::Side& side, int) {
// See nsStyleDisplay::mScrollBehavior
#define NS_STYLE_SCROLL_BEHAVIOR_AUTO 0
#define NS_STYLE_SCROLL_BEHAVIOR_INSTANT 1
#define NS_STYLE_SCROLL_BEHAVIOR_SMOOTH 2
#define NS_STYLE_SCROLL_BEHAVIOR_SMOOTH 1
/*****************************************************************************
* Constants for media features. *

View File

@ -5647,7 +5647,7 @@ if (SpecialPowers.getBoolPref("layout.css.scroll-behavior.property-enabled")) {
inherited: false,
type: CSS_TYPE_LONGHAND,
initial_values: [ "auto" ],
other_values: [ "instant", "smooth" ],
other_values: [ "smooth" ],
invalid_values: [ "none", "1px" ]
};
}