diff --git a/routes/_components/profile/AccountProfileDetails.html b/routes/_components/profile/AccountProfileDetails.html
index c282de1a..3f3a0077 100644
--- a/routes/_components/profile/AccountProfileDetails.html
+++ b/routes/_components/profile/AccountProfileDetails.html
@@ -8,7 +8,9 @@
+ href='/accounts/{{account.id}}/follows'
+ aria-label="{{followingLabel}}"
+ >
Follows
@@ -17,7 +19,9 @@
+ href='/accounts/{{account.id}}/followers'
+ aria-label="{{followersLabel}}"
+ >
Followers
@@ -120,7 +124,9 @@
numFollowers: account => account.followers_count || 0,
numStatusesDisplay: numStatuses => numberFormat.format(numStatuses),
numFollowingDisplay: numFollowing => numberFormat.format(numFollowing),
- numFollowersDisplay: numFollowers => numberFormat.format(numFollowers)
+ numFollowersDisplay: numFollowers => numberFormat.format(numFollowers),
+ followersLabel: numFollowers => `Followed by ${numFollowers}`,
+ followingLabel: numFollowing => `Follows ${numFollowing}`
},
methods: {
async onMoreOptionsClick () {
diff --git a/tests/spec/021-followers-follows.js b/tests/spec/021-followers-follows.js
new file mode 100644
index 00000000..53368c15
--- /dev/null
+++ b/tests/spec/021-followers-follows.js
@@ -0,0 +1,26 @@
+import {
+ followersButton,
+ followsButton, getNthSearchResult,
+ getNthStatus, getUrl, goBack
+} from '../utils'
+import { foobarRole } from '../roles'
+
+fixture`021-followers-follows.js`
+ .page`http://localhost:4002`
+
+test('shows followers and follows', async t => {
+ await t.useRole(foobarRole)
+ .click(getNthStatus(0).find('.status-author-name'))
+ .expect(getUrl()).match(/\/accounts\/3$/)
+ .expect(followsButton.getAttribute('aria-label')).eql('Follows 2')
+ .click(followsButton)
+ .expect(getUrl()).contains('/accounts/3/follows')
+ .expect(getNthSearchResult(1).innerText).contains('@foobar')
+ .expect(getNthSearchResult(2).innerText).contains('@admin')
+ await goBack()
+ await t.expect(getUrl()).match(/\/accounts\/3$/)
+ .expect(followersButton.getAttribute('aria-label')).eql('Followed by 1')
+ .click(followersButton)
+ .expect(getUrl()).contains('/accounts/3/followers')
+ .expect(getNthSearchResult(1).innerText).contains('@admin')
+})
diff --git a/tests/utils.js b/tests/utils.js
index 9ff0cf5f..f953e092 100644
--- a/tests/utils.js
+++ b/tests/utils.js
@@ -39,6 +39,8 @@ export const goBackButton = $('.dynamic-page-go-back')
export const accountProfileMoreOptionsButton = $('.account-profile-more-options button')
export const addInstanceButton = $('#submitButton')
export const mastodonLogInButton = $('button[type="submit"]')
+export const followsButton = $('.account-profile-details > *:nth-child(2)')
+export const followersButton = $('.account-profile-details > *:nth-child(3)')
export const favoritesCountElement = $('.status-favs-reblogs:nth-child(3)').addCustomDOMProperties({
innerCount: el => parseInt(el.innerText, 10)