[TESTS] Add E2E tests to discussions (#2970)

* [E2E TEST] Discussions

* fix error Cannot find UI elemen

* Fix tests

Co-authored-by: Diego Mello <diegolmello@gmail.com>
This commit is contained in:
Gung Wah 2021-03-18 22:36:50 +08:00 committed by GitHub
parent 460e82f759
commit e1a7f43552
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 162 additions and 19 deletions

View File

@ -16,8 +16,11 @@ const keyExtractor = item => item.value.toString();
// RectButton doesn't work on modal (Android) // RectButton doesn't work on modal (Android)
const Item = ({ const Item = ({
item, selected, onSelect, theme item, selected, onSelect, theme
}) => ( }) => {
const itemName = item.value.name || item.text.text.toLowerCase();
return (
<Touchable <Touchable
testID={`multi-select-item-${ itemName }`}
key={item} key={item}
onPress={() => onSelect(item)} onPress={() => onSelect(item)}
style={[ style={[
@ -31,7 +34,8 @@ const Item = ({
{selected ? <Check theme={theme} /> : null} {selected ? <Check theme={theme} /> : null}
</> </>
</Touchable> </Touchable>
); );
};
Item.propTypes = { Item.propTypes = {
item: PropTypes.object, item: PropTypes.object,
selected: PropTypes.number, selected: PropTypes.number,

View File

@ -112,6 +112,7 @@ export const MultiSelect = React.memo(({
<View style={[styles.modal, { backgroundColor: themes[theme].backgroundColor }]}> <View style={[styles.modal, { backgroundColor: themes[theme].backgroundColor }]}>
<View style={[styles.content, { backgroundColor: themes[theme].backgroundColor }]}> <View style={[styles.content, { backgroundColor: themes[theme].backgroundColor }]}>
<TextInput <TextInput
testID='multi-select-search'
onChangeText={onSearch || onSearchChange} onChangeText={onSearch || onSearchChange}
placeholder={I18n.t('Search')} placeholder={I18n.t('Search')}
theme={theme} theme={theme}

View File

@ -27,7 +27,6 @@ class RoomItemContainer extends React.Component {
onPress: PropTypes.func, onPress: PropTypes.func,
username: PropTypes.string, username: PropTypes.string,
avatarSize: PropTypes.number, avatarSize: PropTypes.number,
testID: PropTypes.string,
width: PropTypes.number, width: PropTypes.number,
status: PropTypes.string, status: PropTypes.string,
toggleFav: PropTypes.func, toggleFav: PropTypes.func,
@ -123,7 +122,6 @@ class RoomItemContainer extends React.Component {
toggleFav, toggleFav,
toggleRead, toggleRead,
hideChannel, hideChannel,
testID,
theme, theme,
isFocused, isFocused,
avatarSize, avatarSize,
@ -134,6 +132,7 @@ class RoomItemContainer extends React.Component {
swipeEnabled swipeEnabled
} = this.props; } = this.props;
const name = getRoomTitle(item); const name = getRoomTitle(item);
const testID = `rooms-list-view-item-${ name }`;
const avatar = getRoomAvatar(item); const avatar = getRoomAvatar(item);
const isRead = getIsRead(item); const isRead = getIsRead(item);
const date = item.roomUpdatedAt && formatDate(item.roomUpdatedAt); const date = item.roomUpdatedAt && formatDate(item.roomUpdatedAt);

View File

@ -179,6 +179,7 @@ class CreateChannelView extends React.Component {
/> />
<TextInput <TextInput
label={I18n.t('Discussion_name')} label={I18n.t('Discussion_name')}
testID='multi-select-discussion-name'
placeholder={I18n.t('A_meaningful_name_for_the_discussion_room')} placeholder={I18n.t('A_meaningful_name_for_the_discussion_room')}
containerStyle={styles.inputStyle} containerStyle={styles.inputStyle}
defaultValue={name} defaultValue={name}

View File

@ -908,7 +908,6 @@ class RoomsListView extends React.Component {
username={username} username={username}
showLastMessage={StoreLastMessage} showLastMessage={StoreLastMessage}
onPress={this.onPressItem} onPress={this.onPressItem}
testID={`rooms-list-view-item-${ item.name }`}
width={isMasterDetail ? MAX_SIDEBAR_WIDTH : width} width={isMasterDetail ? MAX_SIDEBAR_WIDTH : width}
toggleFav={this.toggleFav} toggleFav={this.toggleFav}
toggleRead={this.toggleRead} toggleRead={this.toggleRead}

View File

@ -0,0 +1,139 @@
const {
expect, element, by, waitFor
} = require('detox');
const { navigateToLogin, login, mockMessage, tapBack, searchRoom } = require('../../helpers/app');
const data = require('../../data');
const channel = data.groups.private.name;
const navigateToRoom = async() => {
await searchRoom(channel);
await waitFor(element(by.id(`rooms-list-view-item-${ channel }`))).toExist().withTimeout(60000);
await element(by.id(`rooms-list-view-item-${ channel }`)).tap();
await waitFor(element(by.id('room-view'))).toBeVisible().withTimeout(5000);
}
describe('Discussion', () => {
before(async() => {
await device.launchApp({ permissions: { notifications: 'YES' }, newInstance: true, delete: true });
await navigateToLogin();
await login(data.users.regular.username, data.users.regular.password)
});
it('should create discussion from NewMessageView', async() => {
const discussionName = `${data.random} Discussion NewMessageView`;
await element(by.id('rooms-list-view-create-channel')).tap();
await waitFor(element(by.id('new-message-view'))).toExist().withTimeout(2000);
await element(by.label('Create Discussion')).tap();
await waitFor(element(by.id('create-discussion-view'))).toExist().withTimeout(60000);
await expect(element(by.id('create-discussion-view'))).toExist();
await element(by.label('Select a Channel...')).tap();
await element(by.id('multi-select-search')).replaceText(`${channel}`);
await waitFor(element(by.id(`multi-select-item-${channel}`))).toExist().withTimeout(10000);
await element(by.id(`multi-select-item-${channel}`)).tap();
await element(by.id('multi-select-discussion-name')).replaceText(discussionName);
await waitFor(element(by.id(`create-discussion-submit`))).toExist().withTimeout(10000);
await element(by.id('create-discussion-submit')).tap();
await waitFor(element(by.id('room-view'))).toExist().withTimeout(10000);
await waitFor(element(by.id(`room-view-title-${ discussionName }`))).toExist().withTimeout(5000);
await tapBack();
await waitFor(element(by.id(`rooms-list-view-item-${ discussionName }`))).toExist().withTimeout(5000);
});
it('should create discussion from action button', async() => {
const discussionName = `${data.random} Discussion Action Button`;
await navigateToRoom();
await element(by.id('messagebox-actions')).tap();
await waitFor(element(by.id('action-sheet'))).toExist().withTimeout(2000);
await element(by.label('Create Discussion')).tap();
await waitFor(element(by.id('create-discussion-view'))).toExist().withTimeout(2000);
await element(by.id('multi-select-discussion-name')).replaceText(discussionName);
await waitFor(element(by.id(`create-discussion-submit`))).toExist().withTimeout(10000);
await element(by.id('create-discussion-submit')).tap();
await waitFor(element(by.id('room-view'))).toExist().withTimeout(10000);
await waitFor(element(by.id(`room-view-title-${ discussionName }`))).toExist().withTimeout(5000);
});
describe('Create Discussion from action sheet', async() => {
it('should send a message', async() => {
await waitFor(element(by.id('messagebox'))).toBeVisible().withTimeout(60000);
await mockMessage('message');
});
it('should create discussion', async() => {
const discussionName = `${ data.random }message`;
await element(by.label(discussionName)).atIndex(0).longPress();
await waitFor(element(by.id('action-sheet'))).toExist().withTimeout(2000);
await element(by.label(`Start a Discussion`)).atIndex(0).tap();
await waitFor(element(by.id('create-discussion-view'))).toExist().withTimeout(2000);
await element(by.id('create-discussion-submit')).tap();
await waitFor(element(by.id('room-view'))).toExist().withTimeout(10000);
await waitFor(element(by.id(`room-view-title-${ discussionName }`))).toExist().withTimeout(5000);
});
});
describe('Check RoomActionsView render', async() => {
it('should navigete to RoomActionsView', async() => {
await waitFor(element(by.id('room-view-header-actions'))).toBeVisible().withTimeout(5000);
await element(by.id('room-view-header-actions')).tap();
await waitFor(element(by.id('room-actions-view'))).toBeVisible().withTimeout(5000);
});
it('should have room actions screen', async() => {
await expect(element(by.id('room-actions-view'))).toBeVisible();
});
it('should have info', async() => {
await expect(element(by.id('room-actions-info'))).toBeVisible();
});
it('should have members', async() => {
await expect(element(by.id('room-actions-members'))).toBeVisible();
});
it('should have files', async() => {
await expect(element(by.id('room-actions-files'))).toBeVisible();
});
it('should have mentions', async() => {
await expect(element(by.id('room-actions-mentioned'))).toBeVisible();
});
it('should have starred', async() => {
await expect(element(by.id('room-actions-starred'))).toBeVisible();
});
it('should have search', async() => {
await expect(element(by.id('room-actions-search'))).toBeVisible();
});
it('should have share', async() => {
await element(by.type('UIScrollView')).atIndex(1).swipe('up');
await expect(element(by.id('room-actions-share'))).toBeVisible();
});
it('should have pinned', async() => {
await expect(element(by.id('room-actions-pinned'))).toBeVisible();
});
it('should not have notifications', async() => {
await expect(element(by.id('room-actions-notifications'))).toBeVisible();
});
it('should not have leave channel', async() => {
await expect(element(by.id('room-actions-leave-channel'))).toBeVisible();
});
it('should navigate to RoomActionView', async() => {
await element(by.type('UIScrollView')).atIndex(1).swipe('down');
await expect(element(by.id('room-actions-info'))).toBeVisible();
await element(by.id('room-actions-info')).tap();
await waitFor(element(by.id('room-info-view'))).toExist().withTimeout(60000);
await expect(element(by.id('room-info-view'))).toExist();
});
it('should not have edit button', async() => {
await expect(element(by.id('room-info-view-edit-button'))).toBeNotVisible();
});
});
});