nagai/fune
3
0
Fork 0
forked from mirrors/gecko-dev
Code Pull requests Activity

Bug 1811575 - Make sure the swipe-to-navigation icon isn't rendered at zero progress gesture value. r=tnikkel

Browse source 
Differential Revision: https://phabricator.services.mozilla.com/D167513
This commit is contained in:
Hiroyuki Ikezoe 2023-01-23 21:06:36 +00:00
parent 81c0d1dfea
commit fb1dc455fa
2 changed files with 121 additions and 22 deletions
repo.diff.show_diff_stats Download patch file Download diff file Expand all files Collapse all files

57
browser/base/content/browser-gestureSupport.js
View file

@ -736,6 +736,19 @@ var gHistorySwipeAnimation = {
}
},
_willGoBack: function HSA_willGoBack(aVal) {
return (
((aVal > 0 && this.isLTR) || (aVal < 0 && !this.isLTR)) && this._canGoBack
);
},
_willGoForward: function HSA_willGoForward(aVal) {
return (
((aVal > 0 && !this.isLTR) || (aVal < 0 && this.isLTR)) &&
this._canGoForward
);
},
/**
* Updates the animation between two pages in history.
*
@ -765,28 +778,25 @@ var gHistorySwipeAnimation = {
// Compute the icon radius based on preferences.
const radius =
this.minRadius + progress * (this.maxRadius - this.minRadius);
if ((aVal >= 0 && this.isLTR) || (aVal <= 0 && !this.isLTR)) {
// The intention is to go back.
if (this._canGoBack) {
this._prevBox.collapsed = false;
this._nextBox.collapsed = true;
this._prevBox.style.translate = `${translate}px 0px`;
if (radius >= 0) {
this._prevBox
.querySelectorAll("circle")[1]
.setAttribute("r", `${radius}`);
}
if (Math.abs(aVal) >= 0.25) {
// If `aVal` goes above 0.25, it means history navigation will be
// triggered once after the user lifts their fingers, it's time to
// trigger __indicator__ animations by adding `will-navigate` class.
this._prevBox.querySelector("svg").classList.add("will-navigate");
} else {
this._prevBox.querySelector("svg").classList.remove("will-navigate");
}
if (this._willGoBack(aVal)) {
this._prevBox.collapsed = false;
this._nextBox.collapsed = true;
this._prevBox.style.translate = `${translate}px 0px`;
if (radius >= 0) {
this._prevBox
.querySelectorAll("circle")[1]
.setAttribute("r", `${radius}`);
}
} else if (this._canGoForward) {
if (Math.abs(aVal) >= 0.25) {
// If `aVal` goes above 0.25, it means history navigation will be
// triggered once after the user lifts their fingers, it's time to
// trigger __indicator__ animations by adding `will-navigate` class.
this._prevBox.querySelector("svg").classList.add("will-navigate");
} else {
this._prevBox.querySelector("svg").classList.remove("will-navigate");
}
} else if (this._willGoForward(aVal)) {
// The intention is to go forward.
this._nextBox.collapsed = false;
this._prevBox.collapsed = true;
@ -803,6 +813,11 @@ var gHistorySwipeAnimation = {
} else {
this._nextBox.querySelector("svg").classList.remove("will-navigate");
}
} else {
this._prevBox.collapsed = true;
this._nextBox.collapsed = true;
this._prevBox.style.translate = "none";
this._nextBox.style.translate = "none";
}
},

86
widget/tests/browser/browser_test_swipe_gesture.js
View file

@ -830,7 +830,7 @@ add_task(async () => {
await SpecialPowers.pushPrefEnv({
set: [
["browser.gesture.swipe.left", "Browser:BackOrBackDuplicate"],
["browser.gesture.swipe.eight", "Browser:ForwardOrForwardDuplicate"],
["browser.gesture.swipe.right", "Browser:ForwardOrForwardDuplicate"],
["widget.disable-swipe-tracker", false],
["widget.swipe.velocity-twitch-tolerance", 0.0000001],
["widget.swipe.success-velocity-contribution", 0.5],
@ -892,6 +892,90 @@ add_task(async () => {
await SpecialPowers.popPrefEnv();
});
add_task(async () => {
await SpecialPowers.pushPrefEnv({
set: [
["browser.gesture.swipe.left", "Browser:BackOrBackDuplicate"],
["browser.gesture.swipe.right", "Browser:ForwardOrForwardDuplicate"],
["widget.disable-swipe-tracker", false],
["widget.swipe.velocity-twitch-tolerance", 0.0000001],
["widget.swipe.success-velocity-contribution", 0.5],
],
});
// Load three pages and go to the second page so that it can be navigated
// to both back and forward.
const tab = await BrowserTestUtils.openNewForegroundTab(
gBrowser,
"about:about",
true /* waitForLoad */
);
BrowserTestUtils.loadURIString(tab.linkedBrowser, "about:mozilla");
await BrowserTestUtils.browserLoaded(
tab.linkedBrowser,
false /* includeSubFrames */,
"about:mozilla"
);
BrowserTestUtils.loadURIString(tab.linkedBrowser, "about:home");
await BrowserTestUtils.browserLoaded(
tab.linkedBrowser,
false /* includeSubFrames */,
"about:home"
);
gBrowser.goBack();
await BrowserTestUtils.browserLoaded(
tab.linkedBrowser,
false /* includeSubFrames */,
"about:mozilla"
);
// Make sure we can go back and go forward.
ok(gBrowser.webNavigation.canGoBack);
ok(gBrowser.webNavigation.canGoForward);
// Start a history back pan gesture but keep touching.
await panLeftToRightBegin(tab.linkedBrowser, 100, 100, 1);
ok(
!gHistorySwipeAnimation._prevBox.collapsed,
"The icon box for the previous navigation should NOT be collapsed"
);
ok(
gHistorySwipeAnimation._nextBox.collapsed,
"The icon box for the next navigation should be collapsed"
);
// Pan back to the opposite direction so that the gesture should be cancelled.
// eslint-disable-next-line no-undef
await NativePanHandler.promiseNativePanEvent(
tab.linkedBrowser,
100,
100,
// eslint-disable-next-line no-undef
NativePanHandler.delta,
0,
// eslint-disable-next-line no-undef
NativePanHandler.updatePhase
);
ok(
gHistorySwipeAnimation._prevBox.collapsed,
"The icon box for the previous navigation should be collapsed"
);
ok(
gHistorySwipeAnimation._nextBox.collapsed,
"The icon box for the next navigation should be collapsed"
);
await panLeftToRightEnd(tab.linkedBrowser, 100, 100, 0);
BrowserTestUtils.removeTab(tab);
await SpecialPowers.popPrefEnv();
});
// NOTE: This test listens wheel events so that it causes an overscroll issue
// (bug 1800022). To avoid the bug, we need to run this test case at the end
// of this file.