discourse/test/javascripts/widgets/post-test.js.es6

784 lines
22 KiB
JavaScript

import { moduleForWidget, widgetTest } from 'helpers/widget-test';
moduleForWidget('post');
widgetTest('basic elements', {
template: '{{mount-widget widget="post" args=args}}',
setup() {
this.set('args', { shareUrl: '/example', post_number: 1 });
},
test(assert) {
assert.ok(this.$('.names').length, 'includes poster name');
assert.ok(this.$('a.post-date').length, 'includes post date');
assert.ok(this.$('a.post-date[data-share-url]').length);
assert.ok(this.$('a.post-date[data-post-number]').length);
}
});
widgetTest('wiki', {
template: '{{mount-widget widget="post" args=args editPost="editPost"}}',
setup() {
this.set('args', { wiki: true });
this.on('editPost', () => this.editPostCalled = true);
},
test(assert) {
click('.post-info.wiki');
andThen(() => {
assert.ok(this.editPostCalled, 'clicking the wiki icon edits the post');
});
}
});
widgetTest('via-email', {
template: '{{mount-widget widget="post" args=args showRawEmail="showRawEmail"}}',
setup() {
this.set('args', { via_email: true, canViewRawEmail: true });
this.on('showRawEmail', () => this.rawEmailShown = true);
},
test(assert) {
click('.post-info.via-email');
andThen(() => {
assert.ok(this.rawEmailShown, 'clicking the enveloppe shows the raw email');
});
}
});
widgetTest('via-email without permission', {
template: '{{mount-widget widget="post" args=args showRawEmail="showRawEmail"}}',
setup() {
this.set('args', { via_email: true, canViewRawEmail: false });
this.on('showRawEmail', () => this.rawEmailShown = true);
},
test(assert) {
click('.post-info.via-email');
andThen(() => {
assert.ok(!this.rawEmailShown, `clicking the enveloppe doesn't show the raw email`);
});
}
});
widgetTest('history', {
template: '{{mount-widget widget="post" args=args showHistory="showHistory"}}',
setup() {
this.set('args', { version: 3, canViewEditHistory: true });
this.on('showHistory', () => this.historyShown = true);
},
test(assert) {
click('.post-info.edits');
andThen(() => {
assert.ok(this.historyShown, 'clicking the pencil shows the history');
});
}
});
widgetTest('history without view permission', {
template: '{{mount-widget widget="post" args=args showHistory="showHistory"}}',
setup() {
this.set('args', { version: 3, canViewEditHistory: false });
this.on('showHistory', () => this.historyShown = true);
},
test(assert) {
click('.post-info.edits');
andThen(() => {
assert.ok(!this.historyShown, `clicking the pencil doesn't show the history`);
});
}
});
widgetTest('whisper', {
template: '{{mount-widget widget="post" args=args}}',
setup() {
this.set('args', { isWhisper: true });
},
test(assert) {
assert.ok(this.$('.topic-post.whisper').length === 1);
assert.ok(this.$('.post-info.whisper').length === 1);
}
});
widgetTest('like count button', {
template: '{{mount-widget widget="post" model=post args=args}}',
setup(store) {
const topic = store.createRecord('topic', {id: 123});
const post = store.createRecord('post', {
id: 1,
post_number: 1,
topic,
like_count: 3,
actions_summary: [ {id: 2, count: 1, hidden: false, can_act: true} ]
});
this.set('post', post);
this.set('args', { likeCount: 1 });
},
test(assert) {
assert.ok(this.$('button.like-count').length === 1);
assert.ok(this.$('.who-liked').length === 0);
// toggle it on
click('button.like-count');
andThen(() => {
assert.ok(this.$('.who-liked').length === 1);
assert.ok(this.$('.who-liked a.trigger-user-card').length === 1);
});
// toggle it off
click('button.like-count');
andThen(() => {
assert.ok(this.$('.who-liked').length === 0);
assert.ok(this.$('.who-liked a.trigger-user-card').length === 0);
});
}
});
widgetTest(`like count with no likes`, {
template: '{{mount-widget widget="post" model=post args=args}}',
setup() {
this.set('args', { likeCount: 0 });
},
test(assert) {
assert.ok(this.$('button.like-count').length === 0);
}
});
widgetTest('share button', {
template: '{{mount-widget widget="post" args=args}}',
setup() {
this.set('args', { shareUrl: 'http://share-me.example.com' });
},
test(assert) {
assert.ok(!!this.$('.actions button[data-share-url]').length, 'it renders a share button');
}
});
widgetTest('liking', {
template: '{{mount-widget widget="post-menu" args=args toggleLike="toggleLike"}}',
setup() {
const args = { showLike: true, canToggleLike: true };
this.set('args', args);
this.on('toggleLike', () => {
args.liked = !args.liked;
args.likeCount = args.liked ? 1 : 0;
});
},
test(assert) {
assert.ok(!!this.$('.actions button.like').length);
assert.ok(this.$('.actions button.like-count').length === 0);
click('.actions button.like');
andThen(() => {
assert.ok(!this.$('.actions button.like').length);
assert.ok(!!this.$('.actions button.has-like').length);
assert.ok(this.$('.actions button.like-count').length === 1);
});
click('.actions button.has-like');
andThen(() => {
assert.ok(!!this.$('.actions button.like').length);
assert.ok(!this.$('.actions button.has-like').length);
assert.ok(this.$('.actions button.like-count').length === 0);
});
}
});
widgetTest('edit button', {
template: '{{mount-widget widget="post" args=args editPost="editPost"}}',
setup() {
this.set('args', { canEdit: true });
this.on('editPost', () => this.editPostCalled = true);
},
test(assert) {
click('button.edit');
andThen(() => {
assert.ok(this.editPostCalled, 'it triggered the edit action');
});
}
});
widgetTest(`edit button - can't edit`, {
template: '{{mount-widget widget="post" args=args editPost="editPost"}}',
setup() {
this.set('args', { canEdit: false });
},
test(assert) {
assert.equal(this.$('button.edit').length, 0, `button is not displayed`);
}
});
widgetTest('recover button', {
template: '{{mount-widget widget="post" args=args deletePost="deletePost"}}',
setup() {
this.set('args', { canDelete: true });
this.on('deletePost', () => this.deletePostCalled = true);
},
test(assert) {
click('button.delete');
andThen(() => {
assert.ok(this.deletePostCalled, 'it triggered the delete action');
});
}
});
widgetTest('delete topic button', {
template: '{{mount-widget widget="post" args=args deletePost="deletePost"}}',
setup() {
this.set('args', { canDeleteTopic: true });
this.on('deletePost', () => this.deletePostCalled = true);
},
test(assert) {
click('button.delete');
andThen(() => {
assert.ok(this.deletePostCalled, 'it triggered the delete action');
});
}
});
widgetTest(`delete topic button - can't delete`, {
template: '{{mount-widget widget="post" args=args deletePost="deletePost"}}',
setup() {
this.set('args', { canDeleteTopic: false });
},
test(assert) {
assert.equal(this.$('button.delete').length, 0, `button is not displayed`);
}
});
widgetTest('recover topic button', {
template: '{{mount-widget widget="post" args=args recoverPost="recoverPost"}}',
setup() {
this.set('args', { canRecoverTopic: true });
this.on('recoverPost', () => this.recovered = true);
},
test(assert) {
click('button.recover');
andThen(() => assert.ok(this.recovered));
}
});
widgetTest(`recover topic button - can't recover`, {
template: '{{mount-widget widget="post" args=args deletePost="deletePost"}}',
setup() {
this.set('args', { canRecoverTopic: false });
},
test(assert) {
assert.equal(this.$('button.recover').length, 0, `button is not displayed`);
}
});
widgetTest('delete post button', {
template: '{{mount-widget widget="post" args=args deletePost="deletePost"}}',
setup() {
this.set('args', { canDelete: true });
this.on('deletePost', () => this.deletePostCalled = true);
},
test(assert) {
click('button.delete');
andThen(() => {
assert.ok(this.deletePostCalled, 'it triggered the delete action');
});
}
});
widgetTest(`delete post button - can't delete`, {
template: '{{mount-widget widget="post" args=args}}',
setup() {
this.set('args', { canDelete: false });
},
test(assert) {
assert.equal(this.$('button.delete').length, 0, `button is not displayed`);
}
});
widgetTest('recover post button', {
template: '{{mount-widget widget="post" args=args recoverPost="recoverPost"}}',
setup() {
this.set('args', { canRecover: true });
this.on('recoverPost', () => this.recovered = true);
},
test(assert) {
click('button.recover');
andThen(() => assert.ok(this.recovered));
}
});
widgetTest(`recover post button - can't recover`, {
template: '{{mount-widget widget="post" args=args deletePost="deletePost"}}',
setup() {
this.set('args', { canRecover: false });
},
test(assert) {
assert.equal(this.$('button.recover').length, 0, `button is not displayed`);
}
});
widgetTest(`flagging`, {
template: '{{mount-widget widget="post" args=args showFlags="showFlags"}}',
setup() {
this.set('args', { canFlag: true });
this.on('showFlags', () => this.flagsShown = true);
},
test(assert) {
assert.ok(this.$('button.create-flag').length === 1);
click('button.create-flag');
andThen(() => {
assert.ok(this.flagsShown, 'it triggered the action');
});
}
});
widgetTest(`flagging: can't flag`, {
template: '{{mount-widget widget="post" args=args}}',
setup() {
this.set('args', { canFlag: false });
},
test(assert) {
assert.ok(this.$('button.create-flag').length === 0);
}
});
widgetTest(`read indicator`, {
template: '{{mount-widget widget="post" args=args}}',
setup() {
this.set('args', { read: true });
},
test(assert) {
assert.ok(this.$('.read-state.read').length);
}
});
widgetTest(`unread indicator`, {
template: '{{mount-widget widget="post" args=args}}',
setup() {
this.set('args', { read: false });
},
test(assert) {
assert.ok(this.$('.read-state').length);
}
});
widgetTest("reply directly above (supressed)", {
template: '{{mount-widget widget="post" args=args}}',
setup() {
this.set('args', {
replyToUsername: 'eviltrout',
replyToAvatarTemplate: '/images/avatar.png',
replyDirectlyAbove: true
});
},
test(assert) {
assert.equal(this.$('a.reply-to-tab').length, 0, 'hides the tab');
assert.equal(this.$('.avoid-tab').length, 0, "doesn't have the avoid tab class");
}
});
widgetTest("reply a few posts above (supressed)", {
template: '{{mount-widget widget="post" args=args}}',
setup() {
this.set('args', {
replyToUsername: 'eviltrout',
replyToAvatarTemplate: '/images/avatar.png',
replyDirectlyAbove: false
});
},
test(assert) {
assert.ok(this.$('a.reply-to-tab').length, 'shows the tab');
assert.equal(this.$('.avoid-tab').length, 1, "has the avoid tab class");
}
});
widgetTest("reply directly above", {
template: '{{mount-widget widget="post" args=args}}',
setup() {
this.set('args', {
replyToUsername: 'eviltrout',
replyToAvatarTemplate: '/images/avatar.png',
replyDirectlyAbove: true
});
this.siteSettings.suppress_reply_directly_above = false;
},
test(assert) {
assert.equal(this.$('.avoid-tab').length, 1, "has the avoid tab class");
click('a.reply-to-tab');
andThen(() => {
assert.equal(this.$('section.embedded-posts.top .cooked').length, 1);
assert.equal(this.$('section.embedded-posts i.fa-arrow-up').length, 1);
});
}
});
widgetTest("cooked content hidden", {
template: '{{mount-widget widget="post" args=args expandHidden="expandHidden"}}',
setup() {
this.set('args', { cooked_hidden: true });
this.on('expandHidden', () => this.unhidden = true);
},
test(assert) {
click('.topic-body .expand-hidden');
andThen(() => {
assert.ok(this.unhidden, 'triggers the action');
});
}
});
widgetTest("expand first post", {
template: '{{mount-widget widget="post" model=post args=args}}',
setup(store) {
this.set('args', { expandablePost: true });
this.set('post', store.createRecord('post', { id: 1234 }));
},
test(assert) {
click('.topic-body .expand-post');
andThen(() => {
assert.equal(this.$('.expand-post').length, 0, 'button is gone');
});
}
});
widgetTest("can't bookmark", {
template: '{{mount-widget widget="post" args=args}}',
setup() {
this.set('args', { canBookmark: false });
},
test(assert) {
assert.equal(this.$('button.bookmark').length, 0);
assert.equal(this.$('button.bookmarked').length, 0);
}
});
widgetTest("bookmark", {
template: '{{mount-widget widget="post" args=args toggleBookmark="toggleBookmark"}}',
setup() {
const args = { canBookmark: true };
this.set('args', args);
this.on('toggleBookmark', () => args.bookmarked = true);
},
test(assert) {
assert.equal(this.$('.post-menu-area .bookmark').length, 1);
assert.equal(this.$('button.bookmarked').length, 0);
click('button.bookmark');
andThen(() => {
assert.equal(this.$('button.bookmarked').length, 1);
});
}
});
widgetTest("can't show admin menu when you can't manage", {
template: '{{mount-widget widget="post" args=args}}',
setup() {
this.set('args', { canManage: false });
},
test(assert) {
assert.equal(this.$('.post-menu-area .show-post-admin-menu').length, 0);
}
});
widgetTest("show admin menu", {
template: '{{mount-widget widget="post" args=args}}',
setup() {
this.set('args', { canManage: true });
},
test(assert) {
assert.equal(this.$('.post-admin-menu').length, 0);
click('.post-menu-area .show-post-admin-menu');
andThen(() => {
assert.equal(this.$('.post-admin-menu').length, 1, 'it shows the popup');
});
click('.post-menu-area');
andThen(() => {
assert.equal(this.$('.post-admin-menu').length, 0, 'clicking outside clears the popup');
});
}
});
widgetTest("toggle moderator post", {
template: '{{mount-widget widget="post" args=args togglePostType="togglePostType"}}',
setup() {
this.set('args', { canManage: true });
this.on('togglePostType', () => this.toggled = true);
},
test(assert) {
click('.post-menu-area .show-post-admin-menu');
click('.post-admin-menu .toggle-post-type');
andThen(() => {
assert.ok(this.toggled);
assert.equal(this.$('.post-admin-menu').length, 0, 'also hides the menu');
});
}
});
widgetTest("toggle moderator post", {
template: '{{mount-widget widget="post" args=args togglePostType="togglePostType"}}',
setup() {
this.set('args', { canManage: true });
this.on('togglePostType', () => this.toggled = true);
},
test(assert) {
click('.post-menu-area .show-post-admin-menu');
click('.post-admin-menu .toggle-post-type');
andThen(() => {
assert.ok(this.toggled);
assert.equal(this.$('.post-admin-menu').length, 0, 'also hides the menu');
});
}
});
widgetTest("rebake post", {
template: '{{mount-widget widget="post" args=args rebakePost="rebakePost"}}',
setup() {
this.set('args', { canManage: true });
this.on('rebakePost', () => this.baked = true);
},
test(assert) {
click('.post-menu-area .show-post-admin-menu');
click('.post-admin-menu .rebuild-html');
andThen(() => {
assert.ok(this.baked);
assert.equal(this.$('.post-admin-menu').length, 0, 'also hides the menu');
});
}
});
widgetTest("unhide post", {
template: '{{mount-widget widget="post" args=args unhidePost="unhidePost"}}',
setup() {
this.set('args', { canManage: true, hidden: true });
this.on('unhidePost', () => this.unhidden = true);
},
test(assert) {
click('.post-menu-area .show-post-admin-menu');
click('.post-admin-menu .unhide-post');
andThen(() => {
assert.ok(this.unhidden);
assert.equal(this.$('.post-admin-menu').length, 0, 'also hides the menu');
});
}
});
widgetTest("change owner", {
template: '{{mount-widget widget="post" args=args changePostOwner="changePostOwner"}}',
setup() {
this.currentUser.admin = true;
this.set('args', { canManage: true });
this.on('changePostOwner', () => this.owned = true);
},
test(assert) {
click('.post-menu-area .show-post-admin-menu');
click('.post-admin-menu .change-owner');
andThen(() => {
assert.ok(this.owned);
assert.equal(this.$('.post-admin-menu').length, 0, 'also hides the menu');
});
}
});
widgetTest("reply", {
template: '{{mount-widget widget="post" args=args replyToPost="replyToPost"}}',
setup() {
this.set('args', { canCreatePost: true });
this.on('replyToPost', () => this.replied = true);
},
test(assert) {
click('.post-controls .create');
andThen(() => {
assert.ok(this.replied);
});
}
});
widgetTest("reply - without permissions", {
template: '{{mount-widget widget="post" args=args}}',
setup() {
this.set('args', { canCreatePost: false });
},
test(assert) {
assert.equal(this.$('.post-controls .create').length, 0);
}
});
widgetTest("replies - no replies", {
template: '{{mount-widget widget="post" args=args}}',
setup() {
this.set('args', {replyCount: 0});
},
test(assert) {
assert.equal(this.$('button.show-replies').length, 0);
}
});
widgetTest("replies - multiple replies", {
template: '{{mount-widget widget="post" args=args}}',
setup() {
this.siteSettings.suppress_reply_directly_below = true;
this.set('args', {replyCount: 2, replyDirectlyBelow: true});
},
test(assert) {
assert.equal(this.$('button.show-replies').length, 1);
}
});
widgetTest("replies - one below, suppressed", {
template: '{{mount-widget widget="post" args=args}}',
setup() {
this.siteSettings.suppress_reply_directly_below = true;
this.set('args', {replyCount: 1, replyDirectlyBelow: true});
},
test(assert) {
assert.equal(this.$('button.show-replies').length, 0);
}
});
widgetTest("replies - one below, not suppressed", {
template: '{{mount-widget widget="post" args=args}}',
setup() {
this.siteSettings.suppress_reply_directly_below = false;
this.set('args', {id: 6654, replyCount: 1, replyDirectlyBelow: true});
},
test(assert) {
click('button.show-replies');
andThen(() => {
assert.equal(this.$('section.embedded-posts.bottom .cooked').length, 1);
assert.equal(this.$('section.embedded-posts i.fa-arrow-down').length, 1);
});
}
});
widgetTest("topic map not shown", {
template: '{{mount-widget widget="post" args=args}}',
setup() {
this.set('args', { showTopicMap: false });
},
test(assert) {
assert.equal(this.$('.topic-map').length, 0);
}
});
widgetTest("topic map - few posts", {
template: '{{mount-widget widget="post" args=args}}',
setup() {
this.set('args', {
showTopicMap: true,
topicPostsCount: 2,
participants: [
{username: 'eviltrout'},
{username: 'codinghorror'},
]
});
},
test(assert) {
assert.equal(this.$('li.avatars a.poster').length, 0, 'shows no participants when collapsed');
click('nav.buttons button');
andThen(() => {
assert.equal(this.$('.topic-map-expanded a.poster').length, 2, 'shows all when expanded');
});
}
});
widgetTest("topic map - participants", {
template: '{{mount-widget widget="post" args=args toggleParticipant="toggleParticipant"}}',
setup() {
this.set('args', {
showTopicMap: true,
topicPostsCount: 10,
participants: [
{username: 'eviltrout'},
{username: 'codinghorror'},
{username: 'sam'},
{username: 'ZogStrIP'},
],
userFilters: ['sam', 'codinghorror']
});
this.on('toggleParticipant', () => this.participantToggled = true);
},
test(assert) {
assert.equal(this.$('li.avatars a.poster').length, 3, 'limits to three participants');
click('nav.buttons button');
andThen(() => {
assert.equal(this.$('li.avatars a.poster').length, 0);
assert.equal(this.$('.topic-map-expanded a.poster').length, 4, 'shows all when expanded');
assert.equal(this.$('a.poster.toggled').length, 2, 'two are toggled');
});
click('.topic-map-expanded a.poster:eq(0)');
andThen(() => assert.ok(this.participantToggled));
}
});
widgetTest("topic map - links", {
template: '{{mount-widget widget="post" args=args}}',
setup() {
this.set('args', {
showTopicMap: true,
topicLinks: [
{url: 'http://link1.example.com', clicks: 0},
{url: 'http://link2.example.com', clicks: 0},
{url: 'http://link3.example.com', clicks: 0},
{url: 'http://link4.example.com', clicks: 0},
{url: 'http://link5.example.com', clicks: 0},
{url: 'http://link6.example.com', clicks: 0},
]
});
},
test(assert) {
assert.equal(this.$('.topic-map').length, 1);
assert.equal(this.$('.map.map-collapsed').length, 1);
assert.equal(this.$('.topic-map-expanded').length, 0);
click('nav.buttons button');
andThen(() => {
assert.equal(this.$('.map.map-collapsed').length, 0);
assert.equal(this.$('.topic-map i.fa-chevron-up').length, 1);
assert.equal(this.$('.topic-map-expanded').length, 1);
assert.equal(this.$('.topic-map-expanded .topic-link').length, 5, 'it limits the links displayed');
});
click('.link-summary a');
andThen(() => {
assert.equal(this.$('.topic-map-expanded .topic-link').length, 6, 'all links now shown');
});
}
});
widgetTest("topic map - no summary", {
template: '{{mount-widget widget="post" args=args}}',
setup() {
this.set('args', { showTopicMap: true });
},
test(assert) {
assert.equal(this.$('.toggle-summary').length, 0);
}
});
widgetTest("topic map - has summary", {
template: '{{mount-widget widget="post" args=args toggleSummary="toggleSummary"}}',
setup() {
this.set('args', { showTopicMap: true, hasTopicSummary: true });
this.on('toggleSummary', () => this.summaryToggled = true);
},
test(assert) {
assert.equal(this.$('.toggle-summary').length, 1);
click('.toggle-summary button');
andThen(() => assert.ok(this.summaryToggled));
}
});
widgetTest("pm map", {
template: '{{mount-widget widget="post" args=args}}',
setup() {
this.set('args', {
showTopicMap: true,
showPMMap: true,
allowedGroups: [],
allowedUsers: [ Ember.Object.create({ username: 'eviltrout' }) ]
});
},
test(assert) {
assert.equal(this.$('.private-message-map').length, 1);
assert.equal(this.$('.private-message-map .user').length, 1);
}
});