@group-member
@email-less-member, my trusty followers.', }, read: false, reason: 'post_in_group', @@ -225,7 +243,7 @@ describe('emails sent for notifications', () => { __typename: 'Post', id: 'post', content: - 'Hello, @group-member, my trusty follower.', + 'Hello,
@group-member
@email-less-member, my trusty followers.', }, read: false, reason: 'followed_user_posted', @@ -237,7 +255,7 @@ describe('emails sent for notifications', () => { __typename: 'Post', id: 'post', content: - 'Hello, @group-member, my trusty follower.', + 'Hello,
@group-member
@email-less-member, my trusty followers.', }, read: false, reason: 'mentioned_in_post', @@ -260,7 +278,7 @@ describe('emails sent for notifications', () => { variables: { id: 'post', title: 'This is the post', - content: `Hello, ${mentionString}, my trusty follower.`, + content: `Hello, ${mentionString}, my trusty followers.`, groupId: 'public-group', }, }) @@ -285,7 +303,7 @@ describe('emails sent for notifications', () => { __typename: 'Post', id: 'post', content: - 'Hello, @group-member, my trusty follower.', + 'Hello,
@group-member
@email-less-member, my trusty followers.', }, read: false, reason: 'post_in_group', @@ -297,7 +315,7 @@ describe('emails sent for notifications', () => { __typename: 'Post', id: 'post', content: - 'Hello, @group-member, my trusty follower.', + 'Hello,
@group-member
@email-less-member, my trusty followers.', }, read: false, reason: 'followed_user_posted', @@ -309,7 +327,7 @@ describe('emails sent for notifications', () => { __typename: 'Post', id: 'post', content: - 'Hello, @group-member, my trusty follower.', + 'Hello,
@group-member
@email-less-member, my trusty followers.', }, read: false, reason: 'mentioned_in_post', @@ -333,7 +351,7 @@ describe('emails sent for notifications', () => { variables: { id: 'post', title: 'This is the post', - content: `Hello, ${mentionString}, my trusty follower.`, + content: `Hello, ${mentionString}, my trusty followers.`, groupId: 'public-group', }, }) @@ -358,7 +376,7 @@ describe('emails sent for notifications', () => { __typename: 'Post', id: 'post', content: - 'Hello, @group-member, my trusty follower.', + 'Hello,
@group-member
@email-less-member, my trusty followers.', }, read: false, reason: 'post_in_group', @@ -370,7 +388,7 @@ describe('emails sent for notifications', () => { __typename: 'Post', id: 'post', content: - 'Hello, @group-member, my trusty follower.', + 'Hello,
@group-member
@email-less-member, my trusty followers.', }, read: false, reason: 'followed_user_posted', @@ -382,7 +400,7 @@ describe('emails sent for notifications', () => { __typename: 'Post', id: 'post', content: - 'Hello, @group-member, my trusty follower.', + 'Hello,
@group-member
@email-less-member, my trusty followers.', }, read: false, reason: 'mentioned_in_post', @@ -407,7 +425,7 @@ describe('emails sent for notifications', () => { variables: { id: 'post', title: 'This is the post', - content: `Hello, ${mentionString}, my trusty follower.`, + content: `Hello, ${mentionString}, my trusty followers.`, groupId: 'public-group', }, }) @@ -432,7 +450,7 @@ describe('emails sent for notifications', () => { __typename: 'Post', id: 'post', content: - 'Hello, @group-member, my trusty follower.', + 'Hello,
@group-member
@email-less-member, my trusty followers.', }, read: false, reason: 'post_in_group', @@ -444,7 +462,7 @@ describe('emails sent for notifications', () => { __typename: 'Post', id: 'post', content: - 'Hello, @group-member, my trusty follower.', + 'Hello,
@group-member
@email-less-member, my trusty followers.', }, read: false, reason: 'followed_user_posted', @@ -456,7 +474,7 @@ describe('emails sent for notifications', () => { __typename: 'Post', id: 'post', content: - 'Hello, @group-member, my trusty follower.', + 'Hello,
@group-member
@email-less-member, my trusty followers.', }, read: false, reason: 'mentioned_in_post', @@ -481,7 +499,7 @@ describe('emails sent for notifications', () => { variables: { id: 'post', title: 'This is the post', - content: `Hello, ${mentionString}, my trusty follower.`, + content: `Hello, ${mentionString}, my trusty followers.`, groupId: 'public-group', }, }) @@ -501,7 +519,7 @@ describe('emails sent for notifications', () => { mutation: createCommentMutation, variables: { id: 'comment-2', - content: `Hello, ${mentionString}, my beloved follower.`, + content: `Hello, ${mentionString}, my trusty followers.`, postId: 'post', }, }) @@ -529,7 +547,7 @@ describe('emails sent for notifications', () => { __typename: 'Comment', id: 'comment-2', content: - 'Hello, @group-member, my beloved follower.', + 'Hello,
@group-member
@email-less-member, my trusty followers.', }, read: false, reason: 'commented_on_post', @@ -541,7 +559,7 @@ describe('emails sent for notifications', () => { __typename: 'Comment', id: 'comment-2', content: - 'Hello, @group-member, my beloved follower.', + 'Hello,
@group-member
@email-less-member, my trusty followers.', }, read: false, reason: 'mentioned_in_comment', @@ -563,7 +581,7 @@ describe('emails sent for notifications', () => { variables: { id: 'post', title: 'This is the post', - content: `Hello, ${mentionString}, my trusty follower.`, + content: `Hello, ${mentionString}, my trusty followers.`, groupId: 'public-group', }, }) @@ -583,7 +601,7 @@ describe('emails sent for notifications', () => { mutation: createCommentMutation, variables: { id: 'comment-2', - content: `Hello, ${mentionString}, my beloved follower.`, + content: `Hello, ${mentionString}, my trusty followers.`, postId: 'post', }, }) @@ -611,7 +629,7 @@ describe('emails sent for notifications', () => { __typename: 'Comment', id: 'comment-2', content: - 'Hello, @group-member, my beloved follower.', + 'Hello,
@group-member
@email-less-member, my trusty followers.', }, read: false, reason: 'commented_on_post', @@ -623,7 +641,7 @@ describe('emails sent for notifications', () => { __typename: 'Comment', id: 'comment-2', content: - 'Hello, @group-member, my beloved follower.', + 'Hello,
@group-member
@email-less-member, my trusty followers.', }, read: false, reason: 'mentioned_in_comment', @@ -646,7 +664,7 @@ describe('emails sent for notifications', () => { variables: { id: 'post', title: 'This is the post', - content: `Hello, ${mentionString}, my trusty follower.`, + content: `Hello, ${mentionString}, my trusty followers.`, groupId: 'public-group', }, }) @@ -666,7 +684,7 @@ describe('emails sent for notifications', () => { mutation: createCommentMutation, variables: { id: 'comment-2', - content: `Hello, ${mentionString}, my beloved follower.`, + content: `Hello, ${mentionString}, my trusty followers.`, postId: 'post', }, }) @@ -694,7 +712,7 @@ describe('emails sent for notifications', () => { __typename: 'Comment', id: 'comment-2', content: - 'Hello, @group-member, my beloved follower.', + 'Hello,
@group-member
@email-less-member, my trusty followers.', }, read: false, reason: 'commented_on_post', @@ -706,7 +724,7 @@ describe('emails sent for notifications', () => { __typename: 'Comment', id: 'comment-2', content: - 'Hello, @group-member, my beloved follower.', + 'Hello,
@group-member
@email-less-member, my trusty followers.', }, read: false, reason: 'mentioned_in_comment', diff --git a/backend/src/middleware/notifications/notificationsMiddleware.followed-users.spec.ts b/backend/src/middleware/notifications/notificationsMiddleware.followed-users.spec.ts index 5be4ea5b5..21d4a14a0 100644 --- a/backend/src/middleware/notifications/notificationsMiddleware.followed-users.spec.ts +++ b/backend/src/middleware/notifications/notificationsMiddleware.followed-users.spec.ts @@ -2,7 +2,7 @@ /* eslint-disable @typescript-eslint/no-unsafe-argument */ /* eslint-disable @typescript-eslint/no-unsafe-member-access */ /* eslint-disable @typescript-eslint/no-unsafe-assignment */ -/* eslint-disable @typescript-eslint/no-unsafe-return */ + import { createTestClient } from 'apollo-server-testing' import gql from 'graphql-tag' @@ -14,14 +14,14 @@ import createServer from '@src/server' CONFIG.CATEGORIES_ACTIVE = false -const sendMailMock = jest.fn() -jest.mock('../helpers/email/sendMail', () => ({ - sendMail: () => sendMailMock(), +const sendMailMock: (notification) => void = jest.fn() +jest.mock('@middleware/helpers/email/sendMail', () => ({ + sendMail: (notification) => sendMailMock(notification), })) let server, query, mutate, authenticatedUser -let postAuthor, firstFollower, secondFollower +let postAuthor, firstFollower, secondFollower, thirdFollower, emaillessFollower const driver = getDriver() const neode = getNeode() @@ -94,7 +94,7 @@ beforeAll(async () => { afterAll(async () => { await cleanDatabase() - driver.close() + await driver.close() }) describe('following users notifications', () => { @@ -107,7 +107,7 @@ describe('following users notifications', () => { slug: 'post-author', }, { - email: 'test@example.org', + email: 'post-author@example.org', password: '1234', }, ) @@ -119,7 +119,7 @@ describe('following users notifications', () => { slug: 'first-follower', }, { - email: 'test2@example.org', + email: 'first-follower@example.org', password: '1234', }, ) @@ -131,10 +131,27 @@ describe('following users notifications', () => { slug: 'second-follower', }, { - email: 'test3@example.org', + email: 'second-follower@example.org', password: '1234', }, ) + thirdFollower = await Factory.build( + 'user', + { + id: 'third-follower', + name: 'Third Follower', + slug: 'third-follower', + }, + { + email: 'third-follower@example.org', + password: '1234', + }, + ) + emaillessFollower = await neode.create('User', { + id: 'email-less-follower', + name: 'Email-less Follower', + slug: 'email-less-follower', + }) await secondFollower.update({ emailNotificationsFollowingUsers: false }) authenticatedUser = await firstFollower.toJson() await mutate({ @@ -146,6 +163,16 @@ describe('following users notifications', () => { mutation: followUserMutation, variables: { id: 'post-author' }, }) + authenticatedUser = await thirdFollower.toJson() + await mutate({ + mutation: followUserMutation, + variables: { id: 'post-author' }, + }) + authenticatedUser = await emaillessFollower.toJson() + await mutate({ + mutation: followUserMutation, + variables: { id: 'post-author' }, + }) jest.clearAllMocks() }) @@ -221,8 +248,43 @@ describe('following users notifications', () => { }) }) - it('sends only one email, as second follower has emails disabled', () => { - expect(sendMailMock).toHaveBeenCalledTimes(1) + it('sends notification to the email-less follower', async () => { + authenticatedUser = await emaillessFollower.toJson() + await expect( + query({ + query: notificationQuery, + }), + ).resolves.toMatchObject({ + data: { + notifications: [ + { + from: { + __typename: 'Post', + id: 'post', + }, + read: false, + reason: 'followed_user_posted', + }, + ], + }, + errors: undefined, + }) + }) + + it('sends only two emails, as second follower has emails disabled and email-less follower has no email', () => { + expect(sendMailMock).toHaveBeenCalledTimes(2) + expect(sendMailMock).toHaveBeenCalledWith( + expect.objectContaining({ + html: expect.stringContaining('Hello First Follower'), + to: 'first-follower@example.org', + }), + ) + expect(sendMailMock).toHaveBeenCalledWith( + expect.objectContaining({ + html: expect.stringContaining('Hello Third Follower'), + to: 'third-follower@example.org', + }), + ) }) }) diff --git a/backend/src/middleware/notifications/notificationsMiddleware.mentions-in-groups.spec.ts b/backend/src/middleware/notifications/notificationsMiddleware.mentions-in-groups.spec.ts index 7058efd25..96c7e9d18 100644 --- a/backend/src/middleware/notifications/notificationsMiddleware.mentions-in-groups.spec.ts +++ b/backend/src/middleware/notifications/notificationsMiddleware.mentions-in-groups.spec.ts @@ -17,22 +17,23 @@ import createServer from '@src/server' CONFIG.CATEGORIES_ACTIVE = false -const sendMailMock = jest.fn() -jest.mock('../helpers/email/sendMail', () => ({ - sendMail: () => sendMailMock(), +const sendMailMock: (notification) => void = jest.fn() +jest.mock('@middleware/helpers/email/sendMail', () => ({ + sendMail: (notification) => sendMailMock(notification), })) let server, query, mutate, authenticatedUser -let postAuthor, groupMember, pendingMember, noMember +let postAuthor, groupMember, pendingMember, noMember, emaillessMember const driver = getDriver() const neode = getNeode() const mentionString = ` - @no-meber + @no-member @pending-member @group-member. + @email-less-member. ` const createPostMutation = gql` @@ -115,7 +116,7 @@ beforeAll(async () => { afterAll(async () => { await cleanDatabase() - driver.close() + await driver.close() }) describe('mentions in groups', () => { @@ -168,6 +169,12 @@ describe('mentions in groups', () => { password: '1234', }, ) + emaillessMember = await neode.create('User', { + id: 'email-less-member', + name: 'Email-less Member', + slug: 'email-less-member', + }) + authenticatedUser = await postAuthor.toJson() await mutate({ mutation: createGroupMutation(), @@ -243,6 +250,28 @@ describe('mentions in groups', () => { userId: 'pending-member', }, }) + authenticatedUser = await emaillessMember.toJson() + await mutate({ + mutation: joinGroupMutation(), + variables: { + groupId: 'public-group', + userId: 'group-member', + }, + }) + await mutate({ + mutation: joinGroupMutation(), + variables: { + groupId: 'closed-group', + userId: 'group-member', + }, + }) + await mutate({ + mutation: joinGroupMutation(), + variables: { + groupId: 'hidden-group', + userId: 'group-member', + }, + }) authenticatedUser = await postAuthor.toJson() await mutate({ mutation: changeGroupMemberRoleMutation(), @@ -260,8 +289,26 @@ describe('mentions in groups', () => { roleInGroup: 'usual', }, }) + await mutate({ + mutation: changeGroupMemberRoleMutation(), + variables: { + groupId: 'closed-group', + userId: 'email-less-member', + roleInGroup: 'usual', + }, + }) + await mutate({ + mutation: changeGroupMemberRoleMutation(), + variables: { + groupId: 'hidden-group', + userId: 'email-less-member', + roleInGroup: 'usual', + }, + }) authenticatedUser = await groupMember.toJson() await markAllAsRead() + authenticatedUser = await emaillessMember.toJson() + await markAllAsRead() }) afterEach(async () => { @@ -327,7 +374,7 @@ describe('mentions in groups', () => { __typename: 'Post', id: 'public-post', content: - 'Hey
@no-meber
@pending-member
@group-member.
! Please read this', + 'Hey
@no-member
@pending-member
@group-member.
@email-less-member.
! Please read this', }, read: false, reason: 'post_in_group', @@ -339,7 +386,7 @@ describe('mentions in groups', () => { __typename: 'Post', id: 'public-post', content: - 'Hey
@no-meber
@pending-member
@group-member.
! Please read this', + 'Hey
@no-member
@pending-member
@group-member.
@email-less-member.
! Please read this', }, read: false, reason: 'mentioned_in_post', @@ -351,7 +398,7 @@ describe('mentions in groups', () => { }) }) - it('sends 3 emails, one for each user', () => { + it('sends only 3 emails, one for each user with an email', () => { expect(sendMailMock).toHaveBeenCalledTimes(3) }) }) @@ -423,7 +470,7 @@ describe('mentions in groups', () => { __typename: 'Post', id: 'closed-post', content: - 'Hey members
@no-meber
@pending-member
@group-member.
! Please read this', + 'Hey members
@no-member
@pending-member
@group-member.
@email-less-member.
! Please read this', }, read: false, reason: 'post_in_group', @@ -435,7 +482,7 @@ describe('mentions in groups', () => { __typename: 'Post', id: 'closed-post', content: - 'Hey members
@no-meber
@pending-member
@group-member.
! Please read this', + 'Hey members
@no-member
@pending-member
@group-member.
@email-less-member.
! Please read this', }, read: false, reason: 'mentioned_in_post', @@ -519,7 +566,7 @@ describe('mentions in groups', () => { __typename: 'Post', id: 'hidden-post', content: - 'Hey hiders
@no-meber
@pending-member
@group-member.
! Please read this', + 'Hey hiders
@no-member
@pending-member
@group-member.
@email-less-member.
! Please read this', }, read: false, reason: 'post_in_group', @@ -531,7 +578,7 @@ describe('mentions in groups', () => { __typename: 'Post', id: 'hidden-post', content: - 'Hey hiders
@no-meber
@pending-member
@group-member.
! Please read this', + 'Hey hiders
@no-member
@pending-member
@group-member.
@email-less-member.
! Please read this', }, read: false, reason: 'mentioned_in_post', diff --git a/backend/src/middleware/notifications/notificationsMiddleware.observing-posts.spec.ts b/backend/src/middleware/notifications/notificationsMiddleware.observing-posts.spec.ts index 2c73d2beb..a0864fe07 100644 --- a/backend/src/middleware/notifications/notificationsMiddleware.observing-posts.spec.ts +++ b/backend/src/middleware/notifications/notificationsMiddleware.observing-posts.spec.ts @@ -6,15 +6,20 @@ import { createTestClient } from 'apollo-server-testing' import gql from 'graphql-tag' import CONFIG from '@config/index' -import { cleanDatabase } from '@db/factories' +import Factory, { cleanDatabase } from '@db/factories' import { getNeode, getDriver } from '@db/neo4j' import createServer from '@src/server' CONFIG.CATEGORIES_ACTIVE = false +const sendMailMock: (notification) => void = jest.fn() +jest.mock('@middleware/helpers/email/sendMail', () => ({ + sendMail: (notification) => sendMailMock(notification), +})) + let server, query, mutate, authenticatedUser -let postAuthor, firstCommenter, secondCommenter +let postAuthor, firstCommenter, secondCommenter, emaillessObserver const driver = getDriver() const neode = getNeode() @@ -97,47 +102,52 @@ beforeAll(async () => { afterAll(async () => { await cleanDatabase() - driver.close() + await driver.close() }) describe('notifications for users that observe a post', () => { beforeAll(async () => { - postAuthor = await neode.create( - 'User', + postAuthor = await Factory.build( + 'user', { id: 'post-author', name: 'Post Author', slug: 'post-author', }, { - email: 'test@example.org', + email: 'post-author@example.org', password: '1234', }, ) - firstCommenter = await neode.create( - 'User', + firstCommenter = await Factory.build( + 'user', { id: 'first-commenter', name: 'First Commenter', slug: 'first-commenter', }, { - email: 'test2@example.org', + email: 'first-commenter@example.org', password: '1234', }, ) - secondCommenter = await neode.create( - 'User', + secondCommenter = await Factory.build( + 'user', { id: 'second-commenter', name: 'Second Commenter', slug: 'second-commenter', }, { - email: 'test3@example.org', + email: 'second-commenter@example.org', password: '1234', }, ) + emaillessObserver = await neode.create('User', { + id: 'email-less-observer', + name: 'Email-less Observer', + slug: 'email-less-observer', + }) authenticatedUser = await postAuthor.toJson() await mutate({ mutation: createPostMutation, @@ -147,6 +157,14 @@ describe('notifications for users that observe a post', () => { content: 'This is the content of the post', }, }) + authenticatedUser = await emaillessObserver.toJson() + await mutate({ + mutation: toggleObservePostMutation, + variables: { + id: 'post', + value: true, + }, + }) }) describe('first comment on the post', () => { @@ -198,8 +216,18 @@ describe('notifications for users that observe a post', () => { }) }) + it('sends one email', () => { + expect(sendMailMock).toHaveBeenCalledTimes(1) + expect(sendMailMock).toHaveBeenCalledWith( + expect.objectContaining({ + to: 'post-author@example.org', + }), + ) + }) + describe('second comment on post', () => { beforeAll(async () => { + jest.clearAllMocks() authenticatedUser = await secondCommenter.toJson() await mutate({ mutation: createCommentMutation, @@ -277,10 +305,25 @@ describe('notifications for users that observe a post', () => { errors: undefined, }) }) + + it('sends two emails', () => { + expect(sendMailMock).toHaveBeenCalledTimes(2) + expect(sendMailMock).toHaveBeenCalledWith( + expect.objectContaining({ + to: 'post-author@example.org', + }), + ) + expect(sendMailMock).toHaveBeenCalledWith( + expect.objectContaining({ + to: 'first-commenter@example.org', + }), + ) + }) }) describe('first commenter unfollows the post and post author comments post', () => { beforeAll(async () => { + jest.clearAllMocks() authenticatedUser = await firstCommenter.toJson() await mutate({ mutation: toggleObservePostMutation, @@ -376,6 +419,15 @@ describe('notifications for users that observe a post', () => { errors: undefined, }) }) + + it('sends one email', () => { + expect(sendMailMock).toHaveBeenCalledTimes(1) + expect(sendMailMock).toHaveBeenCalledWith( + expect.objectContaining({ + to: 'second-commenter@example.org', + }), + ) + }) }) }) }) diff --git a/backend/src/middleware/notifications/notificationsMiddleware.online-status.spec.ts b/backend/src/middleware/notifications/notificationsMiddleware.online-status.spec.ts index da9a6b250..3a47d376d 100644 --- a/backend/src/middleware/notifications/notificationsMiddleware.online-status.spec.ts +++ b/backend/src/middleware/notifications/notificationsMiddleware.online-status.spec.ts @@ -13,9 +13,9 @@ import createServer from '@src/server' CONFIG.CATEGORIES_ACTIVE = false -const sendMailMock = jest.fn() -jest.mock('../helpers/email/sendMail', () => ({ - sendMail: () => sendMailMock(), +const sendMailMock: (notification) => void = jest.fn() +jest.mock('@middleware/helpers/email/sendMail', () => ({ + sendMail: (notification) => sendMailMock(notification), })) let isUserOnlineMock = jest.fn().mockReturnValue(false) @@ -62,7 +62,7 @@ beforeAll(async () => { afterAll(async () => { await cleanDatabase() - driver.close() + await driver.close() }) afterEach(async () => { diff --git a/backend/src/middleware/notifications/notificationsMiddleware.posts-in-groups.spec.ts b/backend/src/middleware/notifications/notificationsMiddleware.posts-in-groups.spec.ts index 9ca4ae7ab..25aef2e2b 100644 --- a/backend/src/middleware/notifications/notificationsMiddleware.posts-in-groups.spec.ts +++ b/backend/src/middleware/notifications/notificationsMiddleware.posts-in-groups.spec.ts @@ -17,14 +17,14 @@ import createServer from '@src/server' CONFIG.CATEGORIES_ACTIVE = false -const sendMailMock = jest.fn() -jest.mock('../helpers/email/sendMail', () => ({ - sendMail: () => sendMailMock(), +const sendMailMock: (notification) => void = jest.fn() +jest.mock('@middleware/helpers/email/sendMail', () => ({ + sendMail: (notification) => sendMailMock(notification), })) let server, query, mutate, authenticatedUser -let postAuthor, groupMember, pendingMember +let postAuthor, groupMember, pendingMember, emaillessMember const driver = getDriver() const neode = getNeode() @@ -118,7 +118,7 @@ beforeAll(async () => { afterAll(async () => { await cleanDatabase() - driver.close() + await driver.close() }) describe('notify group members of new posts in group', () => { @@ -159,6 +159,12 @@ describe('notify group members of new posts in group', () => { password: '1234', }, ) + emaillessMember = await neode.create('User', { + id: 'email-less-member', + name: 'Email-less Member', + slug: 'email-less-member', + }) + authenticatedUser = await postAuthor.toJson() await mutate({ mutation: createGroupMutation(), @@ -186,6 +192,14 @@ describe('notify group members of new posts in group', () => { userId: 'pending-member', }, }) + authenticatedUser = await emaillessMember.toJson() + await mutate({ + mutation: joinGroupMutation(), + variables: { + groupId: 'g-1', + userId: 'group-member', + }, + }) authenticatedUser = await postAuthor.toJson() await mutate({ mutation: changeGroupMemberRoleMutation(), @@ -195,6 +209,14 @@ describe('notify group members of new posts in group', () => { roleInGroup: 'usual', }, }) + await mutate({ + mutation: changeGroupMemberRoleMutation(), + variables: { + groupId: 'g-1', + userId: 'email-less-member', + roleInGroup: 'usual', + }, + }) }) afterEach(async () => { diff --git a/backend/src/middleware/notifications/notificationsMiddleware.spec.ts b/backend/src/middleware/notifications/notificationsMiddleware.spec.ts index 908ccac22..ab0a6a5b2 100644 --- a/backend/src/middleware/notifications/notificationsMiddleware.spec.ts +++ b/backend/src/middleware/notifications/notificationsMiddleware.spec.ts @@ -18,9 +18,9 @@ import { leaveGroupMutation } from '@graphql/queries/leaveGroupMutation' import { removeUserFromGroupMutation } from '@graphql/queries/removeUserFromGroupMutation' import createServer, { pubsub } from '@src/server' -const sendMailMock = jest.fn() -jest.mock('../helpers/email/sendMail', () => ({ - sendMail: () => sendMailMock(), +const sendMailMock: (notification) => void = jest.fn() +jest.mock('@middleware/helpers/email/sendMail', () => ({ + sendMail: (notification) => sendMailMock(notification), })) const chatMessageTemplateMock = jest.fn() @@ -88,7 +88,7 @@ beforeAll(async () => { afterAll(async () => { await cleanDatabase() - driver.close() + await driver.close() }) beforeEach(async () => { @@ -195,8 +195,8 @@ describe('notifications', () => { beforeEach(async () => { jest.clearAllMocks() commentContent = 'Commenters comment.' - commentAuthor = await neode.create( - 'User', + commentAuthor = await Factory.build( + 'user', { id: 'commentAuthor', name: 'Mrs Comment', @@ -345,8 +345,8 @@ describe('notifications', () => { beforeEach(async () => { jest.clearAllMocks() - postAuthor = await neode.create( - 'User', + postAuthor = await Factory.build( + 'user', { id: 'postAuthor', name: 'Mrs Post', @@ -658,8 +658,8 @@ describe('notifications', () => { beforeEach(async () => { commentContent = 'One mention about me with @al-capone.' - commentAuthor = await neode.create( - 'User', + commentAuthor = await Factory.build( + 'user', { id: 'commentAuthor', name: 'Mrs Comment', @@ -673,15 +673,15 @@ describe('notifications', () => { }) it('sends only one notification with reason mentioned_in_comment', async () => { - postAuthor = await neode.create( - 'User', + postAuthor = await Factory.build( + 'user', { id: 'MrPostAuthor', name: 'Mr Author', slug: 'mr-author', }, { - email: 'post-author@example.org', + email: 'post-author2@example.org', password: '1234', }, ) @@ -756,8 +756,8 @@ describe('notifications', () => { await postAuthor.relateTo(notifiedUser, 'blocked') commentContent = 'One mention about me with @al-capone.' - commentAuthor = await neode.create( - 'User', + commentAuthor = await Factory.build( + 'user', { id: 'commentAuthor', name: 'Mrs Comment', @@ -807,8 +807,8 @@ describe('notifications', () => { await postAuthor.relateTo(notifiedUser, 'muted') commentContent = 'One mention about me with @al-capone.' - commentAuthor = await neode.create( - 'User', + commentAuthor = await Factory.build( + 'user', { id: 'commentAuthor', name: 'Mrs Comment', @@ -879,8 +879,8 @@ describe('notifications', () => { beforeEach(async () => { jest.clearAllMocks() - chatSender = await neode.create( - 'User', + chatSender = await Factory.build( + 'user', { id: 'chatSender', name: 'chatSender', @@ -931,7 +931,7 @@ describe('notifications', () => { content: 'Some nice message to chatReceiver', senderId: 'chatSender', username: 'chatSender', - avatar: null, + avatar: expect.any(String), date: expect.any(String), saved: true, distributed: false, @@ -967,7 +967,7 @@ describe('notifications', () => { content: 'Some nice message to chatReceiver', senderId: 'chatSender', username: 'chatSender', - avatar: null, + avatar: expect.any(String), date: expect.any(String), saved: true, distributed: false, @@ -1046,7 +1046,7 @@ describe('notifications', () => { content: 'Some nice message to chatReceiver', senderId: 'chatSender', username: 'chatSender', - avatar: null, + avatar: expect.any(String), date: expect.any(String), saved: true, distributed: false, diff --git a/backend/src/middleware/notifications/notificationsMiddleware.ts b/backend/src/middleware/notifications/notificationsMiddleware.ts index f7be031c8..4926dc94e 100644 --- a/backend/src/middleware/notifications/notificationsMiddleware.ts +++ b/backend/src/middleware/notifications/notificationsMiddleware.ts @@ -13,64 +13,32 @@ import { isUserOnline } from '@middleware/helpers/isUserOnline' import { validateNotifyUsers } from '@middleware/validation/validationMiddleware' // eslint-disable-next-line import/no-cycle import { getUnreadRoomsCount } from '@schema/resolvers/rooms' -// eslint-disable-next-line import/no-cycle import { pubsub, NOTIFICATION_ADDED, ROOM_COUNT_UPDATED, CHAT_MESSAGE_ADDED } from '@src/server' import extractMentionedUsers from './mentions/extractMentionedUsers' -const queryNotificationEmails = async (context, notificationUserIds) => { - if (!notificationUserIds?.length) return [] - const userEmailCypher = ` - MATCH (user: User) - // blocked users are filtered out from notifications already - WHERE user.id in $notificationUserIds - WITH user - MATCH (user)-[:PRIMARY_EMAIL]->(emailAddress:EmailAddress) - RETURN emailAddress {.email} - ` - const session = context.driver.session() - const writeTxResultPromise = session.readTransaction(async (transaction) => { - const emailAddressTransactionResponse = await transaction.run(userEmailCypher, { - notificationUserIds, - }) - return emailAddressTransactionResponse.records.map((record) => record.get('emailAddress')) - }) - try { - const emailAddresses = await writeTxResultPromise - return emailAddresses - } catch (error) { - throw new Error(error) - } finally { - session.close() - } -} - const publishNotifications = async ( context, - promises, + notificationsPromise, emailNotificationSetting: string, emailsSent: string[] = [], ): Promise
+
+
+
+
+
+
+
diff --git a/webapp/components/Badges.spec.js b/webapp/components/Badges.spec.js
index d19c2beb2..ae15e0b0a 100644
--- a/webapp/components/Badges.spec.js
+++ b/webapp/components/Badges.spec.js
@@ -1,29 +1,114 @@
-import { shallowMount } from '@vue/test-utils'
+import { render, screen, fireEvent } from '@testing-library/vue'
import Badges from './Badges.vue'
+const localVue = global.localVue
+
describe('Badges.vue', () => {
- let propsData
+ const Wrapper = (propsData) => {
+ return render(Badges, {
+ propsData,
+ localVue,
+ })
+ }
- beforeEach(() => {
- propsData = {}
- })
-
- describe('shallowMount', () => {
- const Wrapper = () => {
- return shallowMount(Badges, { propsData })
- }
-
- it('has class "hc-badges"', () => {
- expect(Wrapper().find('.hc-badges').exists()).toBe(true)
+ describe('without badges', () => {
+ it('renders in presentation mode', () => {
+ const wrapper = Wrapper({ badges: [], selectionMode: false })
+ expect(wrapper.container).toMatchSnapshot()
})
- describe('given a badge', () => {
+ it('renders in selection mode', () => {
+ const wrapper = Wrapper({ badges: [], selectionMode: true })
+ expect(wrapper.container).toMatchSnapshot()
+ })
+ })
+
+ describe('with badges', () => {
+ const badges = [
+ {
+ id: '1',
+ icon: '/path/to/some/icon',
+ isDefault: false,
+ description: 'Some description',
+ },
+ {
+ id: '2',
+ icon: '/path/to/another/icon',
+ isDefault: true,
+ description: 'Another description',
+ },
+ {
+ id: '3',
+ icon: '/path/to/third/icon',
+ isDefault: false,
+ description: 'Third description',
+ },
+ ]
+
+ describe('in presentation mode', () => {
+ let wrapper
+
beforeEach(() => {
- propsData.badges = [{ id: '1', icon: '/path/to/some/icon' }]
+ wrapper = Wrapper({ badges, scale: 1.2, selectionMode: false })
})
- it('proxies badge icon, which is just a URL without metadata', () => {
- expect(Wrapper().find('img[src="/api/path/to/some/icon"]').exists()).toBe(true)
+ it('renders', () => {
+ expect(wrapper.container).toMatchSnapshot()
+ })
+
+ it('clicking on second badge does nothing', async () => {
+ const badge = screen.getByTitle(badges[1].description)
+ await fireEvent.click(badge)
+ expect(wrapper.emitted()).toEqual({})
+ })
+ })
+
+ describe('in selection mode', () => {
+ let wrapper
+
+ beforeEach(() => {
+ wrapper = Wrapper({ badges, scale: 1.2, selectionMode: true })
+ })
+
+ it('renders', () => {
+ expect(wrapper.container).toMatchSnapshot()
+ })
+
+ it('clicking on first badge does nothing', async () => {
+ const badge = screen.getByTitle(badges[0].description)
+ await fireEvent.click(badge)
+ expect(wrapper.emitted()).toEqual({})
+ })
+
+ describe('clicking on second badge', () => {
+ beforeEach(async () => {
+ const badge = screen.getByTitle(badges[1].description)
+ await fireEvent.click(badge)
+ })
+
+ it('selects badge', () => {
+ expect(wrapper.container).toMatchSnapshot()
+ })
+
+ it('emits badge-selected with index', async () => {
+ expect(wrapper.emitted()['badge-selected']).toEqual([[1]])
+ })
+ })
+
+ describe('clicking twice on second badge', () => {
+ beforeEach(async () => {
+ const badge = screen.getByTitle(badges[1].description)
+ await fireEvent.click(badge)
+ await fireEvent.click(badge)
+ })
+
+ it('deselects badge', () => {
+ expect(wrapper.container).toMatchSnapshot()
+ })
+
+ it('emits badge-selected with null', async () => {
+ expect(wrapper.emitted()['badge-selected']).toEqual([[1], [null]])
+ })
})
})
})
diff --git a/webapp/components/Badges.vue b/webapp/components/Badges.vue
index d569452c7..0fdf065c3 100644
--- a/webapp/components/Badges.vue
+++ b/webapp/components/Badges.vue
@@ -1,69 +1,173 @@
-
+ ![]()
+
diff --git a/webapp/components/__snapshots__/BadgeSelection.spec.js.snap b/webapp/components/__snapshots__/BadgeSelection.spec.js.snap
new file mode 100644
index 000000000..a31d547c9
--- /dev/null
+++ b/webapp/components/__snapshots__/BadgeSelection.spec.js.snap
@@ -0,0 +1,84 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Badges.vue with badges renders 1`] = `
+
- ![]()
-
+
+
+`;
+
+exports[`Badges.vue without badges renders 1`] = `
+
+
+
+
+
+
+
+
+`;
diff --git a/webapp/components/__snapshots__/Badges.spec.js.snap b/webapp/components/__snapshots__/Badges.spec.js.snap
new file mode 100644
index 000000000..425d2ace7
--- /dev/null
+++ b/webapp/components/__snapshots__/Badges.spec.js.snap
@@ -0,0 +1,165 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Badges.vue with badges in presentation mode renders 1`] = `
+
+
+`;
+
+exports[`Badges.vue with badges in selection mode clicking on second badge selects badge 1`] = `
+
+
+
+ 
+
+
+ 
+
+
+ 
+
+
+
+`;
+
+exports[`Badges.vue with badges in selection mode clicking twice on second badge deselects badge 1`] = `
+
+
+
+
+
+
+
+
+
+`;
+
+exports[`Badges.vue with badges in selection mode renders 1`] = `
+
+
+
+
+
+
+
+
+
+`;
+
+exports[`Badges.vue without badges renders in presentation mode 1`] = `
+
+
+
+
+
+
+
+
+
+
+`;
+
+exports[`Badges.vue without badges renders in selection mode 1`] = `
+
+
+
+`;
diff --git a/webapp/components/_new/features/Admin/Badges/BadgesSection.spec.js b/webapp/components/_new/features/Admin/Badges/BadgesSection.spec.js
index 8baddc692..8abf8d679 100644
--- a/webapp/components/_new/features/Admin/Badges/BadgesSection.spec.js
+++ b/webapp/components/_new/features/Admin/Badges/BadgesSection.spec.js
@@ -21,26 +21,41 @@ const badge2 = {
describe('Admin/BadgesSection', () => {
let wrapper
- const Wrapper = () => {
+ const Wrapper = (withBadges = true) => {
return render(BadgesSection, {
localVue,
propsData: {
- badges: [badge1, badge2],
+ badges: withBadges ? [badge1, badge2] : [],
+ },
+ mocks: {
+ $t: jest.fn((t) => t),
},
})
}
- beforeEach(() => {
- wrapper = Wrapper()
+ describe('without badges', () => {
+ beforeEach(() => {
+ wrapper = Wrapper(false)
+ })
+
+ it('renders', () => {
+ expect(wrapper.baseElement).toMatchSnapshot()
+ })
})
- it('renders', () => {
- expect(wrapper.baseElement).toMatchSnapshot()
- })
+ describe('with badges', () => {
+ beforeEach(() => {
+ wrapper = Wrapper(true)
+ })
- it('emits toggleButton', async () => {
- const button = screen.getByAltText(badge1.description)
- await fireEvent.click(button)
- expect(wrapper.emitted().toggleBadge[0][0]).toEqual(badge1)
+ it('renders', () => {
+ expect(wrapper.baseElement).toMatchSnapshot()
+ })
+
+ it('emits toggleButton', async () => {
+ const button = screen.getByAltText(badge1.description)
+ await fireEvent.click(button)
+ expect(wrapper.emitted().toggleBadge[0][0]).toEqual(badge1)
+ })
})
})
diff --git a/webapp/components/_new/features/Admin/Badges/BadgesSection.vue b/webapp/components/_new/features/Admin/Badges/BadgesSection.vue
index 8ff9da7ed..fc89d2a50 100644
--- a/webapp/components/_new/features/Admin/Badges/BadgesSection.vue
+++ b/webapp/components/_new/features/Admin/Badges/BadgesSection.vue
@@ -1,16 +1,19 @@
{{ title }}
-
+
+
diff --git a/webapp/components/_new/features/Admin/Badges/__snapshots__/BadgesSection.spec.js.snap b/webapp/components/_new/features/Admin/Badges/__snapshots__/BadgesSection.spec.js.snap
index c09a50725..a78f44edc 100644
--- a/webapp/components/_new/features/Admin/Badges/__snapshots__/BadgesSection.spec.js.snap
+++ b/webapp/components/_new/features/Admin/Badges/__snapshots__/BadgesSection.spec.js.snap
@@ -1,6 +1,6 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
-exports[`Admin/BadgesSection renders 1`] = `
+exports[`Admin/BadgesSection with badges renders 1`] = `
+ {{ $t('admin.badges.noBadges') }}
+
`;
+
+exports[`Admin/BadgesSection without badges renders 1`] = `
+
+ {{ $t('admin.badges.description') }}
-
+
userBadge.id === badge.id),
}))
},
+ isLoadingBadges() {
+ return this.$apollo.queries.Badge.loading
+ },
},
methods: {
toggleBadge(badge) {
diff --git a/webapp/pages/admin/users/index.spec.js b/webapp/pages/admin/users/index.spec.js
index 8d6b923c5..85e8789b8 100644
--- a/webapp/pages/admin/users/index.spec.js
+++ b/webapp/pages/admin/users/index.spec.js
@@ -10,11 +10,9 @@ const stubs = {
describe('Users', () => {
let wrapper
- let Wrapper
- let getters
const mocks = {
- $t: jest.fn(),
+ $t: jest.fn((t) => t),
$apollo: {
loading: false,
mutate: jest
@@ -38,116 +36,154 @@ describe('Users', () => {
},
}
- describe('mount', () => {
- getters = {
- 'auth/isAdmin': () => true,
- 'auth/user': () => {
- return { id: 'admin' }
- },
- }
+ const getters = {
+ 'auth/isAdmin': () => true,
+ 'auth/user': () => {
+ return { id: 'admin' }
+ },
+ }
- Wrapper = () => {
- const store = new Vuex.Store({ getters })
- return mount(Users, {
- mocks,
- localVue,
- store,
- stubs,
- })
- }
+ const Wrapper = () => {
+ const store = new Vuex.Store({ getters })
+ return mount(Users, {
+ mocks,
+ localVue,
+ store,
+ stubs,
+ data: () => ({
+ User: [
+ {
+ id: 'user',
+ email: 'user@example.org',
+ name: 'User',
+ role: 'moderator',
+ slug: 'user',
+ },
+ {
+ id: 'user2',
+ email: 'user2@example.org',
+ name: 'User',
+ role: 'moderator',
+ slug: 'user',
+ },
+ ],
+ }),
+ })
+ }
+
+ describe('given badges are enabled', () => {
+ beforeEach(() => {
+ mocks.$env = {
+ BADGES_ENABLED: true,
+ }
+ wrapper = Wrapper()
+ })
it('renders', () => {
+ expect(wrapper.element).toMatchSnapshot()
+ })
+ })
+
+ describe('given badges are disabled', () => {
+ beforeEach(() => {
+ mocks.$env = {
+ BADGES_ENABLED: false,
+ }
wrapper = Wrapper()
- expect(wrapper.element.tagName).toBe('DIV')
})
- describe('search', () => {
- let searchAction
- beforeEach(() => {
- searchAction = (wrapper, { query }) => {
- wrapper.find('input').setValue(query)
- wrapper.find('form').trigger('submit')
- return wrapper
- }
+ it('renders', () => {
+ expect(wrapper.element).toMatchSnapshot()
+ })
+ })
+
+ describe('search', () => {
+ let searchAction
+ beforeEach(() => {
+ wrapper = Wrapper()
+ searchAction = (wrapper, { query }) => {
+ wrapper.find('input').setValue(query)
+ wrapper.find('form').trigger('submit')
+ return wrapper
+ }
+ })
+
+ describe('query looks like an email address', () => {
+ it('searches users for exact email address', async () => {
+ const wrapper = await searchAction(Wrapper(), { query: 'email@example.org' })
+ expect(wrapper.vm.email).toEqual('email@example.org')
+ expect(wrapper.vm.filter).toBe(null)
})
- describe('query looks like an email address', () => {
- it('searches users for exact email address', async () => {
- const wrapper = await searchAction(Wrapper(), { query: 'email@example.org' })
- expect(wrapper.vm.email).toEqual('email@example.org')
- expect(wrapper.vm.filter).toBe(null)
- })
-
- it('email address is case-insensitive', async () => {
- const wrapper = await searchAction(Wrapper(), { query: 'eMaiL@example.org' })
- expect(wrapper.vm.email).toEqual('email@example.org')
- expect(wrapper.vm.filter).toBe(null)
- })
- })
-
- describe('query is just text', () => {
- it('tries to find matching users by `name`, `slug` or `about`', async () => {
- const wrapper = await searchAction(await Wrapper(), { query: 'Find me' })
- const expected = {
- OR: [
- { name_contains: 'Find me' },
- { slug_contains: 'Find me' },
- { about_contains: 'Find me' },
- ],
- }
- expect(wrapper.vm.email).toBe(null)
- expect(wrapper.vm.filter).toEqual(expected)
- })
+ it('email address is case-insensitive', async () => {
+ const wrapper = await searchAction(Wrapper(), { query: 'eMaiL@example.org' })
+ expect(wrapper.vm.email).toEqual('email@example.org')
+ expect(wrapper.vm.filter).toBe(null)
})
})
- describe('change roles', () => {
- beforeAll(() => {
- wrapper = Wrapper()
- wrapper.setData({
- User: [
- {
- id: 'admin',
- email: 'admin@example.org',
- name: 'Admin',
- role: 'admin',
- slug: 'admin',
- },
- {
- id: 'user',
- email: 'user@example.org',
- name: 'User',
- role: 'user',
- slug: 'user',
- },
+ describe('query is just text', () => {
+ it('tries to find matching users by `name`, `slug` or `about`', async () => {
+ const wrapper = await searchAction(await Wrapper(), { query: 'Find me' })
+ const expected = {
+ OR: [
+ { name_contains: 'Find me' },
+ { slug_contains: 'Find me' },
+ { about_contains: 'Find me' },
],
- userRoles: ['user', 'moderator', 'admin'],
- })
- })
-
- it('cannot change own role', () => {
- const adminRow = wrapper.findAll('tr').at(1)
- expect(adminRow.find('select').exists()).toBe(false)
- })
-
- it('changes the role of another user', () => {
- const userRow = wrapper.findAll('tr').at(2)
- userRow.findAll('option').at(1).setSelected()
- expect(mocks.$apollo.mutate).toHaveBeenCalledWith(
- expect.objectContaining({
- variables: {
- id: 'user',
- role: 'moderator',
- },
- }),
- )
- })
-
- it('toasts a success message after role has changed', () => {
- const userRow = wrapper.findAll('tr').at(2)
- userRow.findAll('option').at(1).setSelected()
- expect(mocks.$toast.success).toHaveBeenCalled()
+ }
+ expect(wrapper.vm.email).toBe(null)
+ expect(wrapper.vm.filter).toEqual(expected)
})
})
})
+
+ describe('change roles', () => {
+ beforeAll(() => {
+ wrapper = Wrapper()
+ wrapper.setData({
+ User: [
+ {
+ id: 'admin',
+ email: 'admin@example.org',
+ name: 'Admin',
+ role: 'admin',
+ slug: 'admin',
+ },
+ {
+ id: 'user',
+ email: 'user@example.org',
+ name: 'User',
+ role: 'user',
+ slug: 'user',
+ },
+ ],
+ userRoles: ['user', 'moderator', 'admin'],
+ })
+ })
+
+ it('cannot change own role', () => {
+ const adminRow = wrapper.findAll('tr').at(1)
+ expect(adminRow.find('select').exists()).toBe(false)
+ })
+
+ it('changes the role of another user', () => {
+ const userRow = wrapper.findAll('tr').at(2)
+ userRow.findAll('option').at(1).setSelected()
+ expect(mocks.$apollo.mutate).toHaveBeenCalledWith(
+ expect.objectContaining({
+ variables: {
+ id: 'user',
+ role: 'moderator',
+ },
+ }),
+ )
+ })
+
+ it('toasts a success message after role has changed', () => {
+ const userRow = wrapper.findAll('tr').at(2)
+ userRow.findAll('option').at(1).setSelected()
+ expect(mocks.$toast.success).toHaveBeenCalled()
+ })
+ })
})
diff --git a/webapp/pages/admin/users/index.vue b/webapp/pages/admin/users/index.vue
index 24258a57f..0bd592bad 100644
--- a/webapp/pages/admin/users/index.vue
+++ b/webapp/pages/admin/users/index.vue
@@ -70,7 +70,7 @@
params: { id: scope.row.id },
}"
>
- {{ $t('admin.users.table.edit') }}
+
-
+
+
@@ -266,6 +269,10 @@ export default {
user() {
return this.User ? this.User[0] : {}
},
+ userBadges() {
+ if (!this.$env.BADGES_ENABLED) return null
+ return [this.user.badgeVerification, ...(this.user.badgeTrophiesSelected || [])]
+ },
userName() {
const { name } = this.user || {}
return name || this.$t('profile.userAnonym')
@@ -456,6 +463,12 @@ export default {
margin: auto;
margin-top: -60px;
}
+.badge-edit-link {
+ transition: all 0.2s ease-out;
+ &:hover {
+ opacity: 0.7;
+ }
+}
.page-name-profile-id-slug {
.ds-flex-item:first-child .content-menu {
position: absolute;
diff --git a/webapp/pages/registration.spec.js b/webapp/pages/registration.spec.js
index b34ba3ba7..8be08fa5e 100644
--- a/webapp/pages/registration.spec.js
+++ b/webapp/pages/registration.spec.js
@@ -313,7 +313,7 @@ describe('Registration', () => {
it('renders', async () => {
wrapper = await Wrapper()
- expect(wrapper.classes('registration-slider')).toBe(true)
+ expect(wrapper.find('.registration-slider')).toBeTruthy()
})
// The asyncTests must go last
diff --git a/webapp/pages/settings.spec.js b/webapp/pages/settings.spec.js
index 0f3c6e22c..8c2917c90 100644
--- a/webapp/pages/settings.spec.js
+++ b/webapp/pages/settings.spec.js
@@ -1,4 +1,4 @@
-import { mount } from '@vue/test-utils'
+import { render } from '@testing-library/vue'
import settings from './settings.vue'
const localVue = global.localVue
@@ -17,21 +17,37 @@ describe('settings.vue', () => {
}
})
- describe('mount', () => {
- const Wrapper = () => {
- return mount(settings, {
- mocks,
- localVue,
- stubs,
- })
- }
+ const Wrapper = () => {
+ return render(settings, {
+ mocks,
+ localVue,
+ stubs,
+ })
+ }
+ describe('given badges are enabled', () => {
beforeEach(() => {
+ mocks.$env = {
+ BADGES_ENABLED: true,
+ }
wrapper = Wrapper()
})
it('renders', () => {
- expect(wrapper.element.tagName).toBe('DIV')
+ expect(wrapper.container).toMatchSnapshot()
+ })
+ })
+
+ describe('given badges are disabled', () => {
+ beforeEach(() => {
+ mocks.$env = {
+ BADGES_ENABLED: false,
+ }
+ wrapper = Wrapper()
+ })
+
+ it('renders', () => {
+ expect(wrapper.container).toMatchSnapshot()
})
})
})
diff --git a/webapp/pages/settings.vue b/webapp/pages/settings.vue
index 5d526c3cc..e1181650e 100644
--- a/webapp/pages/settings.vue
+++ b/webapp/pages/settings.vue
@@ -21,7 +21,7 @@
export default {
computed: {
routes() {
- return [
+ const routes = [
{
name: this.$t('settings.data.name'),
path: `/settings`,
@@ -83,6 +83,15 @@ export default {
},
} */
]
+
+ if (this.$env.BADGES_ENABLED) {
+ routes.splice(2, 0, {
+ name: this.$t('settings.badges.name'),
+ path: `/settings/badges`,
+ })
+ }
+
+ return routes
},
},
}
diff --git a/webapp/pages/settings/__snapshots__/badges.spec.js.snap b/webapp/pages/settings/__snapshots__/badges.spec.js.snap
new file mode 100644
index 000000000..4f80bc37e
--- /dev/null
+++ b/webapp/pages/settings/__snapshots__/badges.spec.js.snap
@@ -0,0 +1,429 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`badge settings with badges more badges available selecting an empty slot shows list with available badges 1`] = `
+
-
-
-
-
-
+
+
diff --git a/webapp/pages/settings/badges.spec.js b/webapp/pages/settings/badges.spec.js
new file mode 100644
index 000000000..291fd75d6
--- /dev/null
+++ b/webapp/pages/settings/badges.spec.js
@@ -0,0 +1,302 @@
+import { render, screen, fireEvent } from '@testing-library/vue'
+import '@testing-library/jest-dom'
+import badges from './badges.vue'
+
+const localVue = global.localVue
+
+describe('badge settings', () => {
+ let mocks
+
+ const apolloMutateMock = jest.fn()
+
+ const Wrapper = () => {
+ return render(badges, {
+ localVue,
+ mocks,
+ })
+ }
+
+ beforeEach(() => {
+ mocks = {
+ $t: jest.fn((t) => t),
+ $toast: {
+ success: jest.fn(),
+ error: jest.fn(),
+ },
+ $apollo: {
+ mutate: apolloMutateMock,
+ },
+ }
+ })
+
+ describe('without badges', () => {
+ beforeEach(() => {
+ mocks.$store = {
+ getters: {
+ 'auth/isModerator': () => false,
+ 'auth/user': {
+ id: 'u23',
+ badgeVerification: {
+ id: 'bv1',
+ icon: '/verification/icon',
+ description: 'Verification description',
+ isDefault: true,
+ },
+ badgeTrophiesSelected: [],
+ badgeTrophiesUnused: [],
+ },
+ },
+ }
+ })
+
+ it('renders', () => {
+ const wrapper = Wrapper()
+ expect(wrapper.container).toMatchSnapshot()
+ })
+ })
+
+ describe('with badges', () => {
+ const badgeTrophiesSelected = [
+ {
+ id: '1',
+ icon: '/path/to/some/icon',
+ isDefault: false,
+ description: 'Some description',
+ },
+ {
+ id: '2',
+ icon: '/path/to/empty/icon',
+ isDefault: true,
+ description: 'Empty',
+ },
+ {
+ id: '3',
+ icon: '/path/to/third/icon',
+ isDefault: false,
+ description: 'Third description',
+ },
+ ]
+
+ const badgeTrophiesUnused = [
+ {
+ id: '4',
+ icon: '/path/to/fourth/icon',
+ description: 'Fourth description',
+ },
+ {
+ id: '5',
+ icon: '/path/to/fifth/icon',
+ description: 'Fifth description',
+ },
+ ]
+
+ let wrapper
+
+ beforeEach(() => {
+ mocks.$store = {
+ getters: {
+ 'auth/isModerator': () => false,
+ 'auth/user': {
+ id: 'u23',
+ badgeVerification: {
+ id: 'bv1',
+ icon: '/verification/icon',
+ description: 'Verification description',
+ isDefault: false,
+ },
+ badgeTrophiesSelected,
+ badgeTrophiesUnused,
+ },
+ },
+ }
+ wrapper = Wrapper()
+ })
+
+ it('renders', () => {
+ expect(wrapper.container).toMatchSnapshot()
+ })
+
+ describe('selecting a used badge', () => {
+ beforeEach(async () => {
+ const badge = screen.getByTitle(badgeTrophiesSelected[0].description)
+ await fireEvent.click(badge)
+ })
+
+ it('shows remove badge button', () => {
+ expect(screen.getByText('settings.badges.remove')).toBeInTheDocument()
+ })
+
+ describe('clicking remove badge button', () => {
+ const clickButton = async () => {
+ const removeButton = screen.getByText('settings.badges.remove')
+ await fireEvent.click(removeButton)
+ }
+
+ describe('with successful server request', () => {
+ beforeEach(() => {
+ apolloMutateMock.mockResolvedValue({
+ data: {
+ setTrophyBadgeSelected: {
+ id: 'u23',
+ badgeTrophiesSelected: [
+ {
+ id: '2',
+ icon: '/path/to/empty/icon',
+ isDefault: true,
+ description: 'Empty',
+ },
+ {
+ id: '2',
+ icon: '/path/to/empty/icon',
+ isDefault: true,
+ description: 'Empty',
+ },
+ {
+ id: '3',
+ icon: '/path/to/third/icon',
+ isDefault: false,
+ description: 'Third description',
+ },
+ ],
+ },
+ },
+ })
+ clickButton()
+ })
+
+ it('calls the server', () => {
+ expect(apolloMutateMock).toHaveBeenCalledWith({
+ mutation: expect.anything(),
+ update: expect.anything(),
+ variables: {
+ badgeId: null,
+ slot: 0,
+ },
+ })
+ })
+
+ /* To test this, we would need a better apollo mock */
+ it.skip('removes the badge', async () => {
+ expect(wrapper.container).toMatchSnapshot()
+ })
+
+ it('shows a success message', () => {
+ expect(mocks.$toast.success).toHaveBeenCalledWith('settings.badges.success-update')
+ })
+ })
+
+ describe('with failed server request', () => {
+ beforeEach(() => {
+ apolloMutateMock.mockRejectedValue({ message: 'Ouch!' })
+ clickButton()
+ })
+
+ it('shows an error message', () => {
+ expect(mocks.$toast.error).toHaveBeenCalledWith('settings.badges.error-update')
+ })
+ })
+ })
+ })
+
+ describe('no more badges available', () => {
+ beforeEach(async () => {
+ mocks.$store.getters['auth/user'].badgeTrophiesUnused = []
+ })
+
+ describe('selecting an empty slot', () => {
+ beforeEach(async () => {
+ const emptySlot = screen.getAllByTitle('Empty')[0]
+ await fireEvent.click(emptySlot)
+ })
+
+ it('shows no more badges available message', () => {
+ expect(wrapper.container).toMatchSnapshot()
+ })
+ })
+ })
+
+ describe('more badges available', () => {
+ describe('selecting an empty slot', () => {
+ beforeEach(async () => {
+ const emptySlot = screen.getAllByTitle('Empty')[0]
+ await fireEvent.click(emptySlot)
+ })
+
+ it('shows list with available badges', () => {
+ expect(wrapper.container).toMatchSnapshot()
+ })
+
+ describe('clicking on an available badge', () => {
+ const clickBadge = async () => {
+ const badge = screen.getByText(badgeTrophiesUnused[0].description)
+ await fireEvent.click(badge)
+ }
+
+ describe('with successful server request', () => {
+ beforeEach(() => {
+ apolloMutateMock.mockResolvedValue({
+ data: {
+ setTrophyBadgeSelected: {
+ id: 'u23',
+ badgeTrophiesSelected: [
+ {
+ id: '4',
+ icon: '/path/to/fourth/icon',
+ description: 'Fourth description',
+ isDefault: false,
+ },
+ {
+ id: '2',
+ icon: '/path/to/empty/icon',
+ isDefault: true,
+ description: 'Empty',
+ },
+ {
+ id: '3',
+ icon: '/path/to/third/icon',
+ isDefault: false,
+ description: 'Third description',
+ },
+ ],
+ },
+ },
+ })
+ clickBadge()
+ })
+
+ it('calls the server', () => {
+ expect(apolloMutateMock).toHaveBeenCalledWith({
+ mutation: expect.anything(),
+ update: expect.anything(),
+ variables: {
+ badgeId: '4',
+ slot: 1,
+ },
+ })
+ })
+
+ /* To test this, we would need a better apollo mock */
+ it.skip('adds the badge', async () => {
+ expect(wrapper.container).toMatchSnapshot()
+ })
+
+ it('shows a success message', () => {
+ expect(mocks.$toast.success).toHaveBeenCalledWith('settings.badges.success-update')
+ })
+ })
+
+ describe('with failed server request', () => {
+ beforeEach(() => {
+ apolloMutateMock.mockRejectedValue({ message: 'Ouch!' })
+ clickBadge()
+ })
+
+ it('shows an error message', () => {
+ expect(mocks.$toast.error).toHaveBeenCalledWith('settings.badges.error-update')
+ })
+ })
+ })
+ })
+ })
+ })
+})
diff --git a/webapp/pages/settings/badges.vue b/webapp/pages/settings/badges.vue
new file mode 100644
index 000000000..3f0e7c7e7
--- /dev/null
+++ b/webapp/pages/settings/badges.vue
@@ -0,0 +1,176 @@
+
+
+
+
+
+
+
+
+
+
diff --git a/webapp/static/img/badges/stars.svg b/webapp/static/img/badges/stars.svg
new file mode 100644
index 000000000..44d64a5f4
--- /dev/null
+++ b/webapp/static/img/badges/stars.svg
@@ -0,0 +1,11 @@
+
+
+
diff --git a/webapp/yarn.lock b/webapp/yarn.lock
index 1ef19363e..e17834008 100644
--- a/webapp/yarn.lock
+++ b/webapp/yarn.lock
@@ -7,6 +7,11 @@
resolved "https://registry.yarnpkg.com/@aashutoshrathi/word-wrap/-/word-wrap-1.2.6.tgz#bd9154aec9983f77b3a034ecaa015c2e4201f6cf"
integrity sha512-1Yjs2SvM8TflER/OD3cOjhWWOZb58A2t7wpE2S9XfBYTiIl+XFhQG2bjy4Pu1I+EAlCNUzRDYDdFwFYUKvXcIA==
+"@adobe/css-tools@^4.4.0":
+ version "4.4.2"
+ resolved "https://registry.yarnpkg.com/@adobe/css-tools/-/css-tools-4.4.2.tgz#c836b1bd81e6d62cd6cdf3ee4948bcdce8ea79c8"
+ integrity sha512-baYZExFpsdkBNuvGKTKWCwKH57HRZLVtycZS05WTQNVOiXVSeAki3nU35zlRbToeMW8aHlJfyS+1C4BOv27q0A==
+
"@ampproject/remapping@^2.2.0":
version "2.2.1"
resolved "https://registry.yarnpkg.com/@ampproject/remapping/-/remapping-2.2.1.tgz#99e8e11851128b8702cd57c33684f1d0f260b630"
@@ -4253,6 +4258,19 @@
lz-string "^1.5.0"
pretty-format "^27.0.2"
+"@testing-library/jest-dom@^6.6.3":
+ version "6.6.3"
+ resolved "https://registry.yarnpkg.com/@testing-library/jest-dom/-/jest-dom-6.6.3.tgz#26ba906cf928c0f8172e182c6fe214eb4f9f2bd2"
+ integrity sha512-IteBhl4XqYNkM54f4ejhLRJiZNqcSCoXUOG2CPK7qbD322KjQozM4kHQOfkG2oln9b9HTYqs+Sae8vBATubxxA==
+ dependencies:
+ "@adobe/css-tools" "^4.4.0"
+ aria-query "^5.0.0"
+ chalk "^3.0.0"
+ css.escape "^1.5.1"
+ dom-accessibility-api "^0.6.3"
+ lodash "^4.17.21"
+ redent "^3.0.0"
+
"@testing-library/vue@5":
version "5.9.0"
resolved "https://registry.yarnpkg.com/@testing-library/vue/-/vue-5.9.0.tgz#d33c52ae89e076808abe622f70dcbccb1b5d080c"
@@ -6058,6 +6076,11 @@ aria-query@5.1.3:
dependencies:
deep-equal "^2.0.5"
+aria-query@^5.0.0:
+ version "5.3.2"
+ resolved "https://registry.yarnpkg.com/aria-query/-/aria-query-5.3.2.tgz#93f81a43480e33a338f19163a3d10a50c01dcd59"
+ integrity sha512-COROpnaoap1E2F000S62r6A60uHZnmlvomhfyT2DlTcrY1OrBKn2UhH7qn5wTC9zMvD0AY7csdPSNwKP+7WiQw==
+
arr-diff@^4.0.0:
version "4.0.0"
resolved "https://registry.yarnpkg.com/arr-diff/-/arr-diff-4.0.0.tgz#d6461074febfec71e7e15235761a329a5dc7c520"
@@ -8230,6 +8253,11 @@ css-what@2.1, css-what@^2.1.2:
resolved "https://registry.yarnpkg.com/css-what/-/css-what-2.1.3.tgz#a6d7604573365fe74686c3f311c56513d88285f2"
integrity sha512-a+EPoD+uZiNfh+5fxw2nO9QwFa6nJe2Or35fGY6Ipw1R3R4AGz1d1TEZrCegvw2YTmZ0jXirGYlzxxpYSHwpEg==
+css.escape@^1.5.1:
+ version "1.5.1"
+ resolved "https://registry.yarnpkg.com/css.escape/-/css.escape-1.5.1.tgz#42e27d4fa04ae32f931a4b4d4191fa9cddee97cb"
+ integrity sha512-YUifsXXuknHlUsmlgyY0PKzgPOr7/FjCePfHNt0jxm83wHZi44VDMQ7/fGNkjY3/jV1MC+1CmZbaHzugyeRtpg==
+
csscolorparser@~1.0.3:
version "1.0.3"
resolved "https://registry.yarnpkg.com/csscolorparser/-/csscolorparser-1.0.3.tgz#b34f391eea4da8f3e98231e2ccd8df9c041f171b"
@@ -8793,6 +8821,11 @@ dom-accessibility-api@^0.5.9:
resolved "https://registry.yarnpkg.com/dom-accessibility-api/-/dom-accessibility-api-0.5.16.tgz#5a7429e6066eb3664d911e33fb0e45de8eb08453"
integrity sha512-X7BJ2yElsnOJ30pZF4uIIDfBEVgF4XEBxL9Bxhy6dnrm5hkzqmsWHGTiHqRiITNhMyFLyAiWndIJP7Z1NTteDg==
+dom-accessibility-api@^0.6.3:
+ version "0.6.3"
+ resolved "https://registry.yarnpkg.com/dom-accessibility-api/-/dom-accessibility-api-0.6.3.tgz#993e925cc1d73f2c662e7d75dd5a5445259a8fd8"
+ integrity sha512-7ZgogeTnjuHbo+ct10G9Ffp0mif17idi0IyWNVA/wcwcm7NPOD/WEHVP3n7n3MhXqxoIYm8d6MuZohYWIZ4T3w==
+
dom-converter@^0.2:
version "0.2.0"
resolved "https://registry.yarnpkg.com/dom-converter/-/dom-converter-0.2.0.tgz#6721a9daee2e293682955b6afe416771627bb768"
diff --git a/yarn.lock b/yarn.lock
index a5a09d086..1e3983be3 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -4074,10 +4074,10 @@ cypress-network-idle@^1.15.0:
resolved "https://registry.yarnpkg.com/cypress-network-idle/-/cypress-network-idle-1.15.0.tgz#e249f08695a46f1ddce18a95d5293937f277cbb3"
integrity sha512-8zU16zhc7S3nMl1NTEEcNsZYlJy/ZzP2zPTTrngGxyXH32Ipake/xfHLZsgrzeWCieiS2AVhQsakhWqFzO3hpw==
-cypress@^14.3.1:
- version "14.3.1"
- resolved "https://registry.yarnpkg.com/cypress/-/cypress-14.3.1.tgz#b0570c0e5b198d930a2c0f640d099e777bec2d2f"
- integrity sha512-/2q06qvHMK3PNiadnRW1Je0lJ43gAFPQJUAK2zIxjr22kugtWxVQznTBLVu1AvRH+RP3oWZhCdWqiEi+0NuqCg==
+cypress@^14.3.2:
+ version "14.3.2"
+ resolved "https://registry.yarnpkg.com/cypress/-/cypress-14.3.2.tgz#04a6ea66c1715119ef41dda5851d75801cc1e226"
+ integrity sha512-n+yGD2ZFFKgy7I3YtVpZ7BcFYrrDMcKj713eOZdtxPttpBjCyw/R8dLlFSsJPouneGN7A/HOSRyPJ5+3/gKDoA==
dependencies:
"@cypress/request" "^3.0.8"
"@cypress/xvfb" "^1.2.4"
+
+
+`;
diff --git a/webapp/config/index.js b/webapp/config/index.js
index 5da17010b..fb275a8ec 100644
--- a/webapp/config/index.js
+++ b/webapp/config/index.js
@@ -35,6 +35,7 @@ const options = {
COOKIE_EXPIRE_TIME: process.env.COOKIE_EXPIRE_TIME || 730, // Two years by default
COOKIE_HTTPS_ONLY: process.env.COOKIE_HTTPS_ONLY || process.env.NODE_ENV === 'production', // ensure true in production if not set explicitly
CATEGORIES_ACTIVE: process.env.CATEGORIES_ACTIVE === 'true' || false,
+ BADGES_ENABLED: process.env.BADGES_ENABLED === 'true' || false,
}
const CONFIG = {
diff --git a/webapp/graphql/Fragments.js b/webapp/graphql/Fragments.js
index d0ad8a0fe..77af830e8 100644
--- a/webapp/graphql/Fragments.js
+++ b/webapp/graphql/Fragments.js
@@ -26,9 +26,15 @@ export const locationFragment = (lang) => gql`
export const badgesFragment = gql`
fragment badges on User {
- badgeTrophies {
+ badgeTrophiesSelected {
id
icon
+ description
+ }
+ badgeVerification {
+ id
+ icon
+ description
}
}
`
diff --git a/webapp/graphql/User.js b/webapp/graphql/User.js
index 147e93c6f..75342ef2a 100644
--- a/webapp/graphql/User.js
+++ b/webapp/graphql/User.js
@@ -405,6 +405,22 @@ export const currentUserQuery = gql`
query {
currentUser {
...user
+ badgeTrophiesSelected {
+ id
+ icon
+ description
+ isDefault
+ }
+ badgeTrophiesUnused {
+ id
+ icon
+ description
+ }
+ badgeVerification {
+ id
+ icon
+ description
+ }
email
role
about
@@ -466,3 +482,43 @@ export const userDataQuery = (i18n) => {
}
`
}
+
+export const setTrophyBadgeSelected = gql`
+ mutation ($slot: Int!, $badgeId: ID) {
+ setTrophyBadgeSelected(slot: $slot, badgeId: $badgeId) {
+ badgeTrophiesCount
+ badgeTrophiesSelected {
+ id
+ icon
+ description
+ isDefault
+ }
+ badgeTrophiesUnused {
+ id
+ icon
+ description
+ }
+ badgeTrophiesUnusedCount
+ }
+ }
+`
+
+export const resetTrophyBadgesSelected = gql`
+ mutation {
+ resetTrophyBadgesSelected {
+ badgeTrophiesCount
+ badgeTrophiesSelected {
+ id
+ icon
+ description
+ isDefault
+ }
+ badgeTrophiesUnused {
+ id
+ icon
+ description
+ }
+ badgeTrophiesUnusedCount
+ }
+ }
+`
diff --git a/webapp/locales/de.json b/webapp/locales/de.json
index 21590e556..71e792aa0 100644
--- a/webapp/locales/de.json
+++ b/webapp/locales/de.json
@@ -12,6 +12,7 @@
"admin": {
"badges": {
"description": "Stelle die verfügbaren Auszeichnungen für diesen Nutzer ein.",
+ "noBadges": "Keine Auszeichnungen vorhanden.",
"revokeTrophy": {
"error": "Trophäe konnte nicht widerrufen werden!",
"success": "Trophäe erfolgreich widerrufen"
@@ -97,8 +98,7 @@
"number": "Nr.",
"role": "Rolle",
"slug": "Alias"
- },
- "edit": "Bearbeiten"
+ }
}
}
},
@@ -957,6 +957,16 @@
"title": "Suchergebnisse"
},
"settings": {
+ "badges": {
+ "click-to-select": "Klicke auf einen freien Platz, um eine Badge hinzufügen.",
+ "click-to-use": "Klicke auf eine Badge, um sie zu platzieren.",
+ "description": "Hier hast du die Möglichkeit zu entscheiden, wie deine bereits erworbenen Badges in deinem Profil gezeigt werden sollen.",
+ "name": "Badges",
+ "no-badges-available": "Im Moment stehen dir keine Badges zur Verfügung, die du hinzufügen könntest.",
+ "remove": "Badge entfernen",
+ "success-update": "Deine Badges wurden erfolgreich gespeichert.",
+ "verification": "Dies ist deine Verifikations-Badge und kann nicht geändert werden."
+ },
"blocked-users": {
"block": "Nutzer blockieren",
"columns": {
diff --git a/webapp/locales/en.json b/webapp/locales/en.json
index 8d270349e..6b0de56c9 100644
--- a/webapp/locales/en.json
+++ b/webapp/locales/en.json
@@ -12,6 +12,7 @@
"admin": {
"badges": {
"description": "Configure the available badges for this user",
+ "noBadges": "There are no badges available",
"revokeTrophy": {
"error": "Trophy could not be revoked!",
"success": "Trophy successfully revoked!"
@@ -97,8 +98,7 @@
"number": "No.",
"role": "Role",
"slug": "Slug"
- },
- "edit": "Edit"
+ }
}
}
},
@@ -957,6 +957,16 @@
"title": "Search Results"
},
"settings": {
+ "badges": {
+ "click-to-select": "Click on an empty space to add a badge.",
+ "click-to-use": "Click on a badge to use it in the selected slot.",
+ "description": "Here you can choose how to display your earned badges on your profile.",
+ "name": "Badges",
+ "no-badges-available": "You currently don't have any badges available to add.",
+ "remove": "Remove Badge",
+ "success-update": "Your badges have been updated successfully.",
+ "verification": "This is your verification badge and cannot be changed."
+ },
"blocked-users": {
"block": "Block user",
"columns": {
diff --git a/webapp/locales/es.json b/webapp/locales/es.json
index 31f2cc5f4..15096b9d8 100644
--- a/webapp/locales/es.json
+++ b/webapp/locales/es.json
@@ -12,6 +12,7 @@
"admin": {
"badges": {
"description": null,
+ "noBadges": null,
"revokeTrophy": {
"error": null,
"success": null
@@ -97,8 +98,7 @@
"number": "No.",
"role": "Rol",
"slug": "Alias"
- },
- "edit": null
+ }
}
}
},
@@ -957,6 +957,16 @@
"title": null
},
"settings": {
+ "badges": {
+ "click-to-select": null,
+ "click-to-use": null,
+ "description": null,
+ "name": null,
+ "no-badges-available": null,
+ "remove": null,
+ "success-update": null,
+ "verification": null
+ },
"blocked-users": {
"block": "Bloquear usuario",
"columns": {
diff --git a/webapp/locales/fr.json b/webapp/locales/fr.json
index 4bbca2b82..2da2a9801 100644
--- a/webapp/locales/fr.json
+++ b/webapp/locales/fr.json
@@ -12,6 +12,7 @@
"admin": {
"badges": {
"description": null,
+ "noBadges": null,
"revokeTrophy": {
"error": null,
"success": null
@@ -97,8 +98,7 @@
"number": "Num.",
"role": "Rôle",
"slug": "Slug"
- },
- "edit": null
+ }
}
}
},
@@ -957,6 +957,16 @@
"title": null
},
"settings": {
+ "badges": {
+ "click-to-select": null,
+ "click-to-use": null,
+ "description": null,
+ "name": null,
+ "no-badges-available": null,
+ "remove": null,
+ "success-update": null,
+ "verification": null
+ },
"blocked-users": {
"block": "Bloquer l'utilisateur",
"columns": {
diff --git a/webapp/locales/it.json b/webapp/locales/it.json
index 21bfaa859..485abff3a 100644
--- a/webapp/locales/it.json
+++ b/webapp/locales/it.json
@@ -12,6 +12,7 @@
"admin": {
"badges": {
"description": null,
+ "noBadges": null,
"revokeTrophy": {
"error": null,
"success": null
@@ -97,8 +98,7 @@
"number": null,
"role": null,
"slug": null
- },
- "edit": null
+ }
}
}
},
@@ -957,6 +957,16 @@
"title": null
},
"settings": {
+ "badges": {
+ "click-to-select": null,
+ "click-to-use": null,
+ "description": null,
+ "name": null,
+ "no-badges-available": null,
+ "remove": null,
+ "success-update": null,
+ "verification": null
+ },
"blocked-users": {
"block": null,
"columns": {
diff --git a/webapp/locales/nl.json b/webapp/locales/nl.json
index f67518c21..40f9aca2e 100644
--- a/webapp/locales/nl.json
+++ b/webapp/locales/nl.json
@@ -12,6 +12,7 @@
"admin": {
"badges": {
"description": null,
+ "noBadges": null,
"revokeTrophy": {
"error": null,
"success": null
@@ -97,8 +98,7 @@
"number": null,
"role": null,
"slug": null
- },
- "edit": null
+ }
}
}
},
@@ -957,6 +957,16 @@
"title": null
},
"settings": {
+ "badges": {
+ "click-to-select": null,
+ "click-to-use": null,
+ "description": null,
+ "name": null,
+ "no-badges-available": null,
+ "remove": null,
+ "success-update": null,
+ "verification": null
+ },
"blocked-users": {
"block": null,
"columns": {
diff --git a/webapp/locales/pl.json b/webapp/locales/pl.json
index 4c6a96a5f..ee332b84b 100644
--- a/webapp/locales/pl.json
+++ b/webapp/locales/pl.json
@@ -12,6 +12,7 @@
"admin": {
"badges": {
"description": null,
+ "noBadges": null,
"revokeTrophy": {
"error": null,
"success": null
@@ -97,8 +98,7 @@
"number": null,
"role": null,
"slug": null
- },
- "edit": null
+ }
}
}
},
@@ -957,6 +957,16 @@
"title": null
},
"settings": {
+ "badges": {
+ "click-to-select": null,
+ "click-to-use": null,
+ "description": null,
+ "name": null,
+ "no-badges-available": null,
+ "remove": null,
+ "success-update": null,
+ "verification": null
+ },
"blocked-users": {
"block": null,
"columns": {
diff --git a/webapp/locales/pt.json b/webapp/locales/pt.json
index 7d5ad52c1..54f9b5d99 100644
--- a/webapp/locales/pt.json
+++ b/webapp/locales/pt.json
@@ -12,6 +12,7 @@
"admin": {
"badges": {
"description": null,
+ "noBadges": null,
"revokeTrophy": {
"error": null,
"success": null
@@ -97,8 +98,7 @@
"number": "N.º",
"role": "Função",
"slug": "Slug"
- },
- "edit": null
+ }
}
}
},
@@ -957,6 +957,16 @@
"title": null
},
"settings": {
+ "badges": {
+ "click-to-select": null,
+ "click-to-use": null,
+ "description": null,
+ "name": null,
+ "no-badges-available": null,
+ "remove": null,
+ "success-update": null,
+ "verification": null
+ },
"blocked-users": {
"block": "Bloquear usuário",
"columns": {
diff --git a/webapp/locales/ru.json b/webapp/locales/ru.json
index 3a394d6ff..4d2e2a357 100644
--- a/webapp/locales/ru.json
+++ b/webapp/locales/ru.json
@@ -12,6 +12,7 @@
"admin": {
"badges": {
"description": null,
+ "noBadges": null,
"revokeTrophy": {
"error": null,
"success": null
@@ -97,8 +98,7 @@
"number": "№",
"role": "Роль",
"slug": "Алиас"
- },
- "edit": null
+ }
}
}
},
@@ -957,6 +957,16 @@
"title": null
},
"settings": {
+ "badges": {
+ "click-to-select": null,
+ "click-to-use": null,
+ "description": null,
+ "name": null,
+ "no-badges-available": null,
+ "remove": null,
+ "success-update": null,
+ "verification": null
+ },
"blocked-users": {
"block": "Блокировать",
"columns": {
diff --git a/webapp/maintenance/source/package.json b/webapp/maintenance/source/package.json
index 1aa029eb4..df76a77ca 100644
--- a/webapp/maintenance/source/package.json
+++ b/webapp/maintenance/source/package.json
@@ -1,6 +1,6 @@
{
"name": "@ocelot-social/maintenance",
- "version": "3.3.0",
+ "version": "3.4.0",
"description": "Maintenance page for ocelot.social",
"repository": "https://github.com/Ocelot-Social-Community/Ocelot-Social",
"author": "ocelot.social Community",
diff --git a/webapp/nuxt.config.js b/webapp/nuxt.config.js
index 07cfa6bc4..263c3f149 100644
--- a/webapp/nuxt.config.js
+++ b/webapp/nuxt.config.js
@@ -207,15 +207,6 @@ export default {
'X-API-TOKEN': CONFIG.BACKEND_TOKEN,
},
},
- '/img': {
- // make this configurable (nuxt-dotenv)
- target: CONFIG.GRAPHQL_URI,
- toProxy: true, // cloudflare needs that
- headers: {
- 'X-UI-Request': true,
- 'X-API-TOKEN': CONFIG.BACKEND_TOKEN,
- },
- },
},
// Give apollo module options
diff --git a/webapp/package.json b/webapp/package.json
index d18a88408..574c94378 100644
--- a/webapp/package.json
+++ b/webapp/package.json
@@ -1,6 +1,6 @@
{
"name": "ocelot-social-webapp",
- "version": "3.3.0",
+ "version": "3.4.0",
"description": "ocelot.social Frontend",
"repository": "https://github.com/Ocelot-Social-Community/Ocelot-Social",
"author": "ocelot.social Community",
@@ -79,6 +79,7 @@
"@storybook/addon-actions": "^5.3.21",
"@storybook/addon-notes": "^5.3.18",
"@storybook/vue": "~7.4.0",
+ "@testing-library/jest-dom": "^6.6.3",
"@testing-library/vue": "5",
"@vue/cli-shared-utils": "~4.3.1",
"@vue/eslint-config-prettier": "~6.0.0",
diff --git a/webapp/pages/__snapshots__/settings.spec.js.snap b/webapp/pages/__snapshots__/settings.spec.js.snap
new file mode 100644
index 000000000..6672e41af
--- /dev/null
+++ b/webapp/pages/__snapshots__/settings.spec.js.snap
@@ -0,0 +1,427 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`settings.vue given badges are disabled renders 1`] = `
+
+
+ + +
+ +
+
+ admin.badges.noBadges
+
+
+
+
+`;
+
+exports[`settings.vue given badges are enabled renders 1`] = `
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+
+
+`;
diff --git a/webapp/pages/admin/users/__snapshots__/index.spec.js.snap b/webapp/pages/admin/users/__snapshots__/index.spec.js.snap
new file mode 100644
index 000000000..0fff4016b
--- /dev/null
+++ b/webapp/pages/admin/users/__snapshots__/index.spec.js.snap
@@ -0,0 +1,867 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Users given badges are disabled renders 1`] = `
+
+
+
+
+
+
+
+ + +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+`;
+
+exports[`Users given badges are enabled renders 1`] = `
+
+
+
+
+
+
+
+
+ | + + admin.users.table.columns.number + + | ++ + admin.users.table.columns.name + + | ++ + admin.users.table.columns.email + + | ++ + admin.users.table.columns.slug + + | ++ + admin.users.table.columns.createdAt + + | ++ + 🖉 + + | ++ + 🗨 + + | ++ + ❤ + + | ++ + admin.users.table.columns.role + + | +
|---|---|---|---|---|---|---|---|---|
| + NaN. + | +
+ |
+ + + + user@example.org + + + | +
+ |
+ + + + + | ++ + + + | ++ + + + | ++ + + + | ++ + | +
| + NaN. + | +
+ |
+ + + + user2@example.org + + + | +
+ |
+ + + + + | ++ + + + | ++ + + + | ++ + + + | ++ + | +
+
+
+
+
+
+
+`;
diff --git a/webapp/pages/admin/users/_id.spec.js b/webapp/pages/admin/users/_id.spec.js
index 933de58de..d38b13022 100644
--- a/webapp/pages/admin/users/_id.spec.js
+++ b/webapp/pages/admin/users/_id.spec.js
@@ -58,6 +58,11 @@ describe('.vue', () => {
query: jest.fn(),
},
mutate: jest.fn(),
+ queries: {
+ Badge: {
+ loading: false,
+ },
+ },
},
$toast: {
success: jest.fn(),
diff --git a/webapp/pages/admin/users/_id.vue b/webapp/pages/admin/users/_id.vue
index 808e1653a..a6c4dafaa 100644
--- a/webapp/pages/admin/users/_id.vue
+++ b/webapp/pages/admin/users/_id.vue
@@ -8,7 +8,7 @@
+ admin.users.name +
+ + + + +
+
+
+
+
+
+
+
+ | + + admin.users.table.columns.number + + | ++ + admin.users.table.columns.name + + | ++ + admin.users.table.columns.email + + | ++ + admin.users.table.columns.slug + + | ++ + admin.users.table.columns.createdAt + + | ++ + 🖉 + + | ++ + 🗨 + + | ++ + ❤ + + | ++ + admin.users.table.columns.role + + | ++ + admin.users.table.columns.badges + + | +
|---|---|---|---|---|---|---|---|---|---|
| + NaN. + | +
+ |
+ + + + user@example.org + + + | +
+ |
+ + + + + | ++ + + + | ++ + + + | ++ + + + | ++ + | +
+ |
+
| + NaN. + | +
+ |
+ + + + user2@example.org + + + | +
+ |
+ + + + + | ++ + + + | ++ + + + | ++ + + + | ++ + | +
+ |
+
+
+`;
+
+exports[`ProfileSlug given an authenticated user given another profile user and badges are enabled renders 1`] = `
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ BTB
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + + Bob the builder + +
+ ++ + @undefined + +
+ + + ++ + profile.memberSince + +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + profile.followers + +
+
+
+
+
+
+
+
+
+
+ + profile.following + +
++ + profile.network.title + +
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+`;
+
+exports[`ProfileSlug given an authenticated user given the logged in user as profile user and badges are disabled renders 1`] = `
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ BTB
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + + Bob the builder + +
+ ++ + @undefined + +
+ + + ++ + profile.memberSince + +
+
+
+
+
+
+
+
+
+ 
+
+
+ 
+
+
+ 
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + profile.followers + +
+
+
+
+
+
+
+
+
+
+ + profile.following + +
++ + profile.network.title + +
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+`;
+
+exports[`ProfileSlug given an authenticated user given the logged in user as profile user and badges are enabled renders 1`] = `
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ BTB
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + + Bob the builder + +
+ ++ + @undefined + +
+ + + ++ + profile.memberSince + +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + profile.followers + +
+
+
+
+
+
+
+
+
+
+ + profile.following + +
++ + profile.network.title + +
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+`;
diff --git a/webapp/pages/profile/_id/_slug.spec.js b/webapp/pages/profile/_id/_slug.spec.js
index 5ab87ad3a..a4cc473c3 100644
--- a/webapp/pages/profile/_id/_slug.spec.js
+++ b/webapp/pages/profile/_id/_slug.spec.js
@@ -1,22 +1,25 @@
-import { mount } from '@vue/test-utils'
+import { render } from '@testing-library/vue'
import ProfileSlug from './_slug.vue'
const localVue = global.localVue
localVue.filter('date', (d) => d)
+// Mock Math.random, used in Dropdown
+Object.assign(Math, {
+ random: () => 0,
+})
+
const stubs = {
'client-only': true,
'v-popover': true,
'nuxt-link': true,
- 'infinite-loading': true,
'follow-list': true,
'router-link': true,
}
describe('ProfileSlug', () => {
let wrapper
- let Wrapper
let mocks
beforeEach(() => {
@@ -25,7 +28,7 @@ describe('ProfileSlug', () => {
id: 'p23',
name: 'It is a post',
},
- $t: jest.fn(),
+ $t: jest.fn((t) => t),
// If you're mocking router, then don't use VueRouter with localVue: https://vue-test-utils.vuejs.org/guides/using-with-vue-router.html
$route: {
params: {
@@ -49,49 +52,144 @@ describe('ProfileSlug', () => {
}
})
- describe('mount', () => {
- Wrapper = () => {
- return mount(ProfileSlug, {
- mocks,
- localVue,
- stubs,
- })
- }
+ const Wrapper = (badgesEnabled, data) => {
+ return render(ProfileSlug, {
+ localVue,
+ stubs,
+ data: () => data,
+ mocks: {
+ ...mocks,
+ $env: {
+ BADGES_ENABLED: badgesEnabled,
+ },
+ },
+ })
+ }
- describe('given an authenticated user', () => {
- beforeEach(() => {
- mocks.$filters = {
- removeLinks: (c) => c,
- truncate: (a) => a,
- }
- mocks.$store = {
- getters: {
- 'auth/isModerator': () => false,
- 'auth/user': {
- id: 'u23',
- },
+ describe('given an authenticated user', () => {
+ beforeEach(() => {
+ mocks.$filters = {
+ removeLinks: (c) => c,
+ truncate: (a) => a,
+ }
+ mocks.$store = {
+ getters: {
+ 'auth/isModerator': () => false,
+ 'auth/user': {
+ id: 'u23',
},
- }
- })
+ },
+ }
+ })
- describe('given a user for the profile', () => {
- beforeEach(() => {
- wrapper = Wrapper()
- wrapper.setData({
- User: [
+ describe('given another profile user', () => {
+ const user = {
+ User: [
+ {
+ id: 'u3',
+ name: 'Bob the builder',
+ contributionsCount: 6,
+ shoutedCount: 7,
+ commentedCount: 8,
+ badgeVerification: {
+ id: 'bv1',
+ icon: '/path/to/icon-bv1',
+ description: 'verified',
+ isDefault: false,
+ },
+ badgeTrophiesSelected: [
{
- id: 'u3',
- name: 'Bob the builder',
- contributionsCount: 6,
- shoutedCount: 7,
- commentedCount: 8,
+ id: 'bt1',
+ icon: '/path/to/icon-bt1',
+ description: 'a trophy',
+ isDefault: false,
+ },
+ {
+ id: 'bt2',
+ icon: '/path/to/icon-bt2',
+ description: 'no trophy',
+ isDefault: true,
},
],
- })
+ },
+ ],
+ }
+
+ describe('and badges are enabled', () => {
+ beforeEach(() => {
+ wrapper = Wrapper(true, user)
})
- it('displays name of the user', () => {
- expect(wrapper.text()).toContain('Bob the builder')
+ it('renders', () => {
+ expect(wrapper.container).toMatchSnapshot()
+ })
+ })
+
+ describe('and badges are disabled', () => {
+ beforeEach(() => {
+ wrapper = Wrapper(false, user)
+ })
+
+ it('renders', () => {
+ expect(wrapper.container).toMatchSnapshot()
+ })
+ })
+ })
+
+ describe('given the logged in user as profile user', () => {
+ beforeEach(() => {
+ mocks.$route.params.id = 'u23'
+ })
+
+ const user = {
+ User: [
+ {
+ id: 'u23',
+ name: 'Bob the builder',
+ contributionsCount: 6,
+ shoutedCount: 7,
+ commentedCount: 8,
+ badgeVerification: {
+ id: 'bv1',
+ icon: '/path/to/icon-bv1',
+ description: 'verified',
+ isDefault: false,
+ },
+ badgeTrophiesSelected: [
+ {
+ id: 'bt1',
+ icon: '/path/to/icon-bt1',
+ description: 'a trophy',
+ isDefault: false,
+ },
+ {
+ id: 'bt2',
+ icon: '/path/to/icon-bt2',
+ description: 'no trophy',
+ isDefault: true,
+ },
+ ],
+ },
+ ],
+ }
+
+ describe('and badges are enabled', () => {
+ beforeEach(() => {
+ wrapper = Wrapper(true, user)
+ })
+
+ it('renders', () => {
+ expect(wrapper.container).toMatchSnapshot()
+ })
+ })
+
+ describe('and badges are disabled', () => {
+ beforeEach(() => {
+ wrapper = Wrapper(false, user)
+ })
+
+ it('renders', () => {
+ expect(wrapper.container).toMatchSnapshot()
})
})
})
diff --git a/webapp/pages/profile/_id/_slug.vue b/webapp/pages/profile/_id/_slug.vue
index 382350faf..38035e217 100644
--- a/webapp/pages/profile/_id/_slug.vue
+++ b/webapp/pages/profile/_id/_slug.vue
@@ -42,8 +42,11 @@
{{ $t('profile.memberSince') }} {{ user.createdAt | date('MMMM yyyy') }}
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ BTB
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + + Bob the builder + +
+ ++ + @undefined + +
+ + + ++ + profile.memberSince + +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + profile.followers + +
+
+
+
+
+
+
+
+
+
+ + profile.following + +
++ + profile.network.title + +
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+`;
+
+exports[`badge settings with badges no more badges available selecting an empty slot shows no more badges available message 1`] = `
++ settings.badges.name +
+ ++ settings.badges.description +
+ +
+
+
+
+
+
+
+
+
+
+
+
+ 
+
+
+
+
+
+
+
+ settings.badges.click-to-use
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+`;
+
+exports[`badge settings with badges renders 1`] = `
++ settings.badges.name +
+ ++ settings.badges.description +
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + + settings.badges.no-badges-available + +
+ + + + + + +
+
+
+
+`;
+
+exports[`badge settings with badges selecting a used badge clicking remove badge button with successful server request removes the badge 1`] = `
++ settings.badges.name +
+ ++ settings.badges.description +
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ settings.badges.click-to-select
+
+
+
+
+
+
+
+
+
+
+
+`;
+
+exports[`badge settings without badges renders 1`] = `
++ settings.badges.name +
+ ++ settings.badges.description +
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+`;
diff --git a/webapp/pages/settings/__snapshots__/notifications.spec.js.snap b/webapp/pages/settings/__snapshots__/notifications.spec.js.snap
index 0b70393ee..fd2c2f56c 100644
--- a/webapp/pages/settings/__snapshots__/notifications.spec.js.snap
+++ b/webapp/pages/settings/__snapshots__/notifications.spec.js.snap
@@ -12,11 +12,11 @@ exports[`notifications.vue mount renders 1`] = `
+ settings.badges.name +
+ ++ settings.badges.description +
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ settings.notifications.post @@ -66,11 +66,11 @@ exports[`notifications.vue mount renders 1`] = `
settings.notifications.group @@ -155,42 +155,47 @@ exports[`notifications.vue mount renders 1`] = `
{{ $t('settings.badges.name') }}
+{{ $t('settings.badges.description') }}
+
+
+
+ + {{ $t('settings.badges.no-badges-available') }} +
+ +
+
+ {{
+ selectedBadgeIndex === null
+ ? this.$t('settings.badges.click-to-select')
+ : isEmptySlotSelected
+ ? this.$t('settings.badges.click-to-use')
+ : ''
+ }}
+
+
+
+
+
+ {{ $t('settings.badges.remove') }}
+
+
+
+
+
+