From c071ac117444122ce7a49b173ffe59114563d6d9 Mon Sep 17 00:00:00 2001 From: Nolan Lawson Date: Sat, 30 Nov 2019 17:43:31 -0800 Subject: [PATCH] refactor: refactor focus management (#1662) --- src/routes/_components/FocusRestoration.html | 99 ++++++++++++++ src/routes/_components/list/listStore.js | 3 +- src/routes/_components/timeline/Timeline.html | 122 ++++-------------- src/routes/_static/pages.js | 1 + tests/spec/010-focus.js | 18 +++ 5 files changed, 148 insertions(+), 95 deletions(-) create mode 100644 src/routes/_components/FocusRestoration.html create mode 100644 src/routes/_static/pages.js diff --git a/src/routes/_components/FocusRestoration.html b/src/routes/_components/FocusRestoration.html new file mode 100644 index 00000000..05420a21 --- /dev/null +++ b/src/routes/_components/FocusRestoration.html @@ -0,0 +1,99 @@ +
+ +
+ diff --git a/src/routes/_components/list/listStore.js b/src/routes/_components/list/listStore.js index 0668c8de..92ae5701 100644 --- a/src/routes/_components/list/listStore.js +++ b/src/routes/_components/list/listStore.js @@ -1,8 +1,9 @@ import { RealmStore } from '../../_utils/RealmStore' +import { PAGE_HISTORY_SIZE } from '../../_static/pages' class ListStore extends RealmStore { constructor (state) { - super(state, /* maxSize */ 10) + super(state, /* maxSize */ PAGE_HISTORY_SIZE) } } diff --git a/src/routes/_components/timeline/Timeline.html b/src/routes/_components/timeline/Timeline.html index e5ee25b8..417b93e9 100644 --- a/src/routes/_components/timeline/Timeline.html +++ b/src/routes/_components/timeline/Timeline.html @@ -1,29 +1,27 @@

{label}

-
- {#if components} - - {/if} -
+ +
+ {#if components} + + {/if} +
+
diff --git a/src/routes/_static/pages.js b/src/routes/_static/pages.js new file mode 100644 index 00000000..39f20eb9 --- /dev/null +++ b/src/routes/_static/pages.js @@ -0,0 +1 @@ +export const PAGE_HISTORY_SIZE = 10 diff --git a/tests/spec/010-focus.js b/tests/spec/010-focus.js index 1ef042c6..4b3b3436 100644 --- a/tests/spec/010-focus.js +++ b/tests/spec/010-focus.js @@ -137,3 +137,21 @@ test('clicking sensitive button returns focus to sensitive button', async t => { .click(getNthStatusSensitiveMediaButton(sensitiveKittenIdx + 1)) .expect(getActiveElementAriaLabel()).eql('Show sensitive media') }) + +test('preserves focus two levels deep', async t => { + await loginAsFoobar(t) + await t + .hover(getNthStatus(1)) + .click($('.status-author-name').withText(('admin'))) + .expect(getUrl()).contains('/accounts/1') + .click(getNthStatus(1)) + .expect(getUrl()).contains('status') + await goBack() + await t + .expect(getUrl()).contains('/accounts/1') + .expect(getActiveElementClassList()).contains('status-article') + await goBack() + await t + .expect(getUrl()).eql('http://localhost:4002/') + .expect(getActiveElementClassList()).contains('status-author-name') +})