mirror of
https://github.com/element-hq/element-web
synced 2024-11-28 12:28:50 +03:00
fix more type issues in unit tests (#8053)
* fix ts issues in test/components/structures Signed-off-by: Kerry Archibald <kerrya@element.io> * fix ts issues in test/components/views/context_menus Signed-off-by: Kerry Archibald <kerrya@element.io>
This commit is contained in:
parent
813a60a7f3
commit
bc8fdac491
4 changed files with 40 additions and 25 deletions
|
@ -15,7 +15,7 @@ limitations under the License.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import "../../skinned-sdk";
|
import "../../skinned-sdk";
|
||||||
import { MatrixClient } from 'matrix-js-sdk/src/matrix';
|
import { MatrixClient, MatrixEvent } from 'matrix-js-sdk/src/matrix';
|
||||||
import { EventType } from "matrix-js-sdk/src/@types/event";
|
import { EventType } from "matrix-js-sdk/src/@types/event";
|
||||||
import { CallState } from "matrix-js-sdk/src/webrtc/call";
|
import { CallState } from "matrix-js-sdk/src/webrtc/call";
|
||||||
|
|
||||||
|
@ -52,7 +52,7 @@ describe('CallEventGrouper', () => {
|
||||||
sender: {
|
sender: {
|
||||||
userId: THEIR_USER_ID,
|
userId: THEIR_USER_ID,
|
||||||
},
|
},
|
||||||
});
|
} as unknown as MatrixEvent);
|
||||||
|
|
||||||
expect(grouper.state).toBe(CustomCallState.Missed);
|
expect(grouper.state).toBe(CustomCallState.Missed);
|
||||||
});
|
});
|
||||||
|
@ -73,7 +73,7 @@ describe('CallEventGrouper', () => {
|
||||||
sender: {
|
sender: {
|
||||||
userId: MY_USER_ID,
|
userId: MY_USER_ID,
|
||||||
},
|
},
|
||||||
});
|
} as unknown as MatrixEvent);
|
||||||
grouperHangup.add({
|
grouperHangup.add({
|
||||||
getContent: () => {
|
getContent: () => {
|
||||||
return {
|
return {
|
||||||
|
@ -86,7 +86,7 @@ describe('CallEventGrouper', () => {
|
||||||
sender: {
|
sender: {
|
||||||
userId: THEIR_USER_ID,
|
userId: THEIR_USER_ID,
|
||||||
},
|
},
|
||||||
});
|
} as unknown as MatrixEvent);
|
||||||
|
|
||||||
grouperReject.add({
|
grouperReject.add({
|
||||||
getContent: () => {
|
getContent: () => {
|
||||||
|
@ -100,7 +100,7 @@ describe('CallEventGrouper', () => {
|
||||||
sender: {
|
sender: {
|
||||||
userId: MY_USER_ID,
|
userId: MY_USER_ID,
|
||||||
},
|
},
|
||||||
});
|
} as unknown as MatrixEvent);
|
||||||
grouperReject.add({
|
grouperReject.add({
|
||||||
getContent: () => {
|
getContent: () => {
|
||||||
return {
|
return {
|
||||||
|
@ -113,7 +113,7 @@ describe('CallEventGrouper', () => {
|
||||||
sender: {
|
sender: {
|
||||||
userId: THEIR_USER_ID,
|
userId: THEIR_USER_ID,
|
||||||
},
|
},
|
||||||
});
|
} as unknown as MatrixEvent);
|
||||||
|
|
||||||
expect(grouperHangup.state).toBe(CallState.Ended);
|
expect(grouperHangup.state).toBe(CallState.Ended);
|
||||||
expect(grouperReject.state).toBe(CallState.Ended);
|
expect(grouperReject.state).toBe(CallState.Ended);
|
||||||
|
@ -134,7 +134,7 @@ describe('CallEventGrouper', () => {
|
||||||
getType: () => {
|
getType: () => {
|
||||||
return EventType.CallInvite;
|
return EventType.CallInvite;
|
||||||
},
|
},
|
||||||
});
|
} as unknown as MatrixEvent);
|
||||||
|
|
||||||
expect(grouper.isVoice).toBe(false);
|
expect(grouper.isVoice).toBe(false);
|
||||||
});
|
});
|
||||||
|
|
|
@ -17,7 +17,8 @@ limitations under the License.
|
||||||
import React, { Component } from 'react';
|
import React, { Component } from 'react';
|
||||||
import ReactDOM from 'react-dom';
|
import ReactDOM from 'react-dom';
|
||||||
import ReactTestUtils from 'react-dom/test-utils';
|
import ReactTestUtils from 'react-dom/test-utils';
|
||||||
import { createClient } from "matrix-js-sdk/src/matrix";
|
import { mocked } from 'jest-mock';
|
||||||
|
import { createClient, MatrixClient } from "matrix-js-sdk/src/matrix";
|
||||||
|
|
||||||
import sdk from '../../../skinned-sdk';
|
import sdk from '../../../skinned-sdk';
|
||||||
import SdkConfig from '../../../../src/SdkConfig';
|
import SdkConfig from '../../../../src/SdkConfig';
|
||||||
|
@ -35,10 +36,10 @@ const Login = sdk.getComponent(
|
||||||
|
|
||||||
describe('Login', function() {
|
describe('Login', function() {
|
||||||
let parentDiv;
|
let parentDiv;
|
||||||
const mockClient = {
|
const mockClient = mocked({
|
||||||
login: jest.fn().mockResolvedValue({}),
|
login: jest.fn().mockResolvedValue({}),
|
||||||
loginFlows: jest.fn(),
|
loginFlows: jest.fn(),
|
||||||
};
|
} as unknown as MatrixClient);
|
||||||
|
|
||||||
beforeEach(function() {
|
beforeEach(function() {
|
||||||
jest.spyOn(SdkConfig, "get").mockReturnValue({
|
jest.spyOn(SdkConfig, "get").mockReturnValue({
|
||||||
|
@ -47,7 +48,7 @@ describe('Login', function() {
|
||||||
});
|
});
|
||||||
mockClient.login.mockClear().mockResolvedValue({});
|
mockClient.login.mockClear().mockResolvedValue({});
|
||||||
mockClient.loginFlows.mockClear().mockResolvedValue({ flows: [{ type: "m.login.password" }] });
|
mockClient.loginFlows.mockClear().mockResolvedValue({ flows: [{ type: "m.login.password" }] });
|
||||||
createClient.mockReturnValue(mockClient);
|
mocked(createClient).mockReturnValue(mockClient);
|
||||||
|
|
||||||
parentDiv = document.createElement('div');
|
parentDiv = document.createElement('div');
|
||||||
document.body.appendChild(parentDiv);
|
document.body.appendChild(parentDiv);
|
||||||
|
@ -101,7 +102,7 @@ describe('Login', function() {
|
||||||
});
|
});
|
||||||
|
|
||||||
it("should show SSO button if that flow is available", async () => {
|
it("should show SSO button if that flow is available", async () => {
|
||||||
mockClient.loginFlows.mockReturnValue({ flows: [{ type: "m.login.sso" }] });
|
mockClient.loginFlows.mockResolvedValue({ flows: [{ type: "m.login.sso" }] });
|
||||||
|
|
||||||
const root = render();
|
const root = render();
|
||||||
await flushPromises();
|
await flushPromises();
|
||||||
|
@ -111,7 +112,7 @@ describe('Login', function() {
|
||||||
});
|
});
|
||||||
|
|
||||||
it("should show both SSO button and username+password if both are available", async () => {
|
it("should show both SSO button and username+password if both are available", async () => {
|
||||||
mockClient.loginFlows.mockReturnValue({ flows: [{ type: "m.login.password" }, { type: "m.login.sso" }] });
|
mockClient.loginFlows.mockResolvedValue({ flows: [{ type: "m.login.password" }, { type: "m.login.sso" }] });
|
||||||
|
|
||||||
const root = render();
|
const root = render();
|
||||||
await flushPromises();
|
await flushPromises();
|
||||||
|
@ -124,7 +125,7 @@ describe('Login', function() {
|
||||||
});
|
});
|
||||||
|
|
||||||
it("should show multiple SSO buttons if multiple identity_providers are available", async () => {
|
it("should show multiple SSO buttons if multiple identity_providers are available", async () => {
|
||||||
mockClient.loginFlows.mockReturnValue({
|
mockClient.loginFlows.mockResolvedValue({
|
||||||
flows: [{
|
flows: [{
|
||||||
"type": "m.login.sso",
|
"type": "m.login.sso",
|
||||||
"identity_providers": [{
|
"identity_providers": [{
|
||||||
|
|
|
@ -18,8 +18,8 @@ import React from "react";
|
||||||
import { mount } from "enzyme";
|
import { mount } from "enzyme";
|
||||||
|
|
||||||
import "../../../skinned-sdk";
|
import "../../../skinned-sdk";
|
||||||
import ContextMenu, { ChevronFace } from "../../../../src/components/structures/ContextMenu.tsx";
|
import ContextMenu, { ChevronFace } from "../../../../src/components/structures/ContextMenu";
|
||||||
import UIStore from "../../../../src/stores/UIStore.ts";
|
import UIStore from "../../../../src/stores/UIStore";
|
||||||
|
|
||||||
describe("<ContextMenu />", () => {
|
describe("<ContextMenu />", () => {
|
||||||
// Hardcode window and menu dimensions
|
// Hardcode window and menu dimensions
|
||||||
|
@ -28,7 +28,7 @@ describe("<ContextMenu />", () => {
|
||||||
jest.spyOn(UIStore, "instance", "get").mockImplementation(() => ({
|
jest.spyOn(UIStore, "instance", "get").mockImplementation(() => ({
|
||||||
windowWidth: windowSize,
|
windowWidth: windowSize,
|
||||||
windowHeight: windowSize,
|
windowHeight: windowSize,
|
||||||
}));
|
}) as unknown as UIStore);
|
||||||
window.Element.prototype.getBoundingClientRect = jest.fn().mockReturnValue({
|
window.Element.prototype.getBoundingClientRect = jest.fn().mockReturnValue({
|
||||||
width: menuSize,
|
width: menuSize,
|
||||||
height: menuSize,
|
height: menuSize,
|
||||||
|
@ -38,19 +38,22 @@ describe("<ContextMenu />", () => {
|
||||||
|
|
||||||
describe("near top edge of window", () => {
|
describe("near top edge of window", () => {
|
||||||
const targetY = -50;
|
const targetY = -50;
|
||||||
|
const onFinished = jest.fn();
|
||||||
|
|
||||||
const wrapper = mount(
|
const wrapper = mount(
|
||||||
<ContextMenu
|
<ContextMenu
|
||||||
bottom={windowSize - targetY - menuSize}
|
bottom={windowSize - targetY - menuSize}
|
||||||
right={menuSize}
|
right={menuSize}
|
||||||
|
onFinished={onFinished}
|
||||||
chevronFace={ChevronFace.Left}
|
chevronFace={ChevronFace.Left}
|
||||||
chevronOffset={targetChevronOffset}
|
chevronOffset={targetChevronOffset}
|
||||||
/>,
|
/>,
|
||||||
);
|
);
|
||||||
const chevron = wrapper.find(".mx_ContextualMenu_chevron_left");
|
const chevron = wrapper.find(".mx_ContextualMenu_chevron_left");
|
||||||
|
|
||||||
const actualY = windowSize - parseInt(wrapper.getDOMNode().style.getPropertyValue("bottom")) - menuSize;
|
const bottomStyle = parseInt(wrapper.getDOMNode<HTMLElement>().style.getPropertyValue("bottom"));
|
||||||
const actualChevronOffset = parseInt(chevron.getDOMNode().style.getPropertyValue("top"));
|
const actualY = windowSize - bottomStyle - menuSize;
|
||||||
|
const actualChevronOffset = parseInt(chevron.getDOMNode<HTMLElement>().style.getPropertyValue("top"));
|
||||||
|
|
||||||
it("stays within the window", () => {
|
it("stays within the window", () => {
|
||||||
expect(actualY).toBeGreaterThanOrEqual(0);
|
expect(actualY).toBeGreaterThanOrEqual(0);
|
||||||
|
@ -62,10 +65,12 @@ describe("<ContextMenu />", () => {
|
||||||
|
|
||||||
describe("near right edge of window", () => {
|
describe("near right edge of window", () => {
|
||||||
const targetX = windowSize - menuSize + 50;
|
const targetX = windowSize - menuSize + 50;
|
||||||
|
const onFinished = jest.fn();
|
||||||
|
|
||||||
const wrapper = mount(
|
const wrapper = mount(
|
||||||
<ContextMenu
|
<ContextMenu
|
||||||
bottom={0}
|
bottom={0}
|
||||||
|
onFinished={onFinished}
|
||||||
left={targetX}
|
left={targetX}
|
||||||
chevronFace={ChevronFace.Top}
|
chevronFace={ChevronFace.Top}
|
||||||
chevronOffset={targetChevronOffset}
|
chevronOffset={targetChevronOffset}
|
||||||
|
@ -73,8 +78,8 @@ describe("<ContextMenu />", () => {
|
||||||
);
|
);
|
||||||
const chevron = wrapper.find(".mx_ContextualMenu_chevron_top");
|
const chevron = wrapper.find(".mx_ContextualMenu_chevron_top");
|
||||||
|
|
||||||
const actualX = parseInt(wrapper.getDOMNode().style.getPropertyValue("left"));
|
const actualX = parseInt(wrapper.getDOMNode<HTMLElement>().style.getPropertyValue("left"));
|
||||||
const actualChevronOffset = parseInt(chevron.getDOMNode().style.getPropertyValue("left"));
|
const actualChevronOffset = parseInt(chevron.getDOMNode<HTMLElement>().style.getPropertyValue("left"));
|
||||||
|
|
||||||
it("stays within the window", () => {
|
it("stays within the window", () => {
|
||||||
expect(actualX + menuSize).toBeLessThanOrEqual(windowSize);
|
expect(actualX + menuSize).toBeLessThanOrEqual(windowSize);
|
||||||
|
@ -86,19 +91,21 @@ describe("<ContextMenu />", () => {
|
||||||
|
|
||||||
describe("near bottom edge of window", () => {
|
describe("near bottom edge of window", () => {
|
||||||
const targetY = windowSize - menuSize + 50;
|
const targetY = windowSize - menuSize + 50;
|
||||||
|
const onFinished = jest.fn();
|
||||||
|
|
||||||
const wrapper = mount(
|
const wrapper = mount(
|
||||||
<ContextMenu
|
<ContextMenu
|
||||||
top={targetY}
|
top={targetY}
|
||||||
left={0}
|
left={0}
|
||||||
|
onFinished={onFinished}
|
||||||
chevronFace={ChevronFace.Right}
|
chevronFace={ChevronFace.Right}
|
||||||
chevronOffset={targetChevronOffset}
|
chevronOffset={targetChevronOffset}
|
||||||
/>,
|
/>,
|
||||||
);
|
);
|
||||||
const chevron = wrapper.find(".mx_ContextualMenu_chevron_right");
|
const chevron = wrapper.find(".mx_ContextualMenu_chevron_right");
|
||||||
|
|
||||||
const actualY = parseInt(wrapper.getDOMNode().style.getPropertyValue("top"));
|
const actualY = parseInt(wrapper.getDOMNode<HTMLElement>().style.getPropertyValue("top"));
|
||||||
const actualChevronOffset = parseInt(chevron.getDOMNode().style.getPropertyValue("top"));
|
const actualChevronOffset = parseInt(chevron.getDOMNode<HTMLElement>().style.getPropertyValue("top"));
|
||||||
|
|
||||||
it("stays within the window", () => {
|
it("stays within the window", () => {
|
||||||
expect(actualY + menuSize).toBeLessThanOrEqual(windowSize);
|
expect(actualY + menuSize).toBeLessThanOrEqual(windowSize);
|
||||||
|
@ -110,19 +117,22 @@ describe("<ContextMenu />", () => {
|
||||||
|
|
||||||
describe("near left edge of window", () => {
|
describe("near left edge of window", () => {
|
||||||
const targetX = -50;
|
const targetX = -50;
|
||||||
|
const onFinished = jest.fn();
|
||||||
|
|
||||||
const wrapper = mount(
|
const wrapper = mount(
|
||||||
<ContextMenu
|
<ContextMenu
|
||||||
top={0}
|
top={0}
|
||||||
right={windowSize - targetX - menuSize}
|
right={windowSize - targetX - menuSize}
|
||||||
chevronFace={ChevronFace.Bottom}
|
chevronFace={ChevronFace.Bottom}
|
||||||
|
onFinished={onFinished}
|
||||||
chevronOffset={targetChevronOffset}
|
chevronOffset={targetChevronOffset}
|
||||||
/>,
|
/>,
|
||||||
);
|
);
|
||||||
const chevron = wrapper.find(".mx_ContextualMenu_chevron_bottom");
|
const chevron = wrapper.find(".mx_ContextualMenu_chevron_bottom");
|
||||||
|
|
||||||
const actualX = windowSize - parseInt(wrapper.getDOMNode().style.getPropertyValue("right")) - menuSize;
|
const rightStyle = parseInt(wrapper.getDOMNode<HTMLElement>().style.getPropertyValue("right"));
|
||||||
const actualChevronOffset = parseInt(chevron.getDOMNode().style.getPropertyValue("left"));
|
const actualX = windowSize - rightStyle - menuSize;
|
||||||
|
const actualChevronOffset = parseInt(chevron.getDOMNode<HTMLElement>().style.getPropertyValue("left"));
|
||||||
|
|
||||||
it("stays within the window", () => {
|
it("stays within the window", () => {
|
||||||
expect(actualX).toBeGreaterThanOrEqual(0);
|
expect(actualX).toBeGreaterThanOrEqual(0);
|
||||||
|
|
|
@ -28,5 +28,9 @@
|
||||||
"./test/utils/**/*.tsx",
|
"./test/utils/**/*.tsx",
|
||||||
"./test/stores/**/*.ts",
|
"./test/stores/**/*.ts",
|
||||||
"./test/stores/**/*.tsx",
|
"./test/stores/**/*.tsx",
|
||||||
|
"./test/components/structures/**/*.ts",
|
||||||
|
"./test/components/structures/**/*.tsx",
|
||||||
|
"./test/components/views/context_menus/**/*.ts",
|
||||||
|
"./test/components/views/context_menus/**/*.tsx",
|
||||||
],
|
],
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue