data.coop/pinafore
8
0
Fork 0
Code Issues 1 Pull requests Packages Projects Releases Wiki Activity

fix: add better browser notification badges (#857)

Browse source 
* fix: add better browser notification badges

* fix test

* fix tests for real

* actually fix tests
This commit is contained in:
Nolan Lawson 2018-12-30 14:51:03 -08:00 committed by GitHub
parent 795d6bce35
commit e5ef4b9bb1
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 42 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/routes/_components/NavItem.html
View file

@ -205,7 +205,7 @@
res += ' (current page)'
}
if (name === 'notifications' && $numberOfNotifications) {
res += ` (${$numberOfNotifications})`
res += ` (${$numberOfNotifications} notification${$numberOfNotifications === 1 ? '' : 's'})`
}
return res
},

4
src/routes/_components/Title.html
View file

@ -1,5 +1,5 @@
<svelte:head>
<title>{instanceIndicator} · {name}{notificationsIndicator}</title>
<title>{notificationsIndicator}{instanceIndicator} · {name}</title>
</svelte:head>
<script>
import { store } from '../_store/store'
@ -17,7 +17,7 @@
`${($isUserLoggedIn && !settingsPage && $currentInstance) ? $currentInstance : 'Pinafore'}`
),
notificationsIndicator: ({ $hasNotifications, $numberOfNotifications }) => (
$hasNotifications ? ` (${$numberOfNotifications})` : ''
$hasNotifications ? `(${$numberOfNotifications}) ` : ''
)
}
}

40
tests/spec/102-notifications.js
View file

@ -1,22 +1,27 @@
import { loginAsFoobar } from '../roles'
import {
getNthStatus, getTitleText, getUrl, homeNavButton, notificationsNavButton
getNthStatus, getNthStatusContent, getTitleText, getUrl, homeNavButton, notificationsNavButton
} from '../utils'
import { favoriteStatusAs, postAs } from '../serverActions'
fixture`102-notifications.js`
.page`http://localhost:4002`
test('shows unread notifications', async t => {
test('shows unread notification', async t => {
let { id } = await postAs('foobar', 'somebody please favorite this to validate me')
await loginAsFoobar(t)
await t
.expect(notificationsNavButton.getAttribute('aria-label')).eql('Notifications')
.expect(getTitleText()).eql('localhost:3000 · Home')
.expect(getNthStatusContent(0).innerText).contains('somebody please favorite this to validate me', {
timeout: 20000
})
await favoriteStatusAs('admin', id)
await t
.expect(notificationsNavButton.getAttribute('aria-label')).eql('Notifications (1)')
.expect(getTitleText()).eql('localhost:3000 · Home (1)')
.expect(notificationsNavButton.getAttribute('aria-label')).eql('Notifications (1 notification)', {
timeout: 20000
})
.expect(getTitleText()).eql('(1) localhost:3000 · Home')
.click(notificationsNavButton)
.expect(getUrl()).contains('/notifications')
.expect(notificationsNavButton.getAttribute('aria-label')).eql('Notifications (current page)')
@ -28,3 +33,30 @@ test('shows unread notifications', async t => {
.expect(notificationsNavButton.getAttribute('aria-label')).eql('Notifications')
.expect(getTitleText()).eql('localhost:3000 · Home')
})
test('shows unread notifications, more than one', async t => {
let { id } = await postAs('foobar', 'I need lots of favorites on this one')
await loginAsFoobar(t)
await t
.expect(notificationsNavButton.getAttribute('aria-label')).eql('Notifications')
.expect(getTitleText()).eql('localhost:3000 · Home')
.expect(getNthStatusContent(0).innerText).contains('I need lots of favorites on this one', {
timeout: 20000
})
await favoriteStatusAs('admin', id)
await favoriteStatusAs('quux', id)
await t
.expect(notificationsNavButton.getAttribute('aria-label')).eql('Notifications (2 notifications)', {
timeout: 20000
})
.expect(getTitleText()).eql('(2) localhost:3000 · Home')
.click(notificationsNavButton)
.expect(getUrl()).contains('/notifications')
.expect(notificationsNavButton.getAttribute('aria-label')).eql('Notifications (current page)')
.expect(getTitleText()).eql('localhost:3000 · Notifications')
.expect(getNthStatus(0).innerText).contains('I need lots of favorites on this one')
await t
.click(homeNavButton)
.expect(notificationsNavButton.getAttribute('aria-label')).eql('Notifications')
.expect(getTitleText()).eql('localhost:3000 · Home')
})

2
tests/spec/105-deletes.js
View file

@ -61,7 +61,7 @@ test('deleted statuses result in deleted notifications', async t => {
.hover(getNthStatus(0))
.expect(notificationsNavButton.getAttribute('aria-label')).eql('Notifications')
let status = await postAs('admin', "@foobar yo yo foobar what's up")
await t.expect(notificationsNavButton.getAttribute('aria-label')).eql('Notifications (1)', { timeout })
await t.expect(notificationsNavButton.getAttribute('aria-label')).eql('Notifications (1 notification)', { timeout })
await deleteAs('admin', status.id)
await t.expect(notificationsNavButton.getAttribute('aria-label')).eql('Notifications', { timeout })
})

2
tests/utils.js
View file

@ -97,7 +97,7 @@ export const getActiveElementInsideNthStatus = exec(() => {
return ''
})
export const getTitleText = exec(() => document.head.querySelector('title').innerHTML)
export const getTitleText = exec(() => document.head.querySelector('title') && document.head.querySelector('title').innerHTML)
export const goBack = exec(() => window.history.back())