MM-T3201 create public channel e2e test (#4867)

* MM-T3201 initial test purpose with detox

* MM-T3201 spaces and more comments

* MM_T3201 update snapshot tests to include test id

* MM-T3201 edit test ID to follow naming convention, PR fix

* MM-T3201 change comments to indicate if action or expect

* MM-T3201 add more testID to create buttons

* MM-T3201 adding trailing commas and testID

* MM-T3201 fix style

* MM-T3201 fix snaps test

* MM-T3201 fix conflicts with prior PR

* MM-T3201 using test dependent on platform to test button behaviour

* Update detox/e2e/test/channels/create_public_channel.e2e.js

Co-authored-by: Joseph Baylon <joseph.baylon@mattermost.com>

Co-authored-by: Joseph Baylon <joseph.baylon@mattermost.com>
This commit is contained in:
Hector 2020-10-15 19:13:41 +02:00 committed by GitHub
parent 3988e64d22
commit eb0f511bb7
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 92 additions and 3 deletions

View file

@ -211,7 +211,10 @@ class ChannelIntro extends PureComponent {
return (
<View>
<Text style={style.channelTitle}>
<Text
testID='channel_intro.beginning.text'
style={style.channelTitle}
>
{intl.formatMessage({
id: 'intro_messages.beginning',
defaultMessage: 'Beginning of {name}',

View file

@ -17,6 +17,7 @@ exports[`EditChannelInfo should match snapshot 1`] = `
"flex": 1,
}
}
testID="edit_channel.scroll"
>
<TouchableWithoutFeedback
onPress={[Function]}
@ -89,6 +90,7 @@ exports[`EditChannelInfo should match snapshot 1`] = `
"paddingHorizontal": 15,
}
}
testID="edit_channel.name.input"
underlineColorAndroid="transparent"
value="display_name"
/>
@ -172,6 +174,7 @@ exports[`EditChannelInfo should match snapshot 1`] = `
},
]
}
testID="edit_channel.purpose.input"
textAlignVertical="top"
underlineColorAndroid="transparent"
value="purpose"

View file

@ -241,6 +241,7 @@ export default class EditChannelInfo extends PureComponent {
<React.Fragment>
<StatusBar/>
<KeyboardAwareScrollView
testID='edit_channel.scroll'
ref={this.scroll}
style={style.container}
keyboardShouldPersistTaps={'always'}
@ -262,6 +263,7 @@ export default class EditChannelInfo extends PureComponent {
</View>
<View style={[style.inputContainer, padding(isLandscape)]}>
<TextInputWithLocalizedPlaceholder
testID='edit_channel.name.input'
ref={this.nameInput}
value={displayName}
onChangeText={this.onDisplayNameChangeText}
@ -294,6 +296,7 @@ export default class EditChannelInfo extends PureComponent {
</View>
<View style={[style.inputContainer, padding(isLandscape)]}>
<TextInputWithLocalizedPlaceholder
testID='edit_channel.purpose.input'
ref={this.purposeInput}
value={purpose}
onChangeText={this.onPurposeChangeText}

View file

@ -295,9 +295,10 @@ export default class List extends PureComponent {
this.setState({width: width - 40});
};
renderSectionAction = (styles, action, anchor) => {
renderSectionAction = (styles, action, anchor, id) => {
return (
<TouchableHighlight
testID={'action_button_' + id}
style={styles.actionContainer}
onPress={action}
underlayColor={'transparent'}
@ -345,7 +346,7 @@ export default class List extends PureComponent {
<View style={styles.separatorContainer}>
<View style={styles.separator}/>
</View>
{action && this.renderSectionAction(styles, action, anchor)}
{action && this.renderSectionAction(styles, action, anchor, id)}
</View>
</React.Fragment>
);

View file

@ -47,6 +47,7 @@ export default class CreateChannel extends PureComponent {
id: 'create-channel',
enabled: false,
showAsAction: 'always',
testID: 'edit_channel.create.button',
};
constructor(props, context) {

View file

@ -84,6 +84,7 @@ export default class MoreChannels extends PureComponent {
id: 'create-pub-channel',
text: context.intl.formatMessage({id: 'mobile.create_channel', defaultMessage: 'Create'}),
showAsAction: 'always',
testID: 'public_channels.create.button',
};
this.leftButton = {

View file

@ -0,0 +1,77 @@
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
// See LICENSE.txt for license information.
// *******************************************************************
// - [#] indicates a test step (e.g. # Go to a screen)
// - [*] indicates an assertion (e.g. * Check the title)
// - Use element testID when selecting an element. Create one if none.
// *******************************************************************
import {toChannelScreen} from '@support/ui/screen';
import jestExpect from 'expect';
import {Setup} from '@support/server_api';
describe('Channels', () => {
beforeAll(async () => {
const {user} = await Setup.apiInit();
await toChannelScreen(user);
});
it('MM-T3201 Create public channel', async () => {
// # Go to channel sidebar list
await element(by.id('channel_drawer.button')).tap();
// # Tap on + public channels
await element(by.id('action_button_sidebar.channels')).tap();
// * Expect a list of public channels, initially empty
await expect(element(by.text('No more channels to join'))).toBeVisible();
// # Tap to create new channel
await element(by.id('public_channels.create.button')).tap();
// * Expect a new screen to create a new public channel
await expect(element(by.text('New Public Channel'))).toBeVisible();
// # Fill data
await element(by.id('edit_channel.name.input')).typeText('a');
await attemptToTapButton('edit_channel.create.button');
// * Expect to be in the same screen since the channel name must be longer
await expect(element(by.id('edit_channel.name.input'))).toBeVisible();
await element(by.id('edit_channel.name.input')).typeText('bc');
await element(by.id('edit_channel.purpose.input')).typeText('This sentence has');
await element(by.id('edit_channel.purpose.input')).tapReturnKey();
await element(by.id('edit_channel.purpose.input')).typeText('multiple lines');
await element(by.id('edit_channel.scroll')).scroll(200, 'down');
await expect(element(by.id('edit_channel.header.input'))).toBeVisible();
const expectedChannelHeader = 'I 🌮 love 🌮 tacos 🌮';
await element(by.id('edit_channel.header.input')).replaceText(expectedChannelHeader);
await element(by.id('edit_channel.create.button')).tap();
const expectedChannelName = 'abc';
const expectedPurpose = 'This sentence has\nmultiple lines';
// * Expect a redirection to the created channel
await expect(element(by.id('channel_intro.beginning.text'))).toHaveText('Beginning of ' + expectedChannelName);
await element(by.id('channel.title.button')).tap();
// * Expect to see channel header and purpose in channel info
await expect(element(by.text(expectedChannelHeader))).toBeVisible();
await expect(element(by.text(expectedPurpose))).toBeVisible();
});
});
async function attemptToTapButton(id) {
if (device.getPlatform() === 'ios') {
const attributes = await element(by.id(id)).getAttributes();
jestExpect(attributes.visible).toEqual(true);
jestExpect(attributes.enabled).toEqual(false);
} else {
await element(by.id(id)).tap();
}
}