91e84f7951
* Upgrade to latest compound-web package * Use a custom render function for jest tests This way we don't need to manually wrap our components with <TooltipProvider> * Pin wrap-ansi to fix broken yarn install * Add playwright helper to find tooltip from element and use it in the failing test * Exclude floating-ui divs/spans from axe testing This is rendered outside .MatrixChat by compound and contains all the tooltips. * Wrap outermost components with TooltipProvider * Remove onChange and use onSelect for toggle * Fix jest tests and update snapshots * Use vector-im/matrix-wysiwig --------- Co-authored-by: Michael Telatynski <7t3chguy@gmail.com>
71 lines
2.4 KiB
TypeScript
71 lines
2.4 KiB
TypeScript
/*
|
|
Copyright 2024 New Vector Ltd.
|
|
Copyright 2024 The Matrix.org Foundation C.I.C.
|
|
|
|
SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only
|
|
Please see LICENSE files in the repository root for full details.
|
|
*/
|
|
|
|
import React from "react";
|
|
import { render, screen } from "jest-matrix-react";
|
|
|
|
import ReadReceiptMarker, { IReadReceiptPosition } from "../../../../src/components/views/rooms/ReadReceiptMarker";
|
|
|
|
describe("ReadReceiptMarker", () => {
|
|
afterEach(() => {
|
|
jest.restoreAllMocks();
|
|
jest.useRealTimers();
|
|
});
|
|
|
|
it("should position at -16px if given no previous position", () => {
|
|
render(<ReadReceiptMarker fallbackUserId="bob" offset={0} />);
|
|
|
|
expect(screen.getByTestId("avatar-img").style.top).toBe("-16px");
|
|
});
|
|
|
|
it("should position at previous top if given", () => {
|
|
render(<ReadReceiptMarker fallbackUserId="bob" offset={0} readReceiptPosition={{ top: 100, right: 0 }} />);
|
|
|
|
expect(screen.getByTestId("avatar-img").style.top).toBe("100px");
|
|
});
|
|
|
|
it("should apply new styles after mounted to animate", () => {
|
|
jest.useFakeTimers();
|
|
|
|
render(<ReadReceiptMarker fallbackUserId="bob" offset={0} readReceiptPosition={{ top: 100, right: 0 }} />);
|
|
expect(screen.getByTestId("avatar-img").style.top).toBe("100px");
|
|
|
|
jest.runAllTimers();
|
|
|
|
expect(screen.getByTestId("avatar-img").style.top).toBe("0px");
|
|
});
|
|
|
|
it("should update readReceiptPosition when unmounted", () => {
|
|
const pos: IReadReceiptPosition = {};
|
|
const { unmount } = render(<ReadReceiptMarker fallbackUserId="bob" offset={0} readReceiptPosition={pos} />);
|
|
|
|
expect(pos.top).toBeUndefined();
|
|
|
|
unmount();
|
|
|
|
expect(pos.top).toBe(0);
|
|
});
|
|
|
|
it("should update readReceiptPosition to current position", () => {
|
|
const pos: IReadReceiptPosition = {};
|
|
jest.spyOn(HTMLElement.prototype, "offsetParent", "get").mockImplementation(function (): Element | null {
|
|
return {
|
|
getBoundingClientRect: jest.fn().mockReturnValue({ top: 0, right: 0 } as DOMRect),
|
|
} as unknown as Element;
|
|
});
|
|
jest.spyOn(HTMLElement.prototype, "getBoundingClientRect").mockReturnValue({ top: 100, right: 0 } as DOMRect);
|
|
|
|
const { unmount } = render(<ReadReceiptMarker fallbackUserId="bob" offset={0} readReceiptPosition={pos} />);
|
|
|
|
expect(pos.top).toBeUndefined();
|
|
|
|
unmount();
|
|
|
|
expect(pos.top).toBe(100);
|
|
});
|
|
});
|