129 lines
6.7 KiB
TypeScript
129 lines
6.7 KiB
TypeScript
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
|
|
// See LICENSE.txt for license information.
|
|
|
|
import {timeouts, wait} from '@support/utils';
|
|
import {expect} from 'detox';
|
|
|
|
import ProfilePicture from './profile_picture';
|
|
|
|
class Autocomplete {
|
|
testID = {
|
|
atMentionItemPrefix: 'autocomplete.at_mention_item.',
|
|
groupMentionItemPrefix: 'autocomplete.group_mention_item.',
|
|
specialMentionItemPrefix: 'autocomplete.special_mention_item.',
|
|
channelMentionItemPrefix: 'autocomplete.channel_mention_item.',
|
|
emojiSuggestionItemPrefix: 'autocomplete.emoji_suggestion_item.',
|
|
slashSuggestionItemPrefix: 'autocomplete.slash_suggestion_item.',
|
|
autocomplete: 'autocomplete',
|
|
sectionAtMentionList: 'autocomplete.at_mention.section_list',
|
|
sectionChannelMentionList: 'autocomplete.channel_mention.section_list',
|
|
flatEmojiSuggestionList: 'autocomplete.emoji_suggestion.flat_list',
|
|
flatSlashSuggestionList: 'autocomplete.slash_suggestion.flat_list',
|
|
};
|
|
|
|
autocomplete = element(by.id(this.testID.autocomplete));
|
|
sectionAtMentionList = element(by.id(this.testID.sectionAtMentionList));
|
|
sectionChannelMentionList = element(by.id(this.testID.sectionChannelMentionList));
|
|
flatEmojiSuggestionList = element(by.id(this.testID.flatEmojiSuggestionList));
|
|
flatSlashSuggestionList = element(by.id(this.testID.flatSlashSuggestionList));
|
|
|
|
getAtMentionItem = (userId: string) => {
|
|
const atMentionItemTestId = `${this.testID.atMentionItemPrefix}${userId}`;
|
|
const atMentionItemMatcher = by.id(atMentionItemTestId);
|
|
const atMentionItemProfilePictureMatcher = ProfilePicture.getProfilePictureItemMatcher(this.testID.atMentionItemPrefix, userId);
|
|
const atMentionItemBotTagMatcher = by.id(`${atMentionItemTestId}.bot.tag`);
|
|
const atMentionItemGuestTagMatcher = by.id(`${atMentionItemTestId}.guest.tag`);
|
|
const atMentionItemUserDisplayNameMatcher = by.id(`${atMentionItemTestId}.display_name`);
|
|
const atMentionItemCurrentUserIndicatorMatcher = by.id(`${atMentionItemTestId}.current_user_indicator`);
|
|
const atMentionItemUsernameMatcher = by.id(`${atMentionItemTestId}.username`);
|
|
|
|
return {
|
|
atMentionItem: element(atMentionItemMatcher),
|
|
atMentionItemProfilePicture: element(atMentionItemProfilePictureMatcher),
|
|
atMentionItemBotTag: element(atMentionItemBotTagMatcher),
|
|
atMentionItemGuestTag: element(atMentionItemGuestTagMatcher),
|
|
atMentionItemUserDisplayName: element(atMentionItemUserDisplayNameMatcher),
|
|
atMentionItemCurrentUserIndicator: element(atMentionItemCurrentUserIndicatorMatcher),
|
|
atMentionItemUsername: element(atMentionItemUsernameMatcher),
|
|
};
|
|
};
|
|
|
|
getGrouptMentionItem = (groupName: string) => {
|
|
const groupMentionItemTestId = `${this.testID.groupMentionItemPrefix}${groupName}`;
|
|
const groupMentionItemMatcher = by.id(groupMentionItemTestId);
|
|
const groupMentionItemGroupDisplayNameMatcher = by.id(`${groupMentionItemTestId}.display_name`);
|
|
const groupMentionItemGroupNameMatcher = by.id(`${groupMentionItemTestId}.name`);
|
|
|
|
return {
|
|
groupMentionItem: element(groupMentionItemMatcher),
|
|
groupMentionItemGroupDisplayName: element(groupMentionItemGroupDisplayNameMatcher),
|
|
groupMentionItemGroupName: element(groupMentionItemGroupNameMatcher),
|
|
};
|
|
};
|
|
|
|
getSpecialMentionItem = (handleName: string) => {
|
|
const specialMentionItemTestId = `${this.testID.specialMentionItemPrefix}${handleName}`;
|
|
const specialMentionItemMatcher = by.id(specialMentionItemTestId);
|
|
const specialMentionItemGroupDisplayNameMatcher = by.id(`${specialMentionItemTestId}.display_name`);
|
|
const specialMentionItemGroupNameMatcher = by.id(`${specialMentionItemTestId}.name`);
|
|
|
|
return {
|
|
specialMentionItem: element(specialMentionItemMatcher),
|
|
specialMentionItemGroupDisplayName: element(specialMentionItemGroupDisplayNameMatcher),
|
|
specialMentionItemGroupName: element(specialMentionItemGroupNameMatcher),
|
|
};
|
|
};
|
|
|
|
getChannelMentionItem = (channelName: string) => {
|
|
const channelMentionItemTestId = `${this.testID.channelMentionItemPrefix}${channelName}`;
|
|
const channelMentionItemMatcher = by.id(channelMentionItemTestId);
|
|
const channelMentionItemChannelDisplayNameMatcher = by.id(`${channelMentionItemTestId}.display_name`);
|
|
const channelMentionItemChannelNameMatcher = by.id(`${channelMentionItemTestId}.name`);
|
|
|
|
return {
|
|
channelMentionItem: element(channelMentionItemMatcher),
|
|
channelMentionItemChannelDisplayName: element(channelMentionItemChannelDisplayNameMatcher),
|
|
channelMentionItemChannelName: element(channelMentionItemChannelNameMatcher),
|
|
};
|
|
};
|
|
|
|
getEmojiSuggestionItem = (emojiName: string) => {
|
|
const emojiSuggestionItemTestId = `${this.testID.emojiSuggestionItemPrefix}${emojiName}`;
|
|
const emojiSuggestionItemMatcher = by.id(emojiSuggestionItemTestId);
|
|
const emojiSuggestionItemEmojiNameMatcher = by.id(`${emojiSuggestionItemTestId}.name`);
|
|
|
|
return {
|
|
emojiSuggestionItem: element(emojiSuggestionItemMatcher),
|
|
emojiSuggestionItemEmojiName: element(emojiSuggestionItemEmojiNameMatcher),
|
|
};
|
|
};
|
|
|
|
getSlashSuggestionItem = (slashCommand: string) => {
|
|
const slashSuggestionItemTestId = `${this.testID.slashSuggestionItemPrefix}/${slashCommand}`;
|
|
const slashSuggestionItemMatcher = by.id(slashSuggestionItemTestId);
|
|
const slashSuggestionItemSlashCommandNameMatcher = by.id(`${slashSuggestionItemTestId}.name`);
|
|
const slashSuggestionItemSlashCommandDescriptionMatcher = by.id(`${slashSuggestionItemTestId}.description`);
|
|
|
|
return {
|
|
slashSuggestionItem: element(slashSuggestionItemMatcher),
|
|
slashSuggestionItemSlashCommandName: element(slashSuggestionItemSlashCommandNameMatcher),
|
|
slashSuggestionItemSlashCommandDescription: element(slashSuggestionItemSlashCommandDescriptionMatcher),
|
|
};
|
|
};
|
|
|
|
toBeVisible = async (isVisible = true) => {
|
|
await wait(timeouts.ONE_SEC);
|
|
if (isVisible) {
|
|
// Use a lower visibility threshold to account for keyboard controller positioning
|
|
// The autocomplete may be partially off-screen during keyboard animations
|
|
await expect(this.autocomplete.atIndex(0)).toBeVisible(1);
|
|
return this.autocomplete;
|
|
}
|
|
|
|
await expect(this.autocomplete).not.toBeVisible();
|
|
return null;
|
|
};
|
|
}
|
|
|
|
const autocomplete = new Autocomplete();
|
|
export default autocomplete;
|