From 18f4d948d481adfd1fef01cce27dfab92bd4ad7b Mon Sep 17 00:00:00 2001 From: Dominik Henneke Date: Mon, 12 Sep 2022 16:46:37 +0200 Subject: [PATCH 1/5] Hide the "Message" button in the sidebar if the CreateRooms components should not be shown Signed-off-by: Dominik Henneke --- src/components/views/right_panel/UserInfo.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/views/right_panel/UserInfo.tsx b/src/components/views/right_panel/UserInfo.tsx index 45489603ba8..0b2ffde4bc1 100644 --- a/src/components/views/right_panel/UserInfo.tsx +++ b/src/components/views/right_panel/UserInfo.tsx @@ -456,7 +456,7 @@ const UserOptionsSection: React.FC<{ ); let directMessageButton: JSX.Element; - if (!isMe) { + if (!isMe && shouldShowComponent(UIComponent.CreateRooms)) { directMessageButton = ; } From 0e9d5d8a69e23d6de474dd0ea59e569c8a2ea599 Mon Sep 17 00:00:00 2001 From: Dominik Henneke Date: Tue, 13 Sep 2022 11:06:05 +0200 Subject: [PATCH 2/5] Add tests to check if the message button is correctly hidden by the customisations Signed-off-by: Dominik Henneke --- .../views/right_panel/UserInfo-test.tsx | 25 +++++++++++++++++++ 1 file changed, 25 insertions(+) diff --git a/test/components/views/right_panel/UserInfo-test.tsx b/test/components/views/right_panel/UserInfo-test.tsx index 6ec36cb096b..4c74a424b5a 100644 --- a/test/components/views/right_panel/UserInfo-test.tsx +++ b/test/components/views/right_panel/UserInfo-test.tsx @@ -28,6 +28,8 @@ import { MatrixClientPeg } from '../../../../src/MatrixClientPeg'; import MatrixClientContext from '../../../../src/contexts/MatrixClientContext'; import VerificationPanel from '../../../../src/components/views/right_panel/VerificationPanel'; import EncryptionInfo from '../../../../src/components/views/right_panel/EncryptionInfo'; +import { shouldShowComponent } from '../../../../src/customisations/helpers/UIComponents'; +import { UIComponent } from '../../../../src/settings/UIFeature'; const findByTestId = (component, id) => component.find(`[data-test-id="${id}"]`); @@ -43,6 +45,13 @@ jest.mock('../../../../src/utils/DMRoomMap', () => { }; }); +jest.mock('../../../../src/customisations/helpers/UIComponents', () => { + const original = jest.requireActual('../../../../src/customisations/helpers/UIComponents'); + return ({ + shouldShowComponent: jest.fn().mockImplementation(original.shouldShowComponent), + }); +}); + describe('', () => { const defaultUserId = '@test:test'; const defaultUser = new User(defaultUserId); @@ -183,5 +192,21 @@ describe('', () => { expect(component.find(EncryptionInfo).length).toBeFalsy(); expect(component.find(VerificationPanel).length).toBeTruthy(); }); + + it('renders the message button', () => { + const component = getComponent(); + + expect(component.find("MessageButton")).toHaveLength(1); + }); + + it('hides the message button if the visibility customisation hides all create room features', () => { + (shouldShowComponent as jest.Mock).mockImplementation((component) => { + return component !== UIComponent.CreateRooms; + }); + + const component = getComponent(); + + expect(component.find("MessageButton")).toHaveLength(0); + }); }); }); From 3bf27cd7b01c5e37555fb1ec0b2aa4bf2e497c51 Mon Sep 17 00:00:00 2001 From: Dominik Henneke Date: Tue, 13 Sep 2022 13:18:47 +0200 Subject: [PATCH 3/5] Use the testing-library instead of enzyme Signed-off-by: Dominik Henneke --- .../views/right_panel/UserInfo-test.tsx | 20 ++++++++++++++----- 1 file changed, 15 insertions(+), 5 deletions(-) diff --git a/test/components/views/right_panel/UserInfo-test.tsx b/test/components/views/right_panel/UserInfo-test.tsx index 4c74a424b5a..95bc29efb51 100644 --- a/test/components/views/right_panel/UserInfo-test.tsx +++ b/test/components/views/right_panel/UserInfo-test.tsx @@ -21,6 +21,7 @@ import { mocked } from 'jest-mock'; import { act } from "react-dom/test-utils"; import { Room, User, MatrixClient } from 'matrix-js-sdk/src/matrix'; import { Phase, VerificationRequest } from 'matrix-js-sdk/src/crypto/verification/request/VerificationRequest'; +import { render, screen } from '@testing-library/react'; import UserInfo from '../../../../src/components/views/right_panel/UserInfo'; import { RightPanelPhases } from '../../../../src/stores/right-panel/RightPanelStorePhases'; @@ -63,6 +64,7 @@ describe('', () => { isCryptoEnabled: jest.fn(), getUserId: jest.fn(), on: jest.fn(), + off: jest.fn(), isSynapseAdministrator: jest.fn().mockResolvedValue(false), isRoomEncrypted: jest.fn().mockReturnValue(false), doesServerSupportUnstableFeature: jest.fn().mockReturnValue(false), @@ -194,19 +196,27 @@ describe('', () => { }); it('renders the message button', () => { - const component = getComponent(); + render( + + + , + ); - expect(component.find("MessageButton")).toHaveLength(1); + screen.getByRole('button', { name: 'Message' }); }); it('hides the message button if the visibility customisation hides all create room features', () => { - (shouldShowComponent as jest.Mock).mockImplementation((component) => { + mocked(shouldShowComponent).mockImplementation((component) => { return component !== UIComponent.CreateRooms; }); - const component = getComponent(); + render( + + + , + ); - expect(component.find("MessageButton")).toHaveLength(0); + expect(screen.queryByRole('button', { name: 'Message' })).toBeNull(); }); }); }); From b28e29e20539b119f3cbd35df9eb2c36442929d4 Mon Sep 17 00:00:00 2001 From: Dominik Henneke Date: Tue, 13 Sep 2022 13:22:11 +0200 Subject: [PATCH 4/5] Fix type error Signed-off-by: Dominik Henneke --- src/components/views/right_panel/UserInfo.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/views/right_panel/UserInfo.tsx b/src/components/views/right_panel/UserInfo.tsx index 0b2ffde4bc1..f8efca4f0d9 100644 --- a/src/components/views/right_panel/UserInfo.tsx +++ b/src/components/views/right_panel/UserInfo.tsx @@ -455,7 +455,7 @@ const UserOptionsSection: React.FC<{ ); - let directMessageButton: JSX.Element; + let directMessageButton: JSX.Element | null = null; if (!isMe && shouldShowComponent(UIComponent.CreateRooms)) { directMessageButton = ; } From d478f46973aa9954ae5c3a050ece904d8e300ca9 Mon Sep 17 00:00:00 2001 From: Mikhail Aheichyk Date: Fri, 26 Jan 2024 11:21:49 +0300 Subject: [PATCH 5/5] Smaller test change, prettier Signed-off-by: Mikhail Aheichyk --- src/components/views/right_panel/UserInfo.tsx | 3 +- .../views/right_panel/UserInfo-test.tsx | 41 ++++++++++--------- 2 files changed, 24 insertions(+), 20 deletions(-) diff --git a/src/components/views/right_panel/UserInfo.tsx b/src/components/views/right_panel/UserInfo.tsx index 25d2e15211f..a339a1ebce0 100644 --- a/src/components/views/right_panel/UserInfo.tsx +++ b/src/components/views/right_panel/UserInfo.tsx @@ -521,7 +521,8 @@ export const UserOptionsSection: React.FC<{ ); - const directMessageButton = (isMe || !shouldShowComponent(UIComponent.CreateRooms)) ? null : ; + const directMessageButton = + isMe || !shouldShowComponent(UIComponent.CreateRooms) ? null : ; return (
diff --git a/test/components/views/right_panel/UserInfo-test.tsx b/test/components/views/right_panel/UserInfo-test.tsx index 9bed9264ecb..4be9c4b6a9c 100644 --- a/test/components/views/right_panel/UserInfo-test.tsx +++ b/test/components/views/right_panel/UserInfo-test.tsx @@ -62,8 +62,8 @@ import { E2EStatus } from "../../../../src/utils/ShieldUtils"; import { DirectoryMember, startDmOnFirstMessage } from "../../../../src/utils/direct-messages"; import { clearAllModals, flushPromises } from "../../../test-utils"; import ErrorDialog from "../../../../src/components/views/dialogs/ErrorDialog"; -import { shouldShowComponent } from '../../../../src/customisations/helpers/UIComponents'; -import { UIComponent } from '../../../../src/settings/UIFeature'; +import { shouldShowComponent } from "../../../../src/customisations/helpers/UIComponents"; +import { UIComponent } from "../../../../src/settings/UIFeature"; jest.mock("../../../../src/utils/direct-messages", () => ({ ...jest.requireActual("../../../../src/utils/direct-messages"), @@ -90,11 +90,11 @@ jest.mock("../../../../src/utils/DMRoomMap", () => { }; }); -jest.mock('../../../../src/customisations/helpers/UIComponents', () => { - const original = jest.requireActual('../../../../src/customisations/helpers/UIComponents'); - return ({ +jest.mock("../../../../src/customisations/helpers/UIComponents", () => { + const original = jest.requireActual("../../../../src/customisations/helpers/UIComponents"); + return { shouldShowComponent: jest.fn().mockImplementation(original.shouldShowComponent), - }); + }; }); const defaultRoomId = "!fkfk"; @@ -335,28 +335,31 @@ describe("", () => { expect(screen.getByText(/try with a different client/i)).toBeInTheDocument(); }); - it('renders the message button', () => { + it("renders the message button", () => { render( , ); - screen.getByRole('button', { name: 'Message' }); + screen.getByRole("button", { name: "Message" }); }); - it('hides the message button if the visibility customisation hides all create room features', () => { - mocked(shouldShowComponent).mockImplementation((component) => { - return component !== UIComponent.CreateRooms; - }); - - render( - - - , + it("hides the message button if the visibility customisation hides all create room features", () => { + mocked(shouldShowComponent).withImplementation( + (component) => { + return component !== UIComponent.CreateRooms; + }, + () => { + render( + + + , + ); + + expect(screen.queryByRole("button", { name: "Message" })).toBeNull(); + }, ); - - expect(screen.queryByRole('button', { name: 'Message' })).toBeNull(); }); });