From 9b316665b63e9c886a67b3930f03b13efc95983c Mon Sep 17 00:00:00 2001
From: Nolan Lawson <nolan@nolanlawson.com>
Date: Wed, 21 Feb 2018 09:26:22 -0800
Subject: [PATCH] add focus test

---
 tests/spec/08-status-media.js | 19 +++++--------------
 tests/spec/10-focus.js        | 25 +++++++++++++++++++++++++
 tests/utils.js                | 15 +++++++++++++++
 3 files changed, 45 insertions(+), 14 deletions(-)
 create mode 100644 tests/spec/10-focus.js

diff --git a/tests/spec/08-status-media.js b/tests/spec/08-status-media.js
index c71ab40f..d6e3f398 100644
--- a/tests/spec/08-status-media.js
+++ b/tests/spec/08-status-media.js
@@ -1,19 +1,13 @@
-import { Selector as $ } from 'testcafe'
-import { getNthStatus } from '../utils'
+import { closeDialogButton, getNthStatus, modalDialogContents, scrollToStatus } from '../utils'
 import { foobarRole } from '../roles'
 
-const modalDialogContents = $('.modal-dialog-contents')
-const closeDialogButton = $('.close-dialog-button')
-
 fixture`08-status-media.js`
   .page`http://localhost:4002`
 
 test('shows sensitive images and videos', async t => {
   await t.useRole(foobarRole)
-    .hover(getNthStatus(3))
-    .hover(getNthStatus(6))
-    .hover(getNthStatus(7))
-    .expect(getNthStatus(7).find('.status-media img').exists).notOk()
+  await scrollToStatus(t, 7)
+  await t.expect(getNthStatus(7).find('.status-media img').exists).notOk()
     .click(getNthStatus(7).find('.status-sensitive-media-button'))
     .expect(getNthStatus(7).find('.status-media img').getAttribute('alt')).eql('kitten')
     .expect(getNthStatus(7).find('.status-media img').hasAttribute('src')).ok()
@@ -25,11 +19,8 @@ test('shows sensitive images and videos', async t => {
 
 test('click and close image and video modals', async t => {
   await t.useRole(foobarRole)
-    .hover(getNthStatus(3))
-    .hover(getNthStatus(6))
-    .hover(getNthStatus(7))
-    .hover(getNthStatus(9))
-    .expect(modalDialogContents.exists).notOk()
+  await scrollToStatus(t, 9)
+  await t.expect(modalDialogContents.exists).notOk()
     .click(getNthStatus(9).find('.play-video-button'))
     .expect(modalDialogContents.exists).ok()
     .click(closeDialogButton)
diff --git a/tests/spec/10-focus.js b/tests/spec/10-focus.js
new file mode 100644
index 00000000..95ac27a4
--- /dev/null
+++ b/tests/spec/10-focus.js
@@ -0,0 +1,25 @@
+import {
+  getNthStatus, scrollToStatus, closeDialogButton, modalDialogContents, getActiveElementClass, goBack, getUrl
+} from '../utils'
+import { foobarRole } from '../roles'
+
+fixture`09-threads.js`
+  .page`http://localhost:4002`
+
+test('modal preserves focus', async t => {
+  await t.useRole(foobarRole)
+  await scrollToStatus(t, 9)
+  await t.click(getNthStatus(9).find('.play-video-button'))
+    .click(closeDialogButton)
+    .expect(modalDialogContents.exists).notOk()
+    .expect(getActiveElementClass()).eql('play-video-button')
+})
+
+test('timeline preserves focus', async t => {
+  await t.useRole(foobarRole)
+    .click(getNthStatus(0))
+    .expect(getUrl()).contains('/statuses/99549266679020981')
+
+  await goBack()
+  await t.expect(getActiveElementClass()).eql('status-article status-in-timeline')
+})
diff --git a/tests/utils.js b/tests/utils.js
index 9d444d72..5ade55a3 100644
--- a/tests/utils.js
+++ b/tests/utils.js
@@ -3,9 +3,17 @@ import { ClientFunction as exec, Selector as $ } from 'testcafe'
 export const settingsButton = $('nav a[aria-label=Settings]')
 export const instanceInput = $('#instanceInput')
 export const addInstanceButton = $('.add-new-instance button')
+export const modalDialogContents = $('.modal-dialog-contents')
+export const closeDialogButton = $('.close-dialog-button')
 
 export const getUrl = exec(() => window.location.href)
 
+export const getActiveElementClass = exec(() =>
+  document.activeElement ? document.activeElement.getAttribute('class') : ''
+)
+
+export const goBack = exec(() => window.history.back())
+
 export function getNthStatus (n) {
   return $(`[aria-hidden="false"] > article[aria-posinset="${n}"]`)
 }
@@ -58,3 +66,10 @@ export async function scrollToBottomOfTimeline (t) {
     lastSize = newSize
   }
 }
+
+export async function scrollToStatus (t, n) {
+  for (let i = 0; i < n; i += 2) {
+    await t.hover(getNthStatus(n))
+  }
+  await t.hover(getNthStatus(n))
+}