Bug 1219158 - update Hello FTU panel height, r=mikedeboer

This commit is contained in:
Chris Rafuse 2015-12-15 16:28:27 -08:00
parent 475519d1d9
commit 9ab51c8461
11 changed files with 107 additions and 53 deletions

View File

@ -1818,8 +1818,9 @@ this.UITour = {
this.getAvailableTargets(aMessageManager, aWindow, aCallbackID);
break;
case "loop":
const FTU_VERSION = 1;
this.sendPageCallback(aMessageManager, aCallbackID, {
gettingStartedSeen: Services.prefs.getBoolPref("loop.gettingStarted.seen"),
gettingStartedSeen: (Services.prefs.getIntPref("loop.gettingStarted.latestFTUVersion") >= FTU_VERSION),
});
break;
case "search":

View File

@ -15,6 +15,8 @@ const { LoopAPI } = Cu.import("chrome://loop/content/modules/MozLoopAPI.jsm", {}
const { LoopRooms } = Cu.import("chrome://loop/content/modules/LoopRooms.jsm", {});
const { MozLoopServiceInternal } = Cu.import("chrome://loop/content/modules/MozLoopService.jsm", {});
const FTU_VERSION = 1;
function test() {
UITourTest();
}
@ -31,7 +33,8 @@ function runOffline(fun) {
var tests = [
taskify(function* test_gettingStartedClicked_linkOpenedWithExpectedParams() {
Services.prefs.setBoolPref("loop.gettingStarted.seen", false);
// Set latestFTUVersion to lower number to show FTU panel.
Services.prefs.setIntPref("loop.gettingStarted.latestFTUVersion", 0);
Services.prefs.setCharPref("loop.gettingStarted.url", "http://example.com");
is(loopButton.open, false, "Menu should initially be closed");
loopButton.click();
@ -65,7 +68,8 @@ var tests = [
checkLoopPanelIsHidden();
}),
taskify(function* test_gettingStartedClicked_linkOpenedWithExpectedParams2() {
Services.prefs.setBoolPref("loop.gettingStarted.seen", false);
// Set latestFTUVersion to lower number to show FTU panel.
Services.prefs.setIntPref("loop.gettingStarted.latestFTUVersion", 0);
// Force a refresh of the loop panel since going from seen -> unseen doesn't trigger
// automatic re-rendering.
let loopWin = document.getElementById("loop-notification-panel").children[0].contentWindow;
@ -110,7 +114,8 @@ var tests = [
}),
taskify(function* test_menu_show_hide() {
// The targets to highlight only appear after getting started is launched.
Services.prefs.setBoolPref("loop.gettingStarted.seen", true);
// Set latestFTUVersion to lower number to show FTU panel.
Services.prefs.setIntPref("loop.gettingStarted.latestFTUVersion", 0);
is(loopButton.open, false, "Menu should initially be closed");
gContentAPI.showMenu("loop");
@ -154,7 +159,7 @@ var tests = [
});
},
function test_getConfigurationLoop(done) {
let gettingStartedSeen = Services.prefs.getBoolPref("loop.gettingStarted.seen");
let gettingStartedSeen = Services.prefs.getIntPref("loop.gettingStarted.latestFTUVersion") >= FTU_VERSION;
gContentAPI.getConfiguration("loop", (data) => {
is(data.gettingStartedSeen, gettingStartedSeen,
"The configuration property should equal that of the pref");
@ -407,7 +412,7 @@ if (Services.prefs.getBoolPref("loop.enabled")) {
registerCleanupFunction(() => {
Services.prefs.clearUserPref("loop.gettingStarted.resumeOnFirstJoin");
Services.prefs.clearUserPref("loop.gettingStarted.seen");
Services.prefs.clearUserPref("loop.gettingStarted.latestFTUVersion");
Services.prefs.clearUserPref("loop.gettingStarted.url");
Services.io.offline = false;

View File

@ -130,6 +130,7 @@ var gOriginalPageListeners = null;
var gSocialProviders = null;
var gStringBundle = null;
var gStubbedMessageHandlers = null;
var gOriginalPanelHeight = null;
const kBatchMessage = "Batch";
const kMaxLoopCount = 10;
const kMessageName = "Loop:Message";
@ -902,6 +903,29 @@ const kMessageHandlers = {
reply();
},
/**
* Set panel height
*
* @param {Object} message Message meant for the handler function, containing
* the following parameters in its `data` property:
* [
* {Number} height The pixel height value.
* ]
* @param {Function} reply Callback function, invoked with the result of this
* message handler. The result will be sent back to
* the senders' channel.
*/
SetPanelHeight: function(message, reply) {
let [height] = message.data;
let win = Services.wm.getMostRecentWindow("navigator:browser");
let node = win.LoopUI.browser;
if (!gOriginalPanelHeight) {
gOriginalPanelHeight = parseInt(win.getComputedStyle(node, null).height, 10);
}
node.style.height = (height || gOriginalPanelHeight) + "px";
reply();
},
/**
* Used to record the screen sharing state for a window so that it can
* be reflected on the toolbar button.

View File

@ -13,18 +13,27 @@ loop.panel = (function(_, mozL10n) {
var Button = sharedViews.Button;
var Checkbox = sharedViews.Checkbox;
var FTU_VERSION = 1;
var GettingStartedView = React.createClass({displayName: "GettingStartedView",
mixins: [sharedMixins.WindowCloseMixin],
handleButtonClick: function() {
loop.requestMulti(
["OpenGettingStartedTour", "getting-started"],
["SetLoopPref", "gettingStarted.seen", true]);
var event = new CustomEvent("GettingStartedSeen", { detail: true });
window.dispatchEvent(event);
["SetLoopPref", "gettingStarted.latestFTUVersion", FTU_VERSION],
["SetPanelHeight"]).then(function() {
var event = new CustomEvent("GettingStartedSeen");
window.dispatchEvent(event);
}.bind(this));
this.closeWindow();
},
componentWillMount: function() {
// Set 553 pixel height to show the full FTU panel content.
loop.request("SetPanelHeight", 553);
},
render: function() {
return (
React.createElement("div", {className: "fte-get-started-content"},
@ -912,7 +921,7 @@ loop.panel = (function(_, mozL10n) {
fxAEnabled: loop.getStoredRequest(["GetFxAEnabled"]),
hasEncryptionKey: loop.getStoredRequest(["GetHasEncryptionKey"]),
userProfile: loop.getStoredRequest(["GetUserProfile"]),
gettingStartedSeen: loop.getStoredRequest(["GetLoopPref", "gettingStarted.seen"]),
gettingStartedSeen: loop.getStoredRequest(["GetLoopPref", "gettingStarted.latestFTUVersion"]) >= FTU_VERSION,
multiProcessEnabled: loop.getStoredRequest(["IsMultiProcessEnabled"])
};
},
@ -970,8 +979,12 @@ loop.panel = (function(_, mozL10n) {
}.bind(this));
},
_gettingStartedSeen: function(e) {
this.setState({ gettingStartedSeen: !!e.detail });
_gettingStartedSeen: function() {
loop.request("GetLoopPref", "gettingStarted.latestFTUVersion").then(function(result) {
this.setState({
gettingStartedSeen: result >= FTU_VERSION
});
}.bind(this));
},
componentWillMount: function() {
@ -1019,7 +1032,6 @@ loop.panel = (function(_, mozL10n) {
)
);
}
if (!this.state.hasEncryptionKey) {
return React.createElement(SignInRequestView, null);
}
@ -1058,7 +1070,7 @@ loop.panel = (function(_, mozL10n) {
["GetPluralRule"]
];
var prefetch = [
["GetLoopPref", "gettingStarted.seen"],
["GetLoopPref", "gettingStarted.latestFTUVersion"],
["GetLoopPref", "legal.ToS_url"],
["GetLoopPref", "legal.privacy_url"],
["GetUserProfile"],

View File

@ -13,18 +13,27 @@ loop.panel = (function(_, mozL10n) {
var Button = sharedViews.Button;
var Checkbox = sharedViews.Checkbox;
var FTU_VERSION = 1;
var GettingStartedView = React.createClass({
mixins: [sharedMixins.WindowCloseMixin],
handleButtonClick: function() {
loop.requestMulti(
["OpenGettingStartedTour", "getting-started"],
["SetLoopPref", "gettingStarted.seen", true]);
var event = new CustomEvent("GettingStartedSeen", { detail: true });
window.dispatchEvent(event);
["SetLoopPref", "gettingStarted.latestFTUVersion", FTU_VERSION],
["SetPanelHeight"]).then(function() {
var event = new CustomEvent("GettingStartedSeen");
window.dispatchEvent(event);
}.bind(this));
this.closeWindow();
},
componentWillMount: function() {
// Set 553 pixel height to show the full FTU panel content.
loop.request("SetPanelHeight", 553);
},
render: function() {
return (
<div className="fte-get-started-content">
@ -912,7 +921,7 @@ loop.panel = (function(_, mozL10n) {
fxAEnabled: loop.getStoredRequest(["GetFxAEnabled"]),
hasEncryptionKey: loop.getStoredRequest(["GetHasEncryptionKey"]),
userProfile: loop.getStoredRequest(["GetUserProfile"]),
gettingStartedSeen: loop.getStoredRequest(["GetLoopPref", "gettingStarted.seen"]),
gettingStartedSeen: loop.getStoredRequest(["GetLoopPref", "gettingStarted.latestFTUVersion"]) >= FTU_VERSION,
multiProcessEnabled: loop.getStoredRequest(["IsMultiProcessEnabled"])
};
},
@ -970,8 +979,12 @@ loop.panel = (function(_, mozL10n) {
}.bind(this));
},
_gettingStartedSeen: function(e) {
this.setState({ gettingStartedSeen: !!e.detail });
_gettingStartedSeen: function() {
loop.request("GetLoopPref", "gettingStarted.latestFTUVersion").then(function(result) {
this.setState({
gettingStartedSeen: result >= FTU_VERSION
});
}.bind(this));
},
componentWillMount: function() {
@ -1019,7 +1032,6 @@ loop.panel = (function(_, mozL10n) {
</div>
);
}
if (!this.state.hasEncryptionKey) {
return <SignInRequestView />;
}
@ -1058,7 +1070,7 @@ loop.panel = (function(_, mozL10n) {
["GetPluralRule"]
];
var prefetch = [
["GetLoopPref", "gettingStarted.seen"],
["GetLoopPref", "gettingStarted.latestFTUVersion"],
["GetLoopPref", "legal.ToS_url"],
["GetLoopPref", "legal.privacy_url"],
["GetUserProfile"],

View File

@ -2,7 +2,7 @@ pref("loop.enabled", true);
pref("loop.textChat.enabled", true);
pref("loop.server", "https://loop.services.mozilla.com/v0");
pref("loop.linkClicker.url", "https://hello.firefox.com/");
pref("loop.gettingStarted.seen", false);
pref("loop.gettingStarted.latestFTUVersion", 0);
pref("loop.gettingStarted.url", "https://www.mozilla.org/%LOCALE%/firefox/%VERSION%/hello/start/");
pref("loop.gettingStarted.resumeOnFirstJoin", false);
pref("loop.learnMoreUrl", "https://www.firefox.com/hello/");

View File

@ -56,12 +56,9 @@ describe("loop.panel", function() {
GetPluralRule: sinon.stub(),
SetLoopPref: sinon.stub(),
GetLoopPref: function(prefName) {
if (prefName === "gettingStarted.seen") {
return "unseen";
}
return false;
return 1;
},
SetPanelHeight: function() { return null; },
GetPluralForm: function() {
return "fakeText";
},
@ -86,7 +83,7 @@ describe("loop.panel", function() {
GetHasEncryptionKey: true,
GetUserProfile: null,
GetDoNotDisturb: false,
"GetLoopPref|gettingStarted.seen": "unseen",
"GetLoopPref|gettingStarted.latestFTUVersion": 1,
"GetLoopPref|legal.ToS_url": "",
"GetLoopPref|legal.privacy_url": "",
IsMultiProcessEnabled: false
@ -468,7 +465,7 @@ describe("loop.panel", function() {
return supportUrl;
}
return "unseen";
return 1;
}
});
});
@ -509,7 +506,7 @@ describe("loop.panel", function() {
return feedbackUrl;
}
return "unseen";
return 1;
}
});
});
@ -535,10 +532,8 @@ describe("loop.panel", function() {
});
describe("#render", function() {
it("should not render a ToSView when gettingStarted.seen is true", function() {
LoopMochaUtils.stubLoopRequest({
GetLoopPref: function() { return true; }
});
it("should not render a ToSView when gettingStarted.latestFTUVersion is equal to or greater than FTU_VERSION", function() {
loop.storedRequests["GetLoopPref|gettingStarted.latestFTUVersion"] = 2;
var view = createTestPanelView();
expect(function() {
@ -546,8 +541,8 @@ describe("loop.panel", function() {
}).to.Throw(/not find/);
});
it("should not render a ToSView when gettingStarted.seen is false", function() {
loop.storedRequests["GetLoopPref|gettingStarted.seen"] = false;
it("should render a ToSView when gettingStarted.latestFTUVersion is less than FTU_VERSION", function() {
loop.storedRequests["GetLoopPref|gettingStarted.latestFTUVersion"] = 0;
var view = createTestPanelView();
expect(function() {
@ -555,15 +550,16 @@ describe("loop.panel", function() {
}).to.not.Throw();
});
it("should render a GettingStarted view", function() {
loop.storedRequests["GetLoopPref|gettingStarted.seen"] = false;
var view = createTestPanelView();
TestUtils.findRenderedComponentWithType(view, loop.panel.GettingStartedView);
it("should render a GettingStarted view when gettingStarted.latestFTUVersion is less than FTU_VERSION", function() {
loop.storedRequests["GetLoopPref|gettingStarted.latestFTUVersion"] = 0;
var view = createTestPanelView();
expect(function() {
TestUtils.findRenderedComponentWithType(view, loop.panel.GettingStartedView);
}).to.not.Throw();
});
it("should not render a GettingStartedView when the view has been seen", function() {
loop.storedRequests["GetLoopPref|gettingStarted.seen"] = true;
var view = createTestPanelView();
try {
@ -579,10 +575,12 @@ describe("loop.panel", function() {
var view = createTestPanelView();
TestUtils.findRenderedComponentWithType(view, loop.panel.SignInRequestView);
expect(function() {
TestUtils.findRenderedComponentWithType(view, loop.panel.SignInRequestView);
}).to.not.Throw();
});
it("should render a SignInRequestView when mozLoop.hasEncryptionKey is true", function() {
it("should not render a SignInRequestView when mozLoop.hasEncryptionKey is true", function() {
var view = createTestPanelView();
try {
@ -598,7 +596,9 @@ describe("loop.panel", function() {
var view = createTestPanelView();
TestUtils.findRenderedComponentWithType(view, loop.panel.E10sNotSupported);
expect(function() {
TestUtils.findRenderedComponentWithType(view, loop.panel.E10sNotSupported);
}).to.not.Throw();
});
});

View File

@ -14,7 +14,7 @@ FIREFOX_PREFERENCES = {
"devtools.debugger.prompt-connection": False,
"devtools.debugger.remote-enabled": True,
"media.volume_scale": "0",
"loop.gettingStarted.seen": True,
"loop.gettingStarted.latestFTUVersion": 0,
# this dialog is fragile, and likely to introduce intermittent failures
"media.navigator.permission.disabled": True,

View File

@ -42,7 +42,7 @@ function* checkFxA401() {
}
add_task(function* setup() {
Services.prefs.setBoolPref("loop.gettingStarted.seen", true);
Services.prefs.setIntPref("loop.gettingStarted.latestFTUVersion", 1);
MozLoopServiceInternal.mocks.pushHandler = mockPushHandler;
// Normally the same pushUrl would be registered but we change it in the test
// to be able to check for success on the second registration.
@ -55,7 +55,7 @@ add_task(function* setup() {
registerCleanupFunction(function* () {
info("cleanup time");
yield promiseDeletedOAuthParams(BASE_URL);
Services.prefs.clearUserPref("loop.gettingStarted.seen");
Services.prefs.clearUserPref("loop.gettingStarted.latestFTUVersion");
MozLoopServiceInternal.mocks.pushHandler = undefined;
yield resetFxA();

View File

@ -9,7 +9,7 @@
Components.utils.import("resource://gre/modules/Promise.jsm", this);
const { LoopRoomsInternal } = Components.utils.import("chrome://loop/content/modules/LoopRooms.jsm", {});
Services.prefs.setBoolPref("loop.gettingStarted.seen", true);
Services.prefs.setIntPref("loop.gettingStarted.latestFTUVersion", 1);
const fxASampleToken = {
token_type: "bearer",
@ -26,7 +26,7 @@ registerCleanupFunction(function*() {
MozLoopService.doNotDisturb = false;
MozLoopServiceInternal.fxAOAuthProfile = null;
yield MozLoopServiceInternal.clearError("testing");
Services.prefs.clearUserPref("loop.gettingStarted.seen");
Services.prefs.clearUserPref("loop.gettingStarted.latestFTUVersion");
});
add_task(function* test_LoopUI_getters() {

View File

@ -155,9 +155,9 @@ var fakeRooms = [
GetErrors: function() {},
GetLoopPref: function(pref) {
switch (pref) {
// Ensure we skip FTE completely.
case "gettingStarted.seen":
return true;
// Ensure we skip FTE completely if FTU_VERSION = 1.
case "gettingStarted.latestFTUVersion":
return 1;
}
return null;
},