Location share type UI (#7924)
* copyright Signed-off-by: Kerry Archibald <kerrya@element.io> * empty line Signed-off-by: Kerry Archibald <kerrya@element.io> * functional picker Signed-off-by: Kerry Archibald <kerrya@element.io> * most style Signed-off-by: Kerry Archibald <kerrya@element.io> * nice style for options Signed-off-by: Kerry Archibald <kerrya@element.io> * get ShareType test passing Signed-off-by: Kerry Archibald <kerrya@element.io> * add maplibre mock Signed-off-by: Kerry Archibald <kerrya@element.io> * lint and test Signed-off-by: Kerry Archibald <kerrya@element.io> * add section to themes for location sharing cols Signed-off-by: Kerry Archibald <kerrya@element.io> * add svg mock Signed-off-by: Kerry Archibald <kerrya@element.io> * use same mock string as imageMock Signed-off-by: Kerry Archibald <kerrya@element.io> * newline Signed-off-by: Kerry Archibald <kerrya@element.io> * lint Signed-off-by: Kerry Archibald <kerrya@element.io> * add live location icon Signed-off-by: Kerry Archibald <kerrya@element.io> * rename useEnabledShareTypes Signed-off-by: Kerry Archibald <kerrya@element.io> * use solid color for live border * use ternary Signed-off-by: Kerry Archibald <kerrya@element.io> Co-authored-by: Michael Telatynski <7t3chguy@gmail.com>
This commit is contained in:
parent
547144a565
commit
b480bffab0
15 changed files with 354 additions and 298 deletions
|
@ -17,15 +17,46 @@ limitations under the License.
|
|||
import React from 'react';
|
||||
import { mount } from 'enzyme';
|
||||
import { RoomMember } from 'matrix-js-sdk/src/models/room-member';
|
||||
import { MatrixClient } from 'matrix-js-sdk/src/client';
|
||||
import { mocked } from 'jest-mock';
|
||||
import { act } from 'react-dom/test-utils';
|
||||
|
||||
import '../../../skinned-sdk';
|
||||
import LocationShareMenu from '../../../../src/components/views/location/LocationShareMenu';
|
||||
import MatrixClientContext from '../../../../src/contexts/MatrixClientContext';
|
||||
import { ChevronFace } from '../../../../src/components/structures/ContextMenu';
|
||||
import SettingsStore from '../../../../src/settings/SettingsStore';
|
||||
import { MatrixClientPeg } from '../../../../src/MatrixClientPeg';
|
||||
import { LocationShareType } from '../../../../src/components/views/location/ShareType';
|
||||
import { findByTestId } from '../../../test-utils';
|
||||
|
||||
jest.mock('../../../../src/components/views/messages/MLocationBody', () => ({
|
||||
findMapStyleUrl: jest.fn().mockReturnValue('test'),
|
||||
}));
|
||||
|
||||
jest.mock('../../../../src/settings/SettingsStore', () => ({
|
||||
getValue: jest.fn(),
|
||||
monitorSetting: jest.fn(),
|
||||
}));
|
||||
|
||||
jest.mock('../../../../src/stores/OwnProfileStore', () => ({
|
||||
OwnProfileStore: {
|
||||
instance: {
|
||||
displayName: 'Ernie',
|
||||
getHttpAvatarUrl: jest.fn().mockReturnValue('image.com/img'),
|
||||
},
|
||||
},
|
||||
}));
|
||||
|
||||
describe('<LocationShareMenu />', () => {
|
||||
const userId = '@ernie:server.org';
|
||||
const mockClient = {
|
||||
on: jest.fn(),
|
||||
removeListener: jest.fn(),
|
||||
getUserId: jest.fn().mockReturnValue(userId),
|
||||
getClientWellKnown: jest.fn().mockResolvedValue({
|
||||
map_style_url: 'maps.com',
|
||||
}),
|
||||
};
|
||||
|
||||
const defaultProps = {
|
||||
|
@ -36,7 +67,7 @@ describe('<LocationShareMenu />', () => {
|
|||
onFinished: jest.fn(),
|
||||
openMenu: jest.fn(),
|
||||
roomId: '!room:server.org',
|
||||
sender: { id: '@ernie:server.org' } as unknown as RoomMember,
|
||||
sender: new RoomMember('!room:server.org', userId),
|
||||
};
|
||||
const getComponent = (props = {}) =>
|
||||
mount(<LocationShareMenu {...defaultProps} {...props} />, {
|
||||
|
@ -44,8 +75,43 @@ describe('<LocationShareMenu />', () => {
|
|||
wrappingComponentProps: { value: mockClient },
|
||||
});
|
||||
|
||||
it('renders', () => {
|
||||
beforeEach(() => {
|
||||
mocked(SettingsStore).getValue.mockImplementation(
|
||||
(settingName) => settingName === "feature_location_share_pin_drop",
|
||||
);
|
||||
|
||||
jest.spyOn(MatrixClientPeg, 'get').mockReturnValue(mockClient as unknown as MatrixClient);
|
||||
});
|
||||
|
||||
const getShareTypeOption = (component, shareType: LocationShareType) =>
|
||||
findByTestId(component, `share-location-option-${shareType}`);
|
||||
|
||||
it('renders location picker when only Own share type is enabled', () => {
|
||||
mocked(SettingsStore).getValue.mockReturnValue(false);
|
||||
const component = getComponent();
|
||||
expect(component).toMatchSnapshot();
|
||||
expect(component.find('ShareType').length).toBeFalsy();
|
||||
expect(component.find('LocationPicker').length).toBeTruthy();
|
||||
});
|
||||
|
||||
it('renders share type switch with own and pin drop options when enabled', () => {
|
||||
// feature_location_share_pin_drop is set to enabled by default mocking
|
||||
const component = getComponent();
|
||||
expect(component.find('LocationPicker').length).toBeFalsy();
|
||||
|
||||
expect(getShareTypeOption(component, LocationShareType.Own).length).toBeTruthy();
|
||||
expect(getShareTypeOption(component, LocationShareType.Pin).length).toBeTruthy();
|
||||
});
|
||||
|
||||
it('selecting own location share type advances to location picker', () => {
|
||||
// feature_location_share_pin_drop is set to enabled by default mocking
|
||||
const component = getComponent();
|
||||
|
||||
act(() => {
|
||||
getShareTypeOption(component, LocationShareType.Own).at(0).simulate('click');
|
||||
});
|
||||
|
||||
component.setProps({});
|
||||
|
||||
expect(component.find('LocationPicker').length).toBeTruthy();
|
||||
});
|
||||
});
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue