mirror of
https://github.com/element-hq/element-web.git
synced 2024-12-14 11:51:59 +03:00
73360026ab
* convert useProfileInfo to RTL * convert useLatestResult to RTL
136 lines
5.4 KiB
TypeScript
136 lines
5.4 KiB
TypeScript
/*
|
|
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 { renderHook, RenderHookResult } from "@testing-library/react-hooks/dom";
|
|
|
|
import { useLatestResult } from "../../src/hooks/useLatestResult";
|
|
|
|
// All tests use fake timers throughout, comments will show the elapsed time in ms
|
|
jest.useFakeTimers();
|
|
|
|
const mockSetter = jest.fn();
|
|
|
|
beforeEach(() => {
|
|
mockSetter.mockClear();
|
|
});
|
|
|
|
function simulateRequest(
|
|
hookResult: RenderHookResult<typeof useLatestResult, ReturnType<typeof useLatestResult>>["result"],
|
|
{ id, delayInMs, result }: { id: string; delayInMs: number; result: string },
|
|
) {
|
|
const [setQuery, setResult] = hookResult.current;
|
|
setQuery(id);
|
|
setTimeout(() => setResult(id, result), delayInMs);
|
|
}
|
|
|
|
describe("renderhook tests", () => {
|
|
it("should return a result", () => {
|
|
const { result: hookResult } = renderHook(() => useLatestResult(mockSetter));
|
|
|
|
const query = { id: "query1", delayInMs: 100, result: "result1" };
|
|
simulateRequest(hookResult, query);
|
|
|
|
// check we have made no calls to the setter
|
|
expect(mockSetter).not.toHaveBeenCalled();
|
|
|
|
// advance timer until the timeout elapses, check we have called the setter
|
|
jest.advanceTimersToNextTimer();
|
|
expect(mockSetter).toHaveBeenCalledTimes(1);
|
|
expect(mockSetter).toHaveBeenLastCalledWith(query.result);
|
|
});
|
|
|
|
it("should not let a slower response to an earlier query overwrite the result of a later query", () => {
|
|
const { result: hookResult } = renderHook(() => useLatestResult(mockSetter));
|
|
|
|
const slowQuery = { id: "slowQuery", delayInMs: 500, result: "slowResult" };
|
|
const fastQuery = { id: "fastQuery", delayInMs: 100, result: "fastResult" };
|
|
|
|
simulateRequest(hookResult, slowQuery);
|
|
simulateRequest(hookResult, fastQuery);
|
|
|
|
// advance to fastQuery response, check the setter call
|
|
jest.advanceTimersToNextTimer();
|
|
expect(mockSetter).toHaveBeenCalledTimes(1);
|
|
expect(mockSetter).toHaveBeenLastCalledWith(fastQuery.result);
|
|
|
|
// advance time to slowQuery response, check the setter has _not_ been
|
|
// called again and that the result is still from the fast query
|
|
jest.advanceTimersToNextTimer();
|
|
expect(mockSetter).toHaveBeenCalledTimes(1);
|
|
expect(mockSetter).toHaveBeenLastCalledWith(fastQuery.result);
|
|
});
|
|
|
|
it("should return expected results when all response times similar", () => {
|
|
const { result: hookResult } = renderHook(() => useLatestResult(mockSetter));
|
|
|
|
const commonDelayInMs = 180;
|
|
const query1 = { id: "q1", delayInMs: commonDelayInMs, result: "r1" };
|
|
const query2 = { id: "q2", delayInMs: commonDelayInMs, result: "r2" };
|
|
const query3 = { id: "q3", delayInMs: commonDelayInMs, result: "r3" };
|
|
|
|
// ELAPSED: 0ms, no queries sent
|
|
simulateRequest(hookResult, query1);
|
|
jest.advanceTimersByTime(100);
|
|
|
|
// ELAPSED: 100ms, query1 sent, no responses
|
|
expect(mockSetter).not.toHaveBeenCalled();
|
|
simulateRequest(hookResult, query2);
|
|
jest.advanceTimersByTime(70);
|
|
|
|
// ELAPSED: 170ms, query1 and query2 sent, no responses
|
|
expect(mockSetter).not.toHaveBeenCalled();
|
|
simulateRequest(hookResult, query3);
|
|
jest.advanceTimersByTime(70);
|
|
|
|
// ELAPSED: 240ms, all queries sent, responses for query1 and query2
|
|
expect(mockSetter).not.toHaveBeenCalled();
|
|
|
|
// ELAPSED: 360ms, all queries sent, all queries have responses
|
|
jest.advanceTimersByTime(120);
|
|
expect(mockSetter).toHaveBeenLastCalledWith(query3.result);
|
|
});
|
|
|
|
it("should prevent out of order results", () => {
|
|
const { result: hookResult } = renderHook(() => useLatestResult(mockSetter));
|
|
|
|
const query1 = { id: "q1", delayInMs: 0, result: "r1" };
|
|
const query2 = { id: "q2", delayInMs: 50, result: "r2" };
|
|
const query3 = { id: "q3", delayInMs: 1, result: "r3" };
|
|
|
|
// ELAPSED: 0ms, no queries sent
|
|
simulateRequest(hookResult, query1);
|
|
jest.advanceTimersByTime(5);
|
|
|
|
// ELAPSED: 5ms, query1 sent, response from query1
|
|
expect(mockSetter).toHaveBeenCalledTimes(1);
|
|
expect(mockSetter).toHaveBeenLastCalledWith(query1.result);
|
|
simulateRequest(hookResult, query2);
|
|
jest.advanceTimersByTime(5);
|
|
|
|
// ELAPSED: 10ms, query1 and query2 sent, response from query1
|
|
simulateRequest(hookResult, query3);
|
|
jest.advanceTimersByTime(5);
|
|
|
|
// ELAPSED: 15ms, all queries sent, responses from query1 and query3
|
|
expect(mockSetter).toHaveBeenCalledTimes(2);
|
|
expect(mockSetter).toHaveBeenLastCalledWith(query3.result);
|
|
|
|
// ELAPSED: 65ms, all queries sent, all queries have responses
|
|
// so check that the result is still from query3, not query2
|
|
jest.advanceTimersByTime(50);
|
|
expect(mockSetter).toHaveBeenLastCalledWith(query3.result);
|
|
});
|
|
});
|