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

Merge branch 'develop' into sort-imports

Browse source 
Signed-off-by: Aaron Raimist <aaron@raim.ist>
This commit is contained in:
Aaron Raimist 2021-12-09 08:34:20 +00:00
commit 7b94e13a84
642 changed files with 30052 additions and 8035 deletions
Download patch file Download diff file Expand all files Collapse all files

2
test/components/structures/ThreadPanel-test.tsx
View file

@ -70,7 +70,7 @@ describe('ThreadPanel', () => {
wrapper.find(ContextMenuButton).simulate('click');
const found = wrapper.find(ThreadPanelHeaderFilterOptionItem);
expect(found.length).toEqual(2);
const foundButton = found.find('[aria-selected=true]').first();
const foundButton = found.find('[aria-checked=true]').first();
expect(foundButton.text()).toEqual(`${_t("All threads")}${_t('Shows all threads from current room')}`);
expect(foundButton).toMatchSnapshot();
});

14
test/components/structures/__snapshots__/ThreadPanel-test.tsx.snap
View file

@ -8,6 +8,7 @@ exports[`ThreadPanel Header expect that All filter for ThreadPanelHeader properl
Threads
</span>
<ContextMenuButton
className="mx_ThreadPanel_dropdown"
inputRef={
Object {
"current": null,
@ -29,6 +30,7 @@ exports[`ThreadPanel Header expect that My filter for ThreadPanelHeader properly
Threads
</span>
<ContextMenuButton
className="mx_ThreadPanel_dropdown"
inputRef={
Object {
"current": null,
@ -44,21 +46,21 @@ exports[`ThreadPanel Header expect that My filter for ThreadPanelHeader properly
exports[`ThreadPanel Header expect that ThreadPanelHeader has the correct option selected in the context menu 1`] = `
<AccessibleButton
aria-selected={true}
aria-checked={true}
className="mx_ThreadPanel_Header_FilterOptionItem"
element="div"
onClick={[Function]}
role="button"
tabIndex={0}
role="menuitemradio"
tabIndex={-1}
>
<div
aria-selected={true}
aria-checked={true}
className="mx_AccessibleButton mx_ThreadPanel_Header_FilterOptionItem"
onClick={[Function]}
onKeyDown={[Function]}
onKeyUp={[Function]}
role="button"
tabIndex={0}
role="menuitemradio"
tabIndex={-1}
>
<span>
All threads

16
test/components/structures/auth/Registration-test.js
View file

@ -14,13 +14,18 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
import sdk from '../../../skinned-sdk';
import React from 'react';
import ReactDOM from 'react-dom';
import ReactTestUtils from 'react-dom/test-utils';
import { createClient } from 'matrix-js-sdk/src/matrix';
import sdk from '../../../skinned-sdk';
import SdkConfig from '../../../../src/SdkConfig';
import { mkServerConfig } from "../../../test-utils";
import { createTestClient, mkServerConfig } from "../../../test-utils";
jest.mock('matrix-js-sdk/src/matrix');
jest.useFakeTimers();
const Registration = sdk.getComponent(
'structures.auth.Registration',
@ -32,6 +37,7 @@ describe('Registration', function() {
beforeEach(function() {
parentDiv = document.createElement('div');
document.body.appendChild(parentDiv);
createClient.mockImplementation(() => createTestClient());
});
afterEach(function() {
@ -49,13 +55,13 @@ describe('Registration', function() {
/>, parentDiv);
}
it('should show server picker', function() {
it('should show server picker', async function() {
const root = render();
const selector = ReactTestUtils.findRenderedDOMComponentWithClass(root, "mx_ServerPicker");
expect(selector).toBeTruthy();
});
it('should show form when custom URLs disabled', function() {
it('should show form when custom URLs disabled', async function() {
jest.spyOn(SdkConfig, "get").mockReturnValue({
disable_custom_urls: true,
});
@ -78,7 +84,7 @@ describe('Registration', function() {
expect(form).toBeTruthy();
});
it("should show SSO options if those are available", () => {
it("should show SSO options if those are available", async () => {
jest.spyOn(SdkConfig, "get").mockReturnValue({
disable_custom_urls: true,
});

162
test/components/views/elements/InteractiveTooltip-test.ts Normal file
View file

@ -0,0 +1,162 @@
/*
Copyright 2021 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 '../../../skinned-sdk';
import { Direction, mouseWithinRegion } from "../../../../src/components/views/elements/InteractiveTooltip";
describe("InteractiveTooltip", () => {
describe("mouseWithinRegion", () => {
it("direction=left", () => {
const targetRect = {
width: 20,
height: 20,
top: 300,
right: 370,
bottom: 320,
left: 350,
} as DOMRect;
const contentRect = {
width: 100,
height: 400,
top: 100,
right: 200,
bottom: 500,
left: 100,
} as DOMRect;
// just within top left corner of contentRect
expect(mouseWithinRegion(101, 101, Direction.Left, targetRect, contentRect)).toBe(true);
// just outside top left corner of contentRect, within buffer
expect(mouseWithinRegion(101, 90, Direction.Left, targetRect, contentRect)).toBe(true);
// just within top right corner of targetRect
expect(mouseWithinRegion(369, 301, Direction.Left, targetRect, contentRect)).toBe(true);
// within the top triangular portion of the trapezoid
expect(mouseWithinRegion(300, 200, Direction.Left, targetRect, contentRect)).toBe(true);
// within the bottom triangular portion of the trapezoid
expect(mouseWithinRegion(300, 350, Direction.Left, targetRect, contentRect)).toBe(true);
// outside the top triangular portion of the trapezoid
expect(mouseWithinRegion(300, 140, Direction.Left, targetRect, contentRect)).toBe(false);
// outside the bottom triangular portion of the trapezoid
expect(mouseWithinRegion(300, 460, Direction.Left, targetRect, contentRect)).toBe(false);
});
it("direction=right", () => {
const targetRect = {
width: 20,
height: 20,
top: 300,
right: 370,
bottom: 320,
left: 350,
} as DOMRect;
const contentRect = {
width: 100,
height: 400,
top: 100,
right: 620,
bottom: 500,
left: 520,
} as DOMRect;
// just within top right corner of contentRect
expect(mouseWithinRegion(619, 101, Direction.Right, targetRect, contentRect)).toBe(true);
// just outside top right corner of contentRect, within buffer
expect(mouseWithinRegion(619, 90, Direction.Right, targetRect, contentRect)).toBe(true);
// just within top left corner of targetRect
expect(mouseWithinRegion(351, 301, Direction.Right, targetRect, contentRect)).toBe(true);
// within the top triangular portion of the trapezoid
expect(mouseWithinRegion(420, 200, Direction.Right, targetRect, contentRect)).toBe(true);
// within the bottom triangular portion of the trapezoid
expect(mouseWithinRegion(420, 350, Direction.Right, targetRect, contentRect)).toBe(true);
// outside the top triangular portion of the trapezoid
expect(mouseWithinRegion(420, 140, Direction.Right, targetRect, contentRect)).toBe(false);
// outside the bottom triangular portion of the trapezoid
expect(mouseWithinRegion(420, 460, Direction.Right, targetRect, contentRect)).toBe(false);
});
it("direction=top", () => {
const targetRect = {
width: 20,
height: 20,
top: 300,
right: 370,
bottom: 320,
left: 350,
} as DOMRect;
const contentRect = {
width: 400,
height: 100,
top: 100,
right: 550,
bottom: 200,
left: 150,
} as DOMRect;
// just within top right corner of contentRect
expect(mouseWithinRegion(549, 101, Direction.Top, targetRect, contentRect)).toBe(true);
// just outside top right corner of contentRect, within buffer
expect(mouseWithinRegion(549, 99, Direction.Top, targetRect, contentRect)).toBe(true);
// just within bottom left corner of targetRect
expect(mouseWithinRegion(351, 319, Direction.Top, targetRect, contentRect)).toBe(true);
// within the left triangular portion of the trapezoid
expect(mouseWithinRegion(240, 260, Direction.Top, targetRect, contentRect)).toBe(true);
// within the right triangular portion of the trapezoid
expect(mouseWithinRegion(480, 260, Direction.Top, targetRect, contentRect)).toBe(true);
// outside the left triangular portion of the trapezoid
expect(mouseWithinRegion(220, 260, Direction.Top, targetRect, contentRect)).toBe(false);
// outside the right triangular portion of the trapezoid
expect(mouseWithinRegion(500, 260, Direction.Top, targetRect, contentRect)).toBe(false);
});
it("direction=bottom", () => {
const targetRect = {
width: 20,
height: 20,
top: 300,
right: 370,
bottom: 320,
left: 350,
} as DOMRect;
const contentRect = {
width: 400,
height: 100,
top: 420,
right: 550,
bottom: 520,
left: 150,
} as DOMRect;
// just within bottom left corner of contentRect
expect(mouseWithinRegion(101, 519, Direction.Bottom, targetRect, contentRect)).toBe(true);
// just outside bottom left corner of contentRect, within buffer
expect(mouseWithinRegion(101, 521, Direction.Bottom, targetRect, contentRect)).toBe(true);
// just within top left corner of targetRect
expect(mouseWithinRegion(351, 301, Direction.Bottom, targetRect, contentRect)).toBe(true);
// within the left triangular portion of the trapezoid
expect(mouseWithinRegion(240, 360, Direction.Bottom, targetRect, contentRect)).toBe(true);
// within the right triangular portion of the trapezoid
expect(mouseWithinRegion(480, 360, Direction.Bottom, targetRect, contentRect)).toBe(true);
// outside the left triangular portion of the trapezoid
expect(mouseWithinRegion(220, 360, Direction.Bottom, targetRect, contentRect)).toBe(false);
// outside the right triangular portion of the trapezoid
expect(mouseWithinRegion(500, 360, Direction.Bottom, targetRect, contentRect)).toBe(false);
});
});
});

125
test/components/views/elements/PollCreateDialog-test.tsx Normal file
View file

@ -0,0 +1,125 @@
/*
Copyright 2021 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.
*/
// skinned-sdk should be the first import in most tests
import '../../../skinned-sdk';
import React from "react";
import { mount, ReactWrapper } from "enzyme";
import * as TestUtils from "../../../test-utils";
import { MatrixClientPeg } from "../../../../src/MatrixClientPeg";
import { Room } from "matrix-js-sdk/src/models/room";
import _PollCreateDialog from "../../../../src/components/views/elements/PollCreateDialog";
const PollCreateDialog = TestUtils.wrapInMatrixClientContext(_PollCreateDialog);
// Fake date to give a predictable snapshot
const realDateNow = Date.now;
const realDateToISOString = Date.prototype.toISOString;
Date.now = jest.fn(() => 2345678901234);
// eslint-disable-next-line no-extend-native
Date.prototype.toISOString = jest.fn(() => "2021-11-23T14:35:14.240Z");
afterAll(() => {
Date.now = realDateNow;
// eslint-disable-next-line no-extend-native
Date.prototype.toISOString = realDateToISOString;
});
describe("PollCreateDialog", () => {
it("renders a blank poll", () => {
const dialog = mount(
<PollCreateDialog room={createRoom()} onFinished={jest.fn()} />,
);
expect(dialog).toMatchSnapshot();
});
it("renders a question and some options", () => {
const dialog = mount(
<PollCreateDialog room={createRoom()} onFinished={jest.fn()} />,
);
expect(submitIsDisabled(dialog)).toBe(true);
// When I set some values in the boxes
changeValue(
dialog,
"Question or topic",
"How many turnips is the optimal number?",
);
changeValue(dialog, "Option 1", "As many as my neighbour");
changeValue(dialog, "Option 2", "The question is meaningless");
dialog.find("div.mx_PollCreateDialog_addOption").simulate("click");
changeValue(dialog, "Option 3", "Mu");
expect(dialog).toMatchSnapshot();
});
it("doesn't allow submitting until there are options", () => {
const dialog = mount(
<PollCreateDialog room={createRoom()} onFinished={jest.fn()} />,
);
expect(submitIsDisabled(dialog)).toBe(true);
});
it("does allow submitting when there are options and a question", () => {
// Given a dialog with no info in (which I am unable to submit)
const dialog = mount(
<PollCreateDialog room={createRoom()} onFinished={jest.fn()} />,
);
expect(submitIsDisabled(dialog)).toBe(true);
// When I set some values in the boxes
changeValue(dialog, "Question or topic", "Q");
changeValue(dialog, "Option 1", "A1");
changeValue(dialog, "Option 2", "A2");
// Then I am able to submit
expect(submitIsDisabled(dialog)).toBe(false);
});
it("displays a spinner after submitting", () => {
TestUtils.stubClient();
MatrixClientPeg.get().sendEvent = jest.fn(() => Promise.resolve());
const dialog = mount(
<PollCreateDialog room={createRoom()} onFinished={jest.fn()} />,
);
changeValue(dialog, "Question or topic", "Q");
changeValue(dialog, "Option 1", "A1");
changeValue(dialog, "Option 2", "A2");
expect(dialog.find("Spinner").length).toBe(0);
dialog.find("button").simulate("click");
expect(dialog.find("Spinner").length).toBe(1);
});
});
function createRoom(): Room {
return new Room(
"roomid",
MatrixClientPeg.get(),
"@name:example.com",
{},
);
}
function changeValue(wrapper: ReactWrapper, labelText: string, value: string) {
wrapper.find(`input[label="${labelText}"]`).simulate(
"change",
{ target: { value: value } },
);
}
function submitIsDisabled(wrapper: ReactWrapper) {
return wrapper.find('button[type="submit"]').prop("aria-disabled") === true;
}

2349
test/components/views/elements/__snapshots__/PollCreateDialog-test.tsx.snap Normal file
View file

File diff suppressed because it is too large Load diff

1171
test/components/views/messages/MPollBody-test.tsx Normal file
View file

File diff suppressed because it is too large Load diff

24
test/components/views/messages/TextualBody-test.js
View file

@ -282,6 +282,30 @@ describe("<TextualBody />", () => {
'!ZxbRYPQXDXKGmDnJNg:example.com</a></span> with vias</span>',
);
});
it('renders formatted body without html corretly', () => {
const ev = mkEvent({
type: "m.room.message",
room: "room_id",
user: "sender",
content: {
body: "escaped \\*markdown\\*",
msgtype: "m.text",
format: "org.matrix.custom.html",
formatted_body: "escaped *markdown*",
},
event: true,
});
const wrapper = mount(<TextualBody mxEvent={ev} />);
const content = wrapper.find(".mx_EventTile_body");
expect(content.html()).toBe(
'<span class="mx_EventTile_body" dir="auto">' +
'escaped *markdown*' +
'</span>',
);
});
});
it("renders url previews correctly", () => {

2468
test/components/views/messages/__snapshots__/MPollBody-test.tsx.snap Normal file
View file

File diff suppressed because it is too large Load diff

1
test/components/views/rooms/RoomHeader-test.tsx
View file

@ -155,7 +155,6 @@ function render(room: Room): HTMLDivElement {
<RoomHeader
room={room}
inRoom={true}
onSettingsClick={() => {}}
onSearchClick={() => {}}
onForgetClick={() => {}}
onCallPlaced={(_type: PlaceCallType) => {}}

2
test/components/views/rooms/SendMessageComposer-test.tsx
View file

@ -35,7 +35,7 @@ import { MatrixClientPeg } from "../../../../src/MatrixClientPeg";
import SpecPermalinkConstructor from "../../../../src/utils/permalinks/SpecPermalinkConstructor";
import defaultDispatcher from "../../../../src/dispatcher/dispatcher";
import DocumentOffset from '../../../../src/editor/offset';
import { Layout } from '../../../../src/settings/Layout';
import { Layout } from '../../../../src/settings/enums/Layout';
jest.mock("../../../../src/stores/RoomViewStore");

6
test/components/views/settings/__snapshots__/FontScalingPanel-test.tsx.snap
View file

@ -243,7 +243,7 @@ exports[`FontScalingPanel renders the font scaling UI 1`] = `
onChange={[Function]}
>
<span
className="mx_Checkbox "
className="mx_Checkbox mx_Checkbox_hasKind mx_Checkbox_kind_solid"
>
<input
checked={false}
@ -258,8 +258,8 @@ exports[`FontScalingPanel renders the font scaling UI 1`] = `
<div
className="mx_Checkbox_background"
>
<img
src="image-file-stub"
<div
className="mx_Checkbox_checkmark"
/>
</div>
<div>

12
test/components/views/settings/__snapshots__/ThemeChoicePanel-test.tsx.snap
View file

@ -46,7 +46,7 @@ exports[`ThemeChoicePanel renders the theme choice UI 1`] = `
value="light"
>
<label
className="mx_RadioButton mx_ThemeSelector_light mx_RadioButton_disabled mx_RadioButton_outlined"
className="mx_StyledRadioButton mx_ThemeSelector_light mx_StyledRadioButton_disabled mx_StyledRadioButton_outlined"
>
<input
checked={false}
@ -60,12 +60,12 @@ exports[`ThemeChoicePanel renders the theme choice UI 1`] = `
<div />
</div>
<div
className="mx_RadioButton_content"
className="mx_StyledRadioButton_content"
>
Light
</div>
<div
className="mx_RadioButton_spacer"
className="mx_StyledRadioButton_spacer"
/>
</label>
</StyledRadioButton>
@ -80,7 +80,7 @@ exports[`ThemeChoicePanel renders the theme choice UI 1`] = `
value="dark"
>
<label
className="mx_RadioButton mx_ThemeSelector_dark mx_RadioButton_disabled mx_RadioButton_outlined"
className="mx_StyledRadioButton mx_ThemeSelector_dark mx_StyledRadioButton_disabled mx_StyledRadioButton_outlined"
>
<input
checked={false}
@ -94,12 +94,12 @@ exports[`ThemeChoicePanel renders the theme choice UI 1`] = `
<div />
</div>
<div
className="mx_RadioButton_content"
className="mx_StyledRadioButton_content"
>
Dark
</div>
<div
className="mx_RadioButton_spacer"
className="mx_StyledRadioButton_spacer"
/>
</label>
</StyledRadioButton>