diff --git a/src/routes/_components/NavItem.html b/src/routes/_components/NavItem.html
index 14643a74..0e574552 100644
--- a/src/routes/_components/NavItem.html
+++ b/src/routes/_components/NavItem.html
@@ -114,6 +114,7 @@
import { mark, stop } from '../_utils/marks'
import { doubleRAF } from '../_utils/doubleRAF'
import { scrollToTop } from '../_utils/scrollToTop'
+ import { normalizePageName } from '../_utils/normalizePageName'
export default {
oncreate () {
@@ -134,11 +135,7 @@
},
store: () => store,
computed: {
- selected: ({ page, name }) => {
- return page === name ||
- // special case – these should both highlight the notifications tab icon
- (name === 'notifications' && page === 'notifications/mentions')
- },
+ selected: ({ page, name }) => name === normalizePageName(page),
ariaLabel: ({ selected, name, label, $numberOfNotifications, $numberOfFollowRequests }) => {
let res = label
if (selected) {
diff --git a/src/routes/_components/NavShortcuts.html b/src/routes/_components/NavShortcuts.html
index 730071f3..5087d59a 100644
--- a/src/routes/_components/NavShortcuts.html
+++ b/src/routes/_components/NavShortcuts.html
@@ -22,6 +22,7 @@
import { importShowShortcutHelpDialog } from './dialog/asyncDialogs/importShowShortcutHelpDialog'
import { importShowComposeDialog } from './dialog/asyncDialogs/importShowComposeDialog'
import { store } from '../_store/store'
+ import { normalizePageName } from '../_utils/normalizePageName'
export default {
store: () => store,
@@ -43,9 +44,7 @@
},
goLeftOrRight (left) {
let { currentPage, navPages } = this.store.get()
- if (currentPage === 'notifications/mentions') { // special case
- currentPage = 'notifications'
- }
+ currentPage = normalizePageName(currentPage)
const idx = navPages.findIndex(_ => _.name === currentPage)
if (idx === -1) {
return
diff --git a/src/routes/_store/observers/navObservers.js b/src/routes/_store/observers/navObservers.js
index a57f4387..0a835df2 100644
--- a/src/routes/_store/observers/navObservers.js
+++ b/src/routes/_store/observers/navObservers.js
@@ -1,4 +1,5 @@
import { emit } from '../../_utils/eventBus'
+import { normalizePageName } from '../../_utils/normalizePageName'
export function navObservers (store) {
function pageIsInNav (store, page) {
@@ -6,11 +7,6 @@ export function navObservers (store) {
return navPages.find(_ => _.name === page)
}
- function normalizePageName (page) {
- // notifications/mentions are a special case; they show as selected in the nav
- return page === 'notifications/mentions' ? 'notifications' : page
- }
-
store.observe('currentPage', (currentPage, previousPage) => {
currentPage = normalizePageName(currentPage)
previousPage = normalizePageName(previousPage)
diff --git a/src/routes/_utils/normalizePageName.js b/src/routes/_utils/normalizePageName.js
new file mode 100644
index 00000000..e96e644f
--- /dev/null
+++ b/src/routes/_utils/normalizePageName.js
@@ -0,0 +1,7 @@
+// return the page name for purposes of figuring out which part of the nav
+// is highlighted/selected
+export function normalizePageName (page) {
+ // notifications/mentions and settings/foo are a special case; they show as selected in the nav
+ return page === 'notifications/mentions' ? 'notifications'
+ : (page && page.startsWith('settings/')) ? 'settings' : page
+}
diff --git a/tests/spec/024-shortcuts-navigation.js b/tests/spec/024-shortcuts-navigation.js
index f6a293e8..149ad2f6 100644
--- a/tests/spec/024-shortcuts-navigation.js
+++ b/tests/spec/024-shortcuts-navigation.js
@@ -188,3 +188,18 @@ test('Shortcuts can be disabled', async t => {
await t
.expect(modalDialog.exists).false
})
+
+test('Shortcut left/right works on settings page', async t => {
+ await loginAsFoobar(t)
+ await t
+ .click(settingsNavButton)
+ .click($('a[href="/settings/hotkeys"]'))
+ .expect(getUrl()).contains('/settings/hotkeys')
+ .expect(settingsNavButton.getAttribute('aria-current')).eql('true')
+ .pressKey('left')
+ .expect(settingsNavButton.getAttribute('aria-current')).notEql('true')
+ .expect(getUrl()).contains('/search')
+ .pressKey('right')
+ .expect(getUrl()).match(/\/settings$/)
+ .expect(settingsNavButton.getAttribute('aria-current')).eql('true')
+})