mirror of
https://github.com/mozilla/gecko-dev.git
synced 2024-11-28 07:13:20 +00:00
Bug 1422106 - Show broken heart when unverified in synced tabs sidebar/panel. r=markh
MozReview-Commit-ID: BDTdmcIOHmn --HG-- extra : rebase_source : b1471e1ef0163b2d3b137852d285146f5a23f1fa
This commit is contained in:
parent
31c313504e
commit
2a41681065
@ -477,12 +477,17 @@
|
||||
key="key_openAddons"
|
||||
command="Tools:Addons"/>
|
||||
|
||||
<!-- only one of sync-setup, sync-syncnowitem or sync-reauthitem will be showing at once -->
|
||||
<!-- only one of sync-setup, sync-unverifieditem, sync-syncnowitem or sync-reauthitem will be showing at once -->
|
||||
<menuitem id="sync-setup"
|
||||
label="&syncSignIn.label;"
|
||||
accesskey="&syncSignIn.accesskey;"
|
||||
observes="sync-setup-state"
|
||||
oncommand="gSync.openPrefs('menubar')"/>
|
||||
<menuitem id="sync-unverifieditem"
|
||||
label="&syncSignIn.label;"
|
||||
accesskey="&syncSignIn.accesskey;"
|
||||
observes="sync-unverified-state"
|
||||
oncommand="gSync.openPrefs('menubar')"/>
|
||||
<menuitem id="sync-syncnowitem"
|
||||
label="&syncSyncNowItem.label;"
|
||||
accesskey="&syncSyncNowItem.accesskey;"
|
||||
|
@ -166,6 +166,7 @@
|
||||
<!-- broadcasters of the "hidden" attribute to reflect setup state for
|
||||
menus -->
|
||||
<broadcaster id="sync-setup-state"/>
|
||||
<broadcaster id="sync-unverified-state" hidden="true"/>
|
||||
<broadcaster id="sync-syncnow-state" hidden="true"/>
|
||||
<broadcaster id="sync-reauth-state" hidden="true"/>
|
||||
<broadcaster id="viewTabsSidebar" autoCheck="false" sidebartitle="&syncedTabs.sidebar.label;"
|
||||
|
@ -218,13 +218,15 @@ var gSync = {
|
||||
document.getElementById("sync-reauth-state").hidden = true;
|
||||
document.getElementById("sync-setup-state").hidden = true;
|
||||
document.getElementById("sync-syncnow-state").hidden = true;
|
||||
document.getElementById("sync-unverified-state").hidden = true;
|
||||
|
||||
if (status == UIState.STATUS_LOGIN_FAILED) {
|
||||
// unhiding this element makes the menubar show the login failure state.
|
||||
document.getElementById("sync-reauth-state").hidden = false;
|
||||
} else if (status == UIState.STATUS_NOT_CONFIGURED ||
|
||||
status == UIState.STATUS_NOT_VERIFIED) {
|
||||
} else if (status == UIState.STATUS_NOT_CONFIGURED) {
|
||||
document.getElementById("sync-setup-state").hidden = false;
|
||||
} else if (status == UIState.STATUS_NOT_VERIFIED) {
|
||||
document.getElementById("sync-unverified-state").hidden = false;
|
||||
} else {
|
||||
document.getElementById("sync-syncnow-state").hidden = false;
|
||||
}
|
||||
|
@ -108,8 +108,8 @@ add_task(async function test_ui_state_unverified() {
|
||||
syncing: false,
|
||||
syncNowTooltip: tooltipText
|
||||
});
|
||||
checkRemoteTabsPanel("PanelUI-remotetabs-setupsync", false);
|
||||
checkMenuBarItem("sync-setup");
|
||||
checkRemoteTabsPanel("PanelUI-remotetabs-unverified", false);
|
||||
checkMenuBarItem("sync-unverifieditem");
|
||||
});
|
||||
|
||||
add_task(async function test_ui_state_loginFailed() {
|
||||
@ -176,7 +176,8 @@ function checkPanelUIStatusBar({label, tooltip, fxastatus, avatarURL, syncing, s
|
||||
function checkRemoteTabsPanel(expectedShownItemId, syncing, syncNowTooltip) {
|
||||
checkItemsVisiblities(["PanelUI-remotetabs-main",
|
||||
"PanelUI-remotetabs-setupsync",
|
||||
"PanelUI-remotetabs-reauthsync"],
|
||||
"PanelUI-remotetabs-reauthsync",
|
||||
"PanelUI-remotetabs-unverified"],
|
||||
expectedShownItemId);
|
||||
|
||||
if (syncing != undefined && syncNowTooltip != undefined) {
|
||||
@ -185,7 +186,7 @@ function checkRemoteTabsPanel(expectedShownItemId, syncing, syncNowTooltip) {
|
||||
}
|
||||
|
||||
function checkMenuBarItem(expectedShownItemId) {
|
||||
checkItemsVisiblities(["sync-setup", "sync-syncnowitem", "sync-reauthitem"],
|
||||
checkItemsVisiblities(["sync-setup", "sync-syncnowitem", "sync-reauthitem", "sync-unverifieditem"],
|
||||
expectedShownItemId);
|
||||
}
|
||||
|
||||
|
@ -491,6 +491,17 @@
|
||||
label="&appMenuRemoteTabs.signin.label;"
|
||||
oncommand="gSync.openPrefs('synced-tabs');"/>
|
||||
</vbox>
|
||||
<vbox id="PanelUI-remotetabs-unverified"
|
||||
flex="1"
|
||||
align="center"
|
||||
class="PanelUI-remotetabs-instruction-box"
|
||||
observes="sync-unverified-state">
|
||||
<image class="fxaSyncIllustrationIssue"/>
|
||||
<label class="PanelUI-remotetabs-instruction-label">&appMenuRemoteTabs.unverified.label;</label>
|
||||
<toolbarbutton class="PanelUI-remotetabs-prefs-button"
|
||||
label="&appMenuRemoteTabs.signin.label;"
|
||||
oncommand="gSync.openPrefs('synced-tabs');"/>
|
||||
</vbox>
|
||||
</hbox>
|
||||
</vbox>
|
||||
</panelview>
|
||||
|
@ -139,6 +139,13 @@ add_task(async function() {
|
||||
});
|
||||
add_task(asyncCleanup);
|
||||
|
||||
// When Sync is configured in an unverified state.
|
||||
add_task(async function() {
|
||||
gSync.updateAllUI({ status: UIState.STATUS_NOT_VERIFIED, email: "foo@bar.com" });
|
||||
await openPrefsFromMenuPanel("PanelUI-remotetabs-unverified", "synced-tabs");
|
||||
});
|
||||
add_task(asyncCleanup);
|
||||
|
||||
// When Sync is configured in a "needs reauthentication" state.
|
||||
add_task(async function() {
|
||||
gSync.updateAllUI({ status: UIState.STATUS_LOGIN_FAILED, email: "foo@bar.com" });
|
||||
|
@ -63,6 +63,7 @@ SyncedTabsDeckComponent.prototype = {
|
||||
NOT_AUTHED_INFO: "notAuthedInfo",
|
||||
SINGLE_DEVICE_INFO: "singleDeviceInfo",
|
||||
TABS_DISABLED: "tabs-disabled",
|
||||
UNVERIFIED: "unverified"
|
||||
},
|
||||
|
||||
get container() {
|
||||
@ -121,9 +122,12 @@ SyncedTabsDeckComponent.prototype = {
|
||||
|
||||
getPanelStatus() {
|
||||
return this._getSignedInUser().then(user => {
|
||||
if (!user || !user.verified || this._SyncedTabs.loginFailed) {
|
||||
if (!user || this._SyncedTabs.loginFailed) {
|
||||
return this.PANELS.NOT_AUTHED_INFO;
|
||||
}
|
||||
if (!user.verified) {
|
||||
return this.PANELS.UNVERIFIED;
|
||||
}
|
||||
if (!this._SyncedTabs.isConfiguredToSyncTabs) {
|
||||
return this.PANELS.TABS_DISABLED;
|
||||
}
|
||||
|
@ -80,6 +80,11 @@
|
||||
<p class="instructions">&syncedTabs.sidebar.notsignedin.label;</p>
|
||||
<button class="button sync-prefs">&fxaSignIn.label;</button>
|
||||
</div>
|
||||
<div class="unverified sync-state">
|
||||
<div class="syncIllustration"></div>
|
||||
<p class="instructions">&syncedTabs.sidebar.unverified.label;</p>
|
||||
<button class="button sync-prefs">&syncedTabs.sidebar.openprefs.label;</button>
|
||||
</div>
|
||||
<div class="singleDeviceInfo sync-state">
|
||||
<div class="syncIllustrationIssue"></div>
|
||||
<p class="instructions">&syncedTabs.sidebar.noclients.subtitle;</p>
|
||||
|
@ -228,6 +228,12 @@ add_task(async function testSyncedTabsSidebarStatus() {
|
||||
Assert.ok(selectedPanel.classList.contains("notAuthedInfo"),
|
||||
"not-authed panel is selected");
|
||||
|
||||
account = {verified: false};
|
||||
await syncedTabsDeckComponent.updatePanel();
|
||||
selectedPanel = syncedTabsDeckComponent.container.querySelector(".sync-state.selected");
|
||||
Assert.ok(selectedPanel.classList.contains("unverified"),
|
||||
"unverified panel is selected");
|
||||
|
||||
account = {verified: true};
|
||||
await syncedTabsDeckComponent.updatePanel();
|
||||
selectedPanel = syncedTabsDeckComponent.container.querySelector(".sync-state.selected");
|
||||
|
@ -381,6 +381,7 @@ These should match what Safari and other Apple applications use on OS X Lion. --
|
||||
<!ENTITY appMenuRemoteTabs.noclients.subtitle "Want to see your tabs from other devices here?">
|
||||
<!ENTITY appMenuRemoteTabs.openprefs.label "Sync Preferences">
|
||||
<!ENTITY appMenuRemoteTabs.notsignedin.label "Sign in to view a list of tabs from your other devices.">
|
||||
<!ENTITY appMenuRemoteTabs.unverified.label "Your account needs to be verified.">
|
||||
<!ENTITY appMenuRemoteTabs.signin.label "Sign in to Sync">
|
||||
<!ENTITY appMenuRemoteTabs.managedevices.label "Manage Devices…">
|
||||
<!ENTITY appMenuRemoteTabs.sidebar.label "View Synced Tabs Sidebar">
|
||||
@ -794,6 +795,7 @@ you can use these alternative items. Otherwise, their values should be empty. -
|
||||
<!ENTITY syncedTabs.sidebar.noclients.label "Sign in to Firefox from your other devices to view their tabs here.">
|
||||
<!ENTITY syncedTabs.sidebar.noclients.subtitle "Want to see your tabs from other devices here?">
|
||||
<!ENTITY syncedTabs.sidebar.notsignedin.label "Sign in to view a list of tabs from your other devices.">
|
||||
<!ENTITY syncedTabs.sidebar.unverified.label "Your account needs to be verified.">
|
||||
<!ENTITY syncedTabs.sidebar.notabs.label "No open tabs">
|
||||
<!ENTITY syncedTabs.sidebar.openprefs.label "Open &syncBrand.shortName.label; Preferences">
|
||||
<!-- LOCALIZATION NOTE (syncedTabs.sidebar.tabsnotsyncing.label): This is shown
|
||||
|
@ -36,6 +36,7 @@ function mockSyncedTabs() {
|
||||
// configure our broadcasters so we are in the right state.
|
||||
document.getElementById("sync-reauth-state").hidden = true;
|
||||
document.getElementById("sync-setup-state").hidden = true;
|
||||
document.getElementById("sync-unverified-state").hidden = true;
|
||||
document.getElementById("sync-syncnow-state").hidden = false;
|
||||
|
||||
registerCleanupFunction(() => {
|
||||
@ -43,6 +44,7 @@ function mockSyncedTabs() {
|
||||
|
||||
document.getElementById("sync-reauth-state").hidden = true;
|
||||
document.getElementById("sync-setup-state").hidden = false;
|
||||
document.getElementById("sync-unverified-state").hidden = true;
|
||||
document.getElementById("sync-syncnow-state").hidden = true;
|
||||
});
|
||||
}
|
||||
|
@ -718,6 +718,7 @@ toolbarbutton[constrain-size="true"][cui-areatype="menu-panel"] > .toolbarbutton
|
||||
*/
|
||||
#PanelUI-remotetabs[mainview] #PanelUI-remotetabs-setupsync,
|
||||
#PanelUI-remotetabs[mainview] #PanelUI-remotetabs-reauthsync,
|
||||
#PanelUI-remotetabs[mainview] #PanelUI-remotetabs-unverified,
|
||||
#PanelUI-remotetabs[mainview] #PanelUI-remotetabs-nodevicespane,
|
||||
#PanelUI-remotetabs[mainview] #PanelUI-remotetabs-tabsdisabledpane {
|
||||
min-height: calc(var(--panel-ui-sync-illustration-height) +
|
||||
|
Loading…
Reference in New Issue
Block a user