Support for login + E2EE set up with QR (#9403)

* Support for login + E2EE set up with QR * Whitespace * Padding * Refactor of fetch * Whitespace * CSS whitespace * Add link to MSC3906 * Handle incorrect typing in MatrixClientPeg.get() * Use unstable class name * fix: use unstable class name * Use default fetch client instead * Update to revised function name * Refactor device manager panel and make it work with new sessions manager * Lint fix * Add missing interstitials and update wording * Linting * i18n * Lint * Use sensible sdk config name for fallback server * Improve error handling for QR code generation * Refactor feature availability logic * Hide device manager panel if no options available * Put sign in with QR behind lab setting * Reduce scope of PR to just showing code on existing device * i18n updates * Handle null features * Testing for LoginWithQRSection * Refactor to handle UIA * Imports * Reduce diff complexity * Remove unnecessary change * Remove unused styles * Support UIA * Tidy up * i18n * Remove additional unused parts of flow * Add extra instruction when showing QR code * Add getVersions to server mocks * Use proper colours for theme support * Test cases * Lint * Remove obsolete snapshot * Don't override error if already set * Remove unused var * Update src/components/views/settings/devices/LoginWithQRSection.tsx Co-authored-by: Travis Ralston <travisr@matrix.org> * Update src/components/views/auth/LoginWithQR.tsx Co-authored-by: Travis Ralston <travisr@matrix.org> * Update src/components/views/auth/LoginWithQR.tsx Co-authored-by: Travis Ralston <travisr@matrix.org> * Update src/components/views/auth/LoginWithQR.tsx Co-authored-by: Travis Ralston <travisr@matrix.org> * Update src/components/views/auth/LoginWithQR.tsx Co-authored-by: Travis Ralston <travisr@matrix.org> * Update src/components/views/auth/LoginWithQR.tsx Co-authored-by: Travis Ralston <travisr@matrix.org> * Update res/css/views/auth/_LoginWithQR.pcss Co-authored-by: Kerry <kerrya@element.io> * Use spacing variables * Remove debug * Style + docs * preventDefault * Names of tests * Fixes for js-sdk refactor * Update snapshots to match test names * Refactor labs config to make deployment simpler * i18n * Unused imports * Typo * Stateless component * Whitespace * Use context not MatrixClientPeg * Add missing context * Type updates to match js-sdk * Wrap click handlers in useCallback * Update src/components/views/settings/DevicesPanel.tsx Co-authored-by: Travis Ralston <travisr@matrix.org> * Wait for DOM update instead of timeout * Add missing snapshot update from last commit * Remove void keyword in favour of then() clauses * test main paths in LoginWithQR Co-authored-by: Travis Ralston <travisr@matrix.org> Co-authored-by: Kerry <kerrya@element.io>
2022-10-19 13:31:20 +01:00 · 2022-10-19 13:31:20 +01:00 · 3c3df11d32
commit 3c3df11d32
parent e946674df3
23 changed files with 1638 additions and 12 deletions
--- a/test/components/views/settings/devices/LoginWithQRSection-test.tsx
+++ b/test/components/views/settings/devices/LoginWithQRSection-test.tsx
@ -0,0 +1,94 @@
+/*
+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 { mocked } from 'jest-mock';
+import { IServerVersions, MatrixClient } from 'matrix-js-sdk/src/matrix';
+import React from 'react';
+
+import LoginWithQRSection from '../../../../../src/components/views/settings/devices/LoginWithQRSection';
+import { MatrixClientPeg } from '../../../../../src/MatrixClientPeg';
+import { SettingLevel } from '../../../../../src/settings/SettingLevel';
+import SettingsStore from '../../../../../src/settings/SettingsStore';
+
+function makeClient() {
+    return mocked({
+        getUser: jest.fn(),
+        isGuest: jest.fn().mockReturnValue(false),
+        isUserIgnored: jest.fn(),
+        isCryptoEnabled: jest.fn(),
+        getUserId: jest.fn(),
+        on: jest.fn(),
+        isSynapseAdministrator: jest.fn().mockResolvedValue(false),
+        isRoomEncrypted: jest.fn().mockReturnValue(false),
+        mxcUrlToHttp: jest.fn().mockReturnValue('mock-mxcUrlToHttp'),
+        removeListener: jest.fn(),
+        currentState: {
+            on: jest.fn(),
+        },
+    } as unknown as MatrixClient);
+}
+
+function makeVersions(unstableFeatures: Record<string, boolean>): IServerVersions {
+    return {
+        versions: [],
+        unstable_features: unstableFeatures,
+    };
+}
+
+describe('<LoginWithQRSection />', () => {
+    beforeAll(() => {
+        jest.spyOn(MatrixClientPeg, 'get').mockReturnValue(makeClient());
+    });
+
+    const defaultProps = {
+        onShowQr: () => {},
+        versions: undefined,
+    };
+
+    const getComponent = (props = {}) =>
+        (<LoginWithQRSection {...defaultProps} {...props} />);
+
+    describe('should not render', () => {
+        it('no support at all', () => {
+            const { container } = render(getComponent());
+            expect(container).toMatchSnapshot();
+        });
+
+        it('feature enabled', async () => {
+            await SettingsStore.setValue('feature_qr_signin_reciprocate_show', null, SettingLevel.DEVICE, true);
+            const { container } = render(getComponent());
+            expect(container).toMatchSnapshot();
+        });
+
+        it('only feature + MSC3882 enabled', async () => {
+            await SettingsStore.setValue('feature_qr_signin_reciprocate_show', null, SettingLevel.DEVICE, true);
+            const { container } = render(getComponent({ versions: makeVersions({ 'org.matrix.msc3882': true }) }));
+            expect(container).toMatchSnapshot();
+        });
+    });
+
+    describe('should render panel', () => {
+        it('enabled by feature + MSC3882 + MSC3886', async () => {
+            await SettingsStore.setValue('feature_qr_signin_reciprocate_show', null, SettingLevel.DEVICE, true);
+            const { container } = render(getComponent({ versions: makeVersions({
+                'org.matrix.msc3882': true,
+                'org.matrix.msc3886': true,
+            }) }));
+            expect(container).toMatchSnapshot();
+        });
+    });
+});