forked from Ivasoft/mattermost-mobile
MM-28688 Close sidebar when current channel is selected (#4897)
* MM-28688 Close sidebar when current channel is selected * Update snapshot * Apply suggestions from code review Co-authored-by: Joseph Baylon <joseph.baylon@mattermost.com> * Fix iOS select_channel e2e and feedback review Co-authored-by: Joseph Baylon <joseph.baylon@mattermost.com>
This commit is contained in:
@@ -14,6 +14,7 @@ export default class DrawerSwiper extends Component {
|
||||
drawerWidth: PropTypes.number.isRequired,
|
||||
onPageSelected: PropTypes.func,
|
||||
showTeams: PropTypes.bool.isRequired,
|
||||
testID: PropTypes.string,
|
||||
theme: PropTypes.object.isRequired,
|
||||
};
|
||||
|
||||
@@ -70,6 +71,7 @@ export default class DrawerSwiper extends Component {
|
||||
children,
|
||||
drawerWidth,
|
||||
showTeams,
|
||||
testID,
|
||||
theme,
|
||||
} = this.props;
|
||||
|
||||
@@ -88,6 +90,7 @@ export default class DrawerSwiper extends Component {
|
||||
scrollEnabled={showTeams}
|
||||
showsPagination={showTeams}
|
||||
keyboardShouldPersistTaps={'always'}
|
||||
testID={testID}
|
||||
>
|
||||
{children}
|
||||
</Swiper>
|
||||
|
||||
@@ -256,6 +256,7 @@ export default class MainSidebarBase extends Component {
|
||||
showTeams={showTeams}
|
||||
drawerOpened={this.state.drawerOpened}
|
||||
drawerWidth={drawerWidth - offset}
|
||||
testID='main_sidebar'
|
||||
>
|
||||
{lists}
|
||||
</DrawerSwiper>
|
||||
@@ -266,6 +267,11 @@ export default class MainSidebarBase extends Component {
|
||||
selectChannel = (channel, currentChannelId, closeDrawer = true) => {
|
||||
const {logChannelSwitch, handleSelectChannel} = this.props.actions;
|
||||
|
||||
if (closeDrawer) {
|
||||
telemetry.start(['channel:close_drawer']);
|
||||
this.closeMainSidebar();
|
||||
}
|
||||
|
||||
if (channel.id === currentChannelId) {
|
||||
return;
|
||||
}
|
||||
@@ -274,11 +280,6 @@ export default class MainSidebarBase extends Component {
|
||||
|
||||
tracker.channelSwitch = Date.now();
|
||||
|
||||
if (closeDrawer) {
|
||||
telemetry.start(['channel:close_drawer']);
|
||||
this.closeMainSidebar();
|
||||
}
|
||||
|
||||
if (!channel) {
|
||||
const utils = require('app/utils/general');
|
||||
const intl = this.getIntl();
|
||||
|
||||
@@ -32,6 +32,7 @@ export default class Swiper extends PureComponent {
|
||||
]),
|
||||
width: PropTypes.number,
|
||||
onScrollBegin: PropTypes.func,
|
||||
testID: PropTypes.string,
|
||||
};
|
||||
|
||||
static defaultProps = {
|
||||
@@ -251,6 +252,7 @@ export default class Swiper extends PureComponent {
|
||||
render() {
|
||||
const {
|
||||
children,
|
||||
testID,
|
||||
width,
|
||||
} = this.props;
|
||||
|
||||
@@ -270,6 +272,7 @@ export default class Swiper extends PureComponent {
|
||||
<View
|
||||
style={[styles.container]}
|
||||
onLayout={this.onLayout}
|
||||
testID={testID}
|
||||
>
|
||||
{this.renderScrollView(pages)}
|
||||
{this.renderPagination()}
|
||||
|
||||
@@ -33,6 +33,7 @@ exports[`ChannelTitle should match snapshot 1`] = `
|
||||
"textAlign": "center",
|
||||
}
|
||||
}
|
||||
testID="channel.nav_bar.title"
|
||||
>
|
||||
My Channel
|
||||
</Text>
|
||||
@@ -83,6 +84,7 @@ exports[`ChannelTitle should match snapshot when is DM and has guests and the te
|
||||
"textAlign": "center",
|
||||
}
|
||||
}
|
||||
testID="channel.nav_bar.title"
|
||||
>
|
||||
Other user
|
||||
</Text>
|
||||
@@ -158,6 +160,7 @@ exports[`ChannelTitle should match snapshot when is DM and has guests but the te
|
||||
"textAlign": "center",
|
||||
}
|
||||
}
|
||||
testID="channel.nav_bar.title"
|
||||
>
|
||||
Other user
|
||||
</Text>
|
||||
@@ -208,6 +211,7 @@ exports[`ChannelTitle should match snapshot when isSelfDMChannel is true 1`] = `
|
||||
"textAlign": "center",
|
||||
}
|
||||
}
|
||||
testID="channel.nav_bar.title"
|
||||
>
|
||||
<FormattedText
|
||||
defaultMessage="{displayname} (you)"
|
||||
|
||||
@@ -162,6 +162,7 @@ export default class ChannelTitle extends PureComponent {
|
||||
ellipsizeMode='tail'
|
||||
numberOfLines={1}
|
||||
style={style.text}
|
||||
testID='channel.nav_bar.title'
|
||||
>
|
||||
{channelDisplayName}
|
||||
</Text>
|
||||
|
||||
@@ -12,11 +12,11 @@ export const wait = async (ms) => {
|
||||
};
|
||||
|
||||
export const isAndroid = () => {
|
||||
return !process.env.IOS;
|
||||
return device.getPlatform() === 'android';
|
||||
};
|
||||
|
||||
export const isIos = () => {
|
||||
return process.env.IOS;
|
||||
return device.getPlatform() === 'ios';
|
||||
};
|
||||
|
||||
/**
|
||||
|
||||
@@ -7,8 +7,7 @@
|
||||
// - Use element testID when selecting an element. Create one if none.
|
||||
// *******************************************************************
|
||||
|
||||
import {toChannelScreen} from '@support/ui/screen';
|
||||
|
||||
import {logoutUser, toChannelScreen} from '@support/ui/screen';
|
||||
import {Setup} from '@support/server_api';
|
||||
|
||||
describe('Autocomplete', () => {
|
||||
@@ -29,6 +28,10 @@ describe('Autocomplete', () => {
|
||||
await postInput.tap();
|
||||
});
|
||||
|
||||
afterAll(async () => {
|
||||
await logoutUser();
|
||||
});
|
||||
|
||||
it('MM-T3409_1 should suggest user based on username', async () => {
|
||||
// # Type "@" to activate at mention autocomplete
|
||||
await expect(element(by.id('autocomplete.at_mention.list'))).not.toExist();
|
||||
|
||||
@@ -7,7 +7,7 @@
|
||||
// - Use element testID when selecting an element. Create one if none.
|
||||
// *******************************************************************
|
||||
|
||||
import {toChannelScreen} from '@support/ui/screen';
|
||||
import {logoutUser, toChannelScreen} from '@support/ui/screen';
|
||||
import jestExpect from 'expect';
|
||||
|
||||
import {Setup} from '@support/server_api';
|
||||
@@ -19,6 +19,10 @@ describe('Channels', () => {
|
||||
await toChannelScreen(user);
|
||||
});
|
||||
|
||||
afterAll(async () => {
|
||||
await logoutUser();
|
||||
});
|
||||
|
||||
it('MM-T3201 Create public channel', async () => {
|
||||
// # Go to channel sidebar list
|
||||
await element(by.id('channel_drawer.button')).tap();
|
||||
|
||||
52
detox/e2e/test/main_sidebar/select_channel.e2e.js
Normal file
52
detox/e2e/test/main_sidebar/select_channel.e2e.js
Normal file
@@ -0,0 +1,52 @@
|
||||
// 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 {logoutUser, toChannelScreen} from '@support/ui/screen';
|
||||
import {isAndroid} from '@support/utils';
|
||||
import {Setup} from '@support/server_api';
|
||||
|
||||
describe('Select channel', () => {
|
||||
let newChannel;
|
||||
|
||||
beforeAll(async () => {
|
||||
const {user, channel} = await Setup.apiInit();
|
||||
newChannel = channel;
|
||||
|
||||
await toChannelScreen(user);
|
||||
});
|
||||
|
||||
afterAll(async () => {
|
||||
await logoutUser();
|
||||
});
|
||||
|
||||
it('MM-T3412 should close the sidebar menu when selecting the same channel', async () => {
|
||||
// # Open channel drawer (with at least one unread channel)
|
||||
await element(by.id('channel_drawer.button')).tap();
|
||||
|
||||
// * Main sidebar should be visible
|
||||
await expect(element(by.id('main_sidebar'))).toBeVisible();
|
||||
|
||||
// # Tap a channel to view it
|
||||
await element(by.text(newChannel.display_name).withAncestor(by.id('channels_list'))).tap();
|
||||
|
||||
// * Selected channel should be visible
|
||||
await expect(element(by.id('channel.nav_bar.title'))).toHaveText(newChannel.display_name);
|
||||
|
||||
// # Open channel drawer again and select the same channel
|
||||
await element(by.id('channel_drawer.button')).tap();
|
||||
await element(by.text(newChannel.display_name).withAncestor(by.id('channels_list'))).tap();
|
||||
|
||||
// * Selected channel should remain the same
|
||||
if (isAndroid()) {
|
||||
// * drawer should not be visible on Android
|
||||
await expect(element(by.id('main_sidebar'))).not.toBeVisible();
|
||||
}
|
||||
await expect(element(by.id('channel.nav_bar.title'))).toHaveText(newChannel.display_name);
|
||||
});
|
||||
});
|
||||
@@ -8,9 +8,14 @@
|
||||
// *******************************************************************
|
||||
|
||||
import {Setup, System} from '@support/server_api';
|
||||
import {logoutUser} from '@support/ui/screen';
|
||||
import {serverUrl} from '@support/test_config';
|
||||
|
||||
describe('Smoke Tests', () => {
|
||||
afterAll(async () => {
|
||||
await logoutUser();
|
||||
});
|
||||
|
||||
it('MM-T3179 Log in - Email / password', async () => {
|
||||
const {config} = await System.apiGetConfig();
|
||||
const {user} = await Setup.apiInit();
|
||||
|
||||
@@ -8,6 +8,7 @@
|
||||
// *******************************************************************
|
||||
|
||||
import {Ldap, Setup, System, Team, User} from '@support/server_api';
|
||||
import {logoutUser} from '@support/ui/screen';
|
||||
import {serverUrl} from '@support/test_config';
|
||||
import ldapUsers from '@support/fixtures/ldap_users.json';
|
||||
|
||||
@@ -28,6 +29,10 @@ describe('Smoke Tests', () => {
|
||||
await ensureUserHasTeam(testOne);
|
||||
});
|
||||
|
||||
afterAll(async () => {
|
||||
await logoutUser();
|
||||
});
|
||||
|
||||
it('MM-T3180 Log in - LDAP', async () => {
|
||||
// * Verify that it starts with the Select Server screen
|
||||
await expect(element(by.id('select_server_screen'))).toBeVisible();
|
||||
|
||||
Reference in New Issue
Block a user