Don't show feedback prompts when that UIFeature is disabled (#9305)
This commit is contained in:
Michael Telatynski
committed by
GitHub
GitHub
parent
88c12cdaa5
commit
56c95467de
@@ -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>
|
||||
`;
|
||||
|
||||
Reference in New Issue
Block a user