imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Device manager - promote to beta (#9380)

Browse source 
* promote new session manager to beta

* hide old sessions section when new dm enabled

* use correct logic

* add new ViewUserDeviceSettings action

* replace device management ctas with viewUserDeviceSettings

* test SecurityUserSettingsTab

* more complete mocks

* more thorough mocks

* more mocks

* test LabsUserSettingsTab

* lint

* updated copy

* update snaps for new copy
This commit is contained in:
Kerry 2022-10-11 11:10:55 +02:00 • committed by GitHub
parent b336e18eae
commit 87d3fbd996
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
15 changed files with 504 additions and 19 deletions
Download patch file Download diff file Expand all files Collapse all files

48
test/actions/handlers/viewUserDeviceSettings-test.ts Normal file
View file

@ -0,0 +1,48 @@
/*
Copyright 2022 The Matrix.org Foundation C.I.C.
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
import { viewUserDeviceSettings } from "../../../src/actions/handlers/viewUserDeviceSettings";
import { UserTab } from "../../../src/components/views/dialogs/UserTab";
import { Action } from "../../../src/dispatcher/actions";
import defaultDispatcher from "../../../src/dispatcher/dispatcher";
describe('viewUserDeviceSettings()', () => {
const dispatchSpy = jest.spyOn(defaultDispatcher, 'dispatch');
beforeEach(() => {
dispatchSpy.mockClear();
});
it('dispatches action to view new session manager when enabled', () => {
const isNewDeviceManagerEnabled = true;
viewUserDeviceSettings(isNewDeviceManagerEnabled);
expect(dispatchSpy).toHaveBeenCalledWith({
action: Action.ViewUserSettings,
initialTabId: UserTab.SessionManager,
});
});
it('dispatches action to view old session manager when disabled', () => {
const isNewDeviceManagerEnabled = false;
viewUserDeviceSettings(isNewDeviceManagerEnabled);
expect(dispatchSpy).toHaveBeenCalledWith({
action: Action.ViewUserSettings,
initialTabId: UserTab.Security,
});
});
});

73
test/components/views/settings/tabs/user/LabsUserSettingsTab-test.tsx Normal file
View file

@ -0,0 +1,73 @@
/*
Copyright 2022 The Matrix.org Foundation C.I.C.
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
import React from 'react';
import { render } from '@testing-library/react';
import LabsUserSettingsTab from '../../../../../../src/components/views/settings/tabs/user/LabsUserSettingsTab';
import SettingsStore from '../../../../../../src/settings/SettingsStore';
import {
getMockClientWithEventEmitter,
mockClientMethodsServer,
mockClientMethodsUser,
} from '../../../../../test-utils';
import SdkConfig from '../../../../../../src/SdkConfig';
describe('<SecurityUserSettingsTab />', () => {
const sdkConfigSpy = jest.spyOn(SdkConfig, 'get');
const defaultProps = {
closeSettingsFn: jest.fn(),
};
const getComponent = () => <LabsUserSettingsTab {...defaultProps} />;
const userId = '@alice:server.org';
getMockClientWithEventEmitter({
...mockClientMethodsUser(userId),
...mockClientMethodsServer(),
});
const settingsValueSpy = jest.spyOn(SettingsStore, 'getValue');
beforeEach(() => {
jest.clearAllMocks();
settingsValueSpy.mockReturnValue(false);
sdkConfigSpy.mockReturnValue(false);
});
it('renders settings marked as beta as beta cards', () => {
const { getByTestId } = render(getComponent());
expect(getByTestId("labs-beta-section")).toMatchSnapshot();
});
it('does not render non-beta labs settings when disabled in config', () => {
const { container } = render(getComponent());
expect(sdkConfigSpy).toHaveBeenCalledWith('show_labs_settings');
const labsSections = container.getElementsByClassName('mx_SettingsTab_section');
// only section is beta section
expect(labsSections.length).toEqual(1);
});
it('renders non-beta labs settings when enabled in config', () => {
// enable labs
sdkConfigSpy.mockImplementation(configName => configName === 'show_labs_settings');
const { container } = render(getComponent());
const labsSections = container.getElementsByClassName('mx_SettingsTab_section');
expect(labsSections.length).toEqual(11);
});
});

68
test/components/views/settings/tabs/user/SecurityUserSettingsTab-test.tsx Normal file
View file

@ -0,0 +1,68 @@
/*
Copyright 2022 The Matrix.org Foundation C.I.C.
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
import { render } from '@testing-library/react';
import React from 'react';
import SecurityUserSettingsTab from "../../../../../../src/components/views/settings/tabs/user/SecurityUserSettingsTab";
import SettingsStore from '../../../../../../src/settings/SettingsStore';
import {
getMockClientWithEventEmitter,
mockClientMethodsServer,
mockClientMethodsUser,
mockClientMethodsCrypto,
mockClientMethodsDevice,
mockPlatformPeg,
} from '../../../../../test-utils';
describe('<SecurityUserSettingsTab />', () => {
const defaultProps = {
closeSettingsFn: jest.fn(),
};
const getComponent = () => <SecurityUserSettingsTab {...defaultProps} />;
const userId = '@alice:server.org';
const deviceId = 'alices-device';
getMockClientWithEventEmitter({
...mockClientMethodsUser(userId),
...mockClientMethodsServer(),
...mockClientMethodsDevice(deviceId),
...mockClientMethodsCrypto(),
getRooms: jest.fn().mockReturnValue([]),
getIgnoredUsers: jest.fn(),
});
const settingsValueSpy = jest.spyOn(SettingsStore, 'getValue');
beforeEach(() => {
mockPlatformPeg();
jest.clearAllMocks();
settingsValueSpy.mockReturnValue(false);
});
it('renders sessions section when new session manager is disabled', () => {
settingsValueSpy.mockReturnValue(false);
const { getByTestId } = render(getComponent());
expect(getByTestId('devices-section')).toBeTruthy();
});
it('does not render sessions section when new session manager is enabled', () => {
settingsValueSpy.mockReturnValue(true);
const { queryByTestId } = render(getComponent());
expect(queryByTestId('devices-section')).toBeFalsy();
});
});

196
test/components/views/settings/tabs/user/__snapshots__/LabsUserSettingsTab-test.tsx.snap Normal file
View file

@ -0,0 +1,196 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`<SecurityUserSettingsTab /> renders settings marked as beta as beta cards 1`] = `
<div
class="mx_SettingsTab_section"
data-testid="labs-beta-section"
>
<div
class="mx_BetaCard"
>
<div
class="mx_BetaCard_columns"
>
<div
class="mx_BetaCard_columns_description"
>
<h3
class="mx_BetaCard_title"
>
<span>
Video rooms
</span>
<span
class="mx_BetaCard_betaPill"
>
Beta
</span>
</h3>
<div
class="mx_BetaCard_caption"
>
<p>
A new way to chat over voice and video in .
</p>
<p>
Video rooms are always-on VoIP channels embedded within a room in .
</p>
</div>
<div
class="mx_BetaCard_buttons"
>
<div
class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary"
role="button"
tabindex="0"
>
Join the beta
</div>
</div>
<div
class="mx_BetaCard_refreshWarning"
>
Joining the beta will reload .
</div>
<div
class="mx_BetaCard_faq"
/>
</div>
<div
class="mx_BetaCard_columns_image_wrapper"
>
<img
alt=""
class="mx_BetaCard_columns_image"
src="image-file-stub"
/>
</div>
</div>
</div>
<div
class="mx_BetaCard"
>
<div
class="mx_BetaCard_columns"
>
<div
class="mx_BetaCard_columns_description"
>
<h3
class="mx_BetaCard_title"
>
<span>
Threads
</span>
<span
class="mx_BetaCard_betaPill"
>
Beta
</span>
</h3>
<div
class="mx_BetaCard_caption"
>
<p>
Keep discussions organised with threads.
</p>
<p>
<span>
Threads help keep conversations on-topic and easy to track.
<a
href="https://element.io/help#threads"
rel="noreferrer noopener"
target="_blank"
>
Learn more
</a>
.
</span>
</p>
</div>
<div
class="mx_BetaCard_buttons"
>
<div
class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary"
role="button"
tabindex="0"
>
Join the beta
</div>
</div>
<div
class="mx_BetaCard_refreshWarning"
>
Joining the beta will reload .
</div>
<div
class="mx_BetaCard_faq"
/>
</div>
<div
class="mx_BetaCard_columns_image_wrapper"
>
<img
alt=""
class="mx_BetaCard_columns_image"
src="image-file-stub"
/>
</div>
</div>
</div>
<div
class="mx_BetaCard"
>
<div
class="mx_BetaCard_columns"
>
<div
class="mx_BetaCard_columns_description"
>
<h3
class="mx_BetaCard_title"
>
<span>
New session manager
</span>
<span
class="mx_BetaCard_betaPill"
>
Beta
</span>
</h3>
<div
class="mx_BetaCard_caption"
>
<p>
Have greater visibility and control over all your sessions.
</p>
<p>
Our new sessions manager provides better visibility of all your sessions, and greater control over them including the ability to remotely toggle push notifications.
</p>
</div>
<div
class="mx_BetaCard_buttons"
>
<div
class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary"
role="button"
tabindex="0"
>
Join the beta
</div>
</div>
</div>
<div
class="mx_BetaCard_columns_image_wrapper"
>
<img
alt=""
class="mx_BetaCard_columns_image"
/>
</div>
</div>
</div>
</div>
`;

32
test/test-utils/client.ts
View file

@ -15,7 +15,7 @@ limitations under the License.
*/
import EventEmitter from "events";
import { MethodKeysOf, mocked, MockedObject } from "jest-mock";
import { MethodKeysOf, mocked, MockedObject, PropertyKeysOf } from "jest-mock";
import { MatrixClient, User } from "matrix-js-sdk/src/matrix";
import { MatrixClientPeg } from "../../src/MatrixClientPeg";
@ -71,6 +71,7 @@ export const mockClientMethodsUser = (userId = '@alice:domain') => ({
credentials: { userId },
getThreePids: jest.fn().mockResolvedValue({ threepids: [] }),
getAccessToken: jest.fn(),
getDeviceId: jest.fn(),
});
/**
@ -94,6 +95,35 @@ export const mockClientMethodsServer = (): Partial<Record<MethodKeysOf<MatrixCli
getIdentityServerUrl: jest.fn(),
getHomeserverUrl: jest.fn(),
getCapabilities: jest.fn().mockReturnValue({}),
getClientWellKnown: jest.fn().mockReturnValue({}),
doesServerSupportUnstableFeature: jest.fn().mockResolvedValue(false),
});
export const mockClientMethodsDevice = (
deviceId = 'test-device-id',
): Partial<Record<MethodKeysOf<MatrixClient>, unknown>> => ({
getDeviceId: jest.fn().mockReturnValue(deviceId),
getDeviceEd25519Key: jest.fn(),
getDevices: jest.fn().mockResolvedValue({ devices: [] }),
});
export const mockClientMethodsCrypto = (): Partial<Record<
MethodKeysOf<MatrixClient> & PropertyKeysOf<MatrixClient>, unknown>
> => ({
isCryptoEnabled: jest.fn(),
isSecretStorageReady: jest.fn(),
isCrossSigningReady: jest.fn(),
isKeyBackupKeyStored: jest.fn(),
getCrossSigningCacheCallbacks: jest.fn().mockReturnValue({ getCrossSigningKeyCache: jest.fn() }),
getStoredCrossSigningForUser: jest.fn(),
checkKeyBackup: jest.fn().mockReturnValue({}),
crypto: {
getSessionBackupPrivateKey: jest.fn(),
secretStorage: { hasKey: jest.fn() },
crossSigningInfo: {
getId: jest.fn(),
isStoredInSecretStorage: jest.fn(),
},
},
});