Don't show feedback prompts when that UIFeature is disabled (#9305)
This commit is contained in:
Michael Telatynski
GitHub
parent
88c12cdaa5
commit
56c95467de
12 changed files with 303 additions and 127 deletions
|
|
@ -15,68 +15,102 @@ limitations under the License.
|
|||
*/
|
||||
|
||||
import React from 'react';
|
||||
// eslint-disable-next-line deprecate/import
|
||||
import { shallow, mount } from "enzyme";
|
||||
import { render, screen, fireEvent } from "@testing-library/react";
|
||||
import { mocked } from "jest-mock";
|
||||
import 'focus-visible'; // to fix context menus
|
||||
|
||||
import {
|
||||
ThreadFilterType,
|
||||
ThreadPanelHeader,
|
||||
ThreadPanelHeaderFilterOptionItem,
|
||||
} from '../../../src/components/structures/ThreadPanel';
|
||||
import { ContextMenuButton } from '../../../src/accessibility/context_menu/ContextMenuButton';
|
||||
import ContextMenu from '../../../src/components/structures/ContextMenu';
|
||||
import ThreadPanel, { ThreadFilterType, ThreadPanelHeader } from '../../../src/components/structures/ThreadPanel';
|
||||
import { _t } from '../../../src/languageHandler';
|
||||
import ResizeNotifier from '../../../src/utils/ResizeNotifier';
|
||||
import { RoomPermalinkCreator } from '../../../src/utils/permalinks/Permalinks';
|
||||
import { createTestClient, mkStubRoom } from '../../test-utils';
|
||||
import { shouldShowFeedback } from "../../../src/utils/Feedback";
|
||||
import MatrixClientContext from "../../../src/contexts/MatrixClientContext";
|
||||
|
||||
jest.mock("../../../src/utils/Feedback");
|
||||
|
||||
describe('ThreadPanel', () => {
|
||||
describe("Feedback prompt", () => {
|
||||
const cli = createTestClient();
|
||||
const room = mkStubRoom("!room:server", "room", cli);
|
||||
mocked(cli.getRoom).mockReturnValue(room);
|
||||
|
||||
it("should show feedback prompt if feedback is enabled", () => {
|
||||
mocked(shouldShowFeedback).mockReturnValue(true);
|
||||
|
||||
render(<MatrixClientContext.Provider value={cli}>
|
||||
<ThreadPanel
|
||||
roomId="!room:server"
|
||||
onClose={jest.fn()}
|
||||
resizeNotifier={new ResizeNotifier()}
|
||||
permalinkCreator={new RoomPermalinkCreator(room)}
|
||||
/>
|
||||
</MatrixClientContext.Provider>);
|
||||
expect(screen.queryByText("Give feedback")).toBeTruthy();
|
||||
});
|
||||
|
||||
it("should hide feedback prompt if feedback is disabled", () => {
|
||||
mocked(shouldShowFeedback).mockReturnValue(false);
|
||||
|
||||
render(<MatrixClientContext.Provider value={cli}>
|
||||
<ThreadPanel
|
||||
roomId="!room:server"
|
||||
onClose={jest.fn()}
|
||||
resizeNotifier={new ResizeNotifier()}
|
||||
permalinkCreator={new RoomPermalinkCreator(room)}
|
||||
/>
|
||||
</MatrixClientContext.Provider>);
|
||||
expect(screen.queryByText("Give feedback")).toBeFalsy();
|
||||
});
|
||||
});
|
||||
|
||||
describe('Header', () => {
|
||||
it('expect that All filter for ThreadPanelHeader properly renders Show: All threads', () => {
|
||||
const wrapper = shallow(
|
||||
const { asFragment } = render(
|
||||
<ThreadPanelHeader
|
||||
empty={false}
|
||||
filterOption={ThreadFilterType.All}
|
||||
setFilterOption={() => undefined} />,
|
||||
);
|
||||
expect(wrapper).toMatchSnapshot();
|
||||
expect(asFragment()).toMatchSnapshot();
|
||||
});
|
||||
|
||||
it('expect that My filter for ThreadPanelHeader properly renders Show: My threads', () => {
|
||||
const wrapper = shallow(
|
||||
const { asFragment } = render(
|
||||
<ThreadPanelHeader
|
||||
empty={false}
|
||||
filterOption={ThreadFilterType.My}
|
||||
setFilterOption={() => undefined} />,
|
||||
);
|
||||
expect(wrapper).toMatchSnapshot();
|
||||
expect(asFragment()).toMatchSnapshot();
|
||||
});
|
||||
|
||||
it('expect that ThreadPanelHeader properly opens a context menu when clicked on the button', () => {
|
||||
const wrapper = mount(
|
||||
const { container } = render(
|
||||
<ThreadPanelHeader
|
||||
empty={false}
|
||||
filterOption={ThreadFilterType.All}
|
||||
setFilterOption={() => undefined} />,
|
||||
);
|
||||
const found = wrapper.find(ContextMenuButton);
|
||||
expect(found).not.toBe(undefined);
|
||||
expect(found).not.toBe(null);
|
||||
expect(wrapper.exists(ContextMenu)).toEqual(false);
|
||||
found.simulate('click');
|
||||
expect(wrapper.exists(ContextMenu)).toEqual(true);
|
||||
const found = container.querySelector(".mx_ThreadPanel_dropdown");
|
||||
expect(found).toBeTruthy();
|
||||
expect(screen.queryByRole("menu")).toBeFalsy();
|
||||
fireEvent.click(found);
|
||||
expect(screen.queryByRole("menu")).toBeTruthy();
|
||||
});
|
||||
|
||||
it('expect that ThreadPanelHeader has the correct option selected in the context menu', () => {
|
||||
const wrapper = mount(
|
||||
const { container } = render(
|
||||
<ThreadPanelHeader
|
||||
empty={false}
|
||||
filterOption={ThreadFilterType.All}
|
||||
setFilterOption={() => undefined} />,
|
||||
);
|
||||
wrapper.find(ContextMenuButton).simulate('click');
|
||||
const found = wrapper.find(ThreadPanelHeaderFilterOptionItem);
|
||||
expect(found.length).toEqual(2);
|
||||
const foundButton = found.find('[aria-checked=true]').first();
|
||||
expect(foundButton.text()).toEqual(`${_t("All threads")}${_t('Shows all threads from current room')}`);
|
||||
fireEvent.click(container.querySelector(".mx_ThreadPanel_dropdown"));
|
||||
const found = screen.queryAllByRole("menuitemradio");
|
||||
expect(found).toHaveLength(2);
|
||||
const foundButton = screen.queryByRole("menuitemradio", { checked: true });
|
||||
expect(foundButton.textContent).toEqual(`${_t("All threads")}${_t('Shows all threads from current room')}`);
|
||||
expect(foundButton).toMatchSnapshot();
|
||||
});
|
||||
});
|
||||
|
|
|
|||
|
|
@ -1,106 +1,64 @@
|
|||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`ThreadPanel Header expect that All filter for ThreadPanelHeader properly renders Show: All threads 1`] = `
|
||||
<div
|
||||
className="mx_BaseCard_header_title"
|
||||
>
|
||||
<Heading
|
||||
className="mx_BaseCard_header_title_heading"
|
||||
size="h4"
|
||||
<DocumentFragment>
|
||||
<div
|
||||
class="mx_BaseCard_header_title"
|
||||
>
|
||||
Threads
|
||||
</Heading>
|
||||
<ContextMenuButton
|
||||
className="mx_ThreadPanel_dropdown"
|
||||
inputRef={
|
||||
Object {
|
||||
"current": null,
|
||||
}
|
||||
}
|
||||
isExpanded={false}
|
||||
onClick={[Function]}
|
||||
>
|
||||
Show: All threads
|
||||
</ContextMenuButton>
|
||||
</div>
|
||||
<h4
|
||||
class="mx_Heading_h4 mx_BaseCard_header_title_heading"
|
||||
>
|
||||
Threads
|
||||
</h4>
|
||||
<div
|
||||
aria-expanded="false"
|
||||
aria-haspopup="true"
|
||||
class="mx_AccessibleButton mx_ThreadPanel_dropdown"
|
||||
role="button"
|
||||
tabindex="0"
|
||||
>
|
||||
Show: All threads
|
||||
</div>
|
||||
</div>
|
||||
</DocumentFragment>
|
||||
`;
|
||||
|
||||
exports[`ThreadPanel Header expect that My filter for ThreadPanelHeader properly renders Show: My threads 1`] = `
|
||||
<div
|
||||
className="mx_BaseCard_header_title"
|
||||
>
|
||||
<Heading
|
||||
className="mx_BaseCard_header_title_heading"
|
||||
size="h4"
|
||||
<DocumentFragment>
|
||||
<div
|
||||
class="mx_BaseCard_header_title"
|
||||
>
|
||||
Threads
|
||||
</Heading>
|
||||
<ContextMenuButton
|
||||
className="mx_ThreadPanel_dropdown"
|
||||
inputRef={
|
||||
Object {
|
||||
"current": null,
|
||||
}
|
||||
}
|
||||
isExpanded={false}
|
||||
onClick={[Function]}
|
||||
>
|
||||
Show: My threads
|
||||
</ContextMenuButton>
|
||||
</div>
|
||||
<h4
|
||||
class="mx_Heading_h4 mx_BaseCard_header_title_heading"
|
||||
>
|
||||
Threads
|
||||
</h4>
|
||||
<div
|
||||
aria-expanded="false"
|
||||
aria-haspopup="true"
|
||||
class="mx_AccessibleButton mx_ThreadPanel_dropdown"
|
||||
role="button"
|
||||
tabindex="0"
|
||||
>
|
||||
Show: My threads
|
||||
</div>
|
||||
</div>
|
||||
</DocumentFragment>
|
||||
`;
|
||||
|
||||
exports[`ThreadPanel Header expect that ThreadPanelHeader has the correct option selected in the context menu 1`] = `
|
||||
<RovingAccessibleButton
|
||||
aria-checked={true}
|
||||
className="mx_ThreadPanel_Header_FilterOptionItem"
|
||||
onClick={[Function]}
|
||||
<div
|
||||
aria-checked="true"
|
||||
class="mx_AccessibleButton mx_ThreadPanel_Header_FilterOptionItem focus-visible"
|
||||
data-focus-visible-added=""
|
||||
role="menuitemradio"
|
||||
tabindex="0"
|
||||
>
|
||||
<AccessibleButton
|
||||
aria-checked={true}
|
||||
className="mx_ThreadPanel_Header_FilterOptionItem"
|
||||
element="div"
|
||||
inputRef={
|
||||
Object {
|
||||
"current": <div
|
||||
aria-checked="true"
|
||||
class="mx_AccessibleButton mx_ThreadPanel_Header_FilterOptionItem focus-visible"
|
||||
data-focus-visible-added=""
|
||||
role="menuitemradio"
|
||||
tabindex="0"
|
||||
>
|
||||
<span>
|
||||
All threads
|
||||
</span>
|
||||
<span>
|
||||
Shows all threads from current room
|
||||
</span>
|
||||
</div>,
|
||||
}
|
||||
}
|
||||
onClick={[Function]}
|
||||
onFocus={[Function]}
|
||||
role="menuitemradio"
|
||||
tabIndex={0}
|
||||
>
|
||||
<div
|
||||
aria-checked={true}
|
||||
className="mx_AccessibleButton mx_ThreadPanel_Header_FilterOptionItem"
|
||||
onClick={[Function]}
|
||||
onFocus={[Function]}
|
||||
onKeyDown={[Function]}
|
||||
onKeyUp={[Function]}
|
||||
role="menuitemradio"
|
||||
tabIndex={0}
|
||||
>
|
||||
<span>
|
||||
All threads
|
||||
</span>
|
||||
<span>
|
||||
Shows all threads from current room
|
||||
</span>
|
||||
</div>
|
||||
</AccessibleButton>
|
||||
</RovingAccessibleButton>
|
||||
<span>
|
||||
All threads
|
||||
</span>
|
||||
<span>
|
||||
Shows all threads from current room
|
||||
</span>
|
||||
</div>
|
||||
`;
|
||||
|
|
|
|||
80
test/components/views/beta/BetaCard-test.tsx
Normal file
80
test/components/views/beta/BetaCard-test.tsx
Normal file
|
|
@ -0,0 +1,80 @@
|
|||
/*
|
||||
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 { mocked } from "jest-mock";
|
||||
import { render, screen } from "@testing-library/react";
|
||||
|
||||
import { shouldShowFeedback } from "../../../../src/utils/Feedback";
|
||||
import BetaCard from "../../../../src/components/views/beta/BetaCard";
|
||||
import SettingsStore from "../../../../src/settings/SettingsStore";
|
||||
|
||||
jest.mock("../../../../src/utils/Feedback");
|
||||
jest.mock("../../../../src/settings/SettingsStore");
|
||||
|
||||
describe('<BetaCard />', () => {
|
||||
describe("Feedback prompt", () => {
|
||||
const featureId = "featureId";
|
||||
|
||||
beforeEach(() => {
|
||||
mocked(SettingsStore).getBetaInfo.mockReturnValue({
|
||||
title: "title",
|
||||
caption: () => "caption",
|
||||
feedbackLabel: "feedbackLabel",
|
||||
feedbackSubheading: "feedbackSubheading",
|
||||
});
|
||||
mocked(SettingsStore).getValue.mockReturnValue(true);
|
||||
mocked(shouldShowFeedback).mockReturnValue(true);
|
||||
});
|
||||
|
||||
it("should show feedback prompt", () => {
|
||||
render(<BetaCard featureId={featureId} />);
|
||||
expect(screen.queryByText("Feedback")).toBeTruthy();
|
||||
});
|
||||
|
||||
it("should not show feedback prompt if beta is disabled", () => {
|
||||
mocked(SettingsStore).getValue.mockReturnValue(false);
|
||||
render(<BetaCard featureId={featureId} />);
|
||||
expect(screen.queryByText("Feedback")).toBeFalsy();
|
||||
});
|
||||
|
||||
it("should not show feedback prompt if label is unset", () => {
|
||||
mocked(SettingsStore).getBetaInfo.mockReturnValue({
|
||||
title: "title",
|
||||
caption: () => "caption",
|
||||
feedbackSubheading: "feedbackSubheading",
|
||||
});
|
||||
render(<BetaCard featureId={featureId} />);
|
||||
expect(screen.queryByText("Feedback")).toBeFalsy();
|
||||
});
|
||||
|
||||
it("should not show feedback prompt if subheading is unset", () => {
|
||||
mocked(SettingsStore).getBetaInfo.mockReturnValue({
|
||||
title: "title",
|
||||
caption: () => "caption",
|
||||
feedbackLabel: "feedbackLabel",
|
||||
});
|
||||
render(<BetaCard featureId={featureId} />);
|
||||
expect(screen.queryByText("Feedback")).toBeFalsy();
|
||||
});
|
||||
|
||||
it("should not show feedback prompt if feedback is disabled", () => {
|
||||
mocked(shouldShowFeedback).mockReturnValue(false);
|
||||
render(<BetaCard featureId={featureId} />);
|
||||
expect(screen.queryByText("Feedback")).toBeFalsy();
|
||||
});
|
||||
});
|
||||
});
|
||||
|
|
@ -29,6 +29,9 @@ import { LocalRoom, LOCAL_ROOM_ID_PREFIX } from "../../../../src/models/LocalRoo
|
|||
import { DirectoryMember, startDmOnFirstMessage } from "../../../../src/utils/direct-messages";
|
||||
import DMRoomMap from "../../../../src/utils/DMRoomMap";
|
||||
import { mkRoom, stubClient } from "../../../test-utils";
|
||||
import { shouldShowFeedback } from "../../../../src/utils/Feedback";
|
||||
|
||||
jest.mock("../../../../src/utils/Feedback");
|
||||
|
||||
jest.mock("../../../../src/utils/direct-messages", () => ({
|
||||
// @ts-ignore
|
||||
|
|
@ -138,6 +141,7 @@ describe("Spotlight Dialog", () => {
|
|||
getUserIdForRoomId: jest.fn(),
|
||||
} as unknown as DMRoomMap);
|
||||
});
|
||||
|
||||
describe("should apply filters supplied via props", () => {
|
||||
it("without filter", async () => {
|
||||
const wrapper = mount(
|
||||
|
|
@ -370,4 +374,32 @@ describe("Spotlight Dialog", () => {
|
|||
|
||||
wrapper.unmount();
|
||||
});
|
||||
|
||||
describe("Feedback prompt", () => {
|
||||
it("should show feedback prompt if feedback is enabled", async () => {
|
||||
mocked(shouldShowFeedback).mockReturnValue(true);
|
||||
|
||||
const wrapper = mount(<SpotlightDialog initialText="test23" onFinished={() => null} />);
|
||||
await act(async () => {
|
||||
await sleep(200);
|
||||
});
|
||||
wrapper.update();
|
||||
|
||||
const content = wrapper.find(".mx_SpotlightDialog_footer");
|
||||
expect(content.childAt(0).text()).toBe("Results not as expected? Please give feedback.");
|
||||
});
|
||||
|
||||
it("should hide feedback prompt if feedback is disabled", async () => {
|
||||
mocked(shouldShowFeedback).mockReturnValue(false);
|
||||
|
||||
const wrapper = mount(<SpotlightDialog initialText="test23" onFinished={() => null} />);
|
||||
await act(async () => {
|
||||
await sleep(200);
|
||||
});
|
||||
wrapper.update();
|
||||
|
||||
const content = wrapper.find(".mx_SpotlightDialog_footer");
|
||||
expect(content.text()).toBeFalsy();
|
||||
});
|
||||
});
|
||||
});
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue