From 209ab59978fb8011b679d98d7067baaa224c6b5d Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Fri, 28 Mar 2025 10:36:10 +0000 Subject: [PATCH] Replace onHeightChanged with ResizeObserver (#29602) * Replace onHeightChanged with ResizeObserver Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Iterate Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --------- Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- src/components/structures/MessagePanel.tsx | 13 ++++++------ src/components/structures/RoomSearchView.tsx | 7 ------- src/components/views/elements/ReplyChain.tsx | 4 ---- src/components/views/messages/CodeBlock.tsx | 5 +---- .../views/messages/EventContentBody.tsx | 20 +++---------------- src/components/views/messages/IBodyProps.ts | 3 --- src/components/views/messages/MFileBody.tsx | 6 ------ src/components/views/messages/MImageBody.tsx | 1 - src/components/views/messages/MVideoBody.tsx | 2 -- .../views/messages/MessageEvent.tsx | 1 - .../views/messages/ReactionsRow.tsx | 1 - src/components/views/messages/TextualBody.tsx | 2 -- .../views/polls/pollHistory/PollDetail.tsx | 4 ---- src/components/views/rooms/EventTile.tsx | 20 +++++-------------- .../views/rooms/LinkPreviewGroup.tsx | 9 ++------- .../views/rooms/PinnedEventTile.tsx | 1 - src/components/views/rooms/ReplyTile.tsx | 9 --------- .../views/rooms/SearchResultTile.tsx | 2 -- src/events/EventTileFactory.tsx | 6 ------ src/renderer/code-block.tsx | 4 ++-- src/renderer/utils.tsx | 1 - .../views/messages/MBeaconBody-test.tsx | 1 - .../views/messages/MFileBody-test.tsx | 1 - .../views/messages/MImageBody-test.tsx | 1 - .../views/messages/MLocationBody-test.tsx | 1 - .../views/messages/MPollBody-test.tsx | 1 - .../views/messages/MPollEndBody-test.tsx | 1 - .../views/messages/MStickerBody-test.tsx | 1 - .../views/messages/MVideoBody-test.tsx | 1 - .../views/messages/MessageEvent-test.tsx | 8 +------- .../views/messages/TextualBody-test.tsx | 19 ++++-------------- 31 files changed, 24 insertions(+), 132 deletions(-) diff --git a/src/components/structures/MessagePanel.tsx b/src/components/structures/MessagePanel.tsx index b51c45ff39..2441182bc8 100644 --- a/src/components/structures/MessagePanel.tsx +++ b/src/components/structures/MessagePanel.tsx @@ -292,6 +292,7 @@ export default class MessagePanel extends React.Component { this.props.room?.currentState.off(RoomStateEvent.Update, this.calculateRoomMembersCount); SettingsStore.unwatchSetting(this.showTypingNotificationsWatcherRef); this.readReceiptMap = {}; + this.resizeObserver.disconnect(); } public componentDidUpdate(prevProps: IProps, prevState: IState): void { @@ -800,7 +801,7 @@ export default class MessagePanel extends React.Component { isRedacted={mxEv.isRedacted()} replacingEventId={mxEv.replacingEventId()} editState={isEditing ? this.props.editState : undefined} - onHeightChanged={this.onHeightChanged} + resizeObserver={this.resizeObserver} readReceipts={readReceipts} readReceiptMap={this.readReceiptMap} showUrlPreview={this.props.showUrlPreview} @@ -953,15 +954,13 @@ export default class MessagePanel extends React.Component { this.eventTiles[eventId] = node; }; - // once dynamic content in the events load, make the scrollPanel check the - // scroll offsets. + // Once dynamic content in the events load, make the scrollPanel check the scroll offsets. public onHeightChanged = (): void => { - const scrollPanel = this.scrollPanel.current; - if (scrollPanel) { - scrollPanel.checkScroll(); - } + this.scrollPanel.current?.checkScroll(); }; + private resizeObserver = new ResizeObserver(this.onHeightChanged); + private onTypingShown = (): void => { const scrollPanel = this.scrollPanel.current; // this will make the timeline grow, so checkScroll diff --git a/src/components/structures/RoomSearchView.tsx b/src/components/structures/RoomSearchView.tsx index 8533a6400b..cd03a0140a 100644 --- a/src/components/structures/RoomSearchView.tsx +++ b/src/components/structures/RoomSearchView.tsx @@ -198,12 +198,6 @@ export const RoomSearchView = forwardRef( } } - // once dynamic content in the search results load, make the scrollPanel check - // the scroll offsets. - const onHeightChanged = (): void => { - innerRef.current?.checkScroll(); - }; - const onRef = (e: ScrollPanel | null): void => { if (typeof ref === "function") { ref(e); @@ -302,7 +296,6 @@ export const RoomSearchView = forwardRef( searchHighlights={highlights ?? []} resultLink={resultLink} permalinkCreator={permalinkCreator} - onHeightChanged={onHeightChanged} />, ); diff --git a/src/components/views/elements/ReplyChain.tsx b/src/components/views/elements/ReplyChain.tsx index 883bdae867..9ff1c1e017 100644 --- a/src/components/views/elements/ReplyChain.tsx +++ b/src/components/views/elements/ReplyChain.tsx @@ -36,8 +36,6 @@ const SHOW_EXPAND_QUOTE_PIXELS = 60; interface IProps { // the latest event in this chain of replies parentEv: MatrixEvent; - // called when the ReplyChain contents has changed, including EventTiles thereof - onHeightChanged?: () => void; permalinkCreator?: RoomPermalinkCreator; // Specifies which layout to use. layout?: Layout; @@ -95,7 +93,6 @@ export default class ReplyChain extends React.Component { } public componentDidUpdate(): void { - this.props.onHeightChanged?.(); this.trySetExpandableQuotes(); } @@ -266,7 +263,6 @@ export default class ReplyChain extends React.Component {
this.props.setQuoteExpanded(!this.props.isQuoteExpanded)} getRelationsForEvent={this.props.getRelationsForEvent} diff --git a/src/components/views/messages/CodeBlock.tsx b/src/components/views/messages/CodeBlock.tsx index 2ec5f728b3..cb21ffb5e0 100644 --- a/src/components/views/messages/CodeBlock.tsx +++ b/src/components/views/messages/CodeBlock.tsx @@ -18,7 +18,6 @@ const MAX_LINES_BEFORE_COLLAPSE = 5; interface Props { preNode: ParserElement; - onHeightChanged?(): void; } const ExpandCollapseButton: React.FC<{ @@ -36,7 +35,7 @@ const ExpandCollapseButton: React.FC<{ ); }; -const CodeBlock: React.FC = ({ preNode, onHeightChanged }) => { +const CodeBlock: React.FC = ({ preNode }) => { const enableSyntaxHighlightLanguageDetection = useSettingValue("enableSyntaxHighlightLanguageDetection"); const showCodeLineNumbers = useSettingValue("showCodeLineNumbers"); const expandCodeByDefault = useSettingValue("expandCodeByDefault"); @@ -51,8 +50,6 @@ const CodeBlock: React.FC = ({ preNode, onHeightChanged }) => { expanded={expanded} onClick={() => { setExpanded(!expanded); - // By expanding/collapsing we changed the height, therefore we call this - onHeightChanged?.(); }} /> ); diff --git a/src/components/views/messages/EventContentBody.tsx b/src/components/views/messages/EventContentBody.tsx index bf0e48c16a..3e51691c24 100644 --- a/src/components/views/messages/EventContentBody.tsx +++ b/src/components/views/messages/EventContentBody.tsx @@ -69,12 +69,7 @@ interface ReplacerOptions { } // Returns a memoized Replacer based on the input parameters -const useReplacer = ( - content: IContent, - mxEvent: MatrixEvent | undefined, - onHeightChanged: (() => void) | undefined, - options: ReplacerOptions, -): Replacer => { +const useReplacer = (content: IContent, mxEvent: MatrixEvent | undefined, options: ReplacerOptions): Replacer => { const cli = useContext(MatrixClientContext); const room = cli.getRoom(mxEvent?.getRoomId()) ?? undefined; @@ -98,7 +93,6 @@ const useReplacer = ( room, shouldShowPillAvatar, keywordRegexpPattern, - onHeightChanged, }); }, [ mxEvent, @@ -110,7 +104,6 @@ const useReplacer = ( isHtml, room, shouldShowPillAvatar, - onHeightChanged, ]); return replacer; @@ -141,10 +134,6 @@ interface Props extends ReplacerOptions { * Highlights to emphasise in the content */ highlights?: string[]; - /** - * Callback for when the height of the content changes - */ - onHeightChanged?: () => void; /** * Whether to include the `dir="auto"` attribute on the rendered element */ @@ -159,13 +148,10 @@ interface Props extends ReplacerOptions { */ const EventContentBody = memo( forwardRef( - ( - { as, mxEvent, stripReply, content, onHeightChanged, linkify, highlights, includeDir = true, ...options }, - ref, - ) => { + ({ as, mxEvent, stripReply, content, linkify, highlights, includeDir = true, ...options }, ref) => { const enableBigEmoji = useSettingValue("TextualBody.enableBigEmoji"); - const replacer = useReplacer(content, mxEvent, onHeightChanged, options); + const replacer = useReplacer(content, mxEvent, options); const linkifyOptions = useMemo( () => ({ render: replacerToRenderFunction(replacer), diff --git a/src/components/views/messages/IBodyProps.ts b/src/components/views/messages/IBodyProps.ts index 8ef1dc7fda..59f5030c75 100644 --- a/src/components/views/messages/IBodyProps.ts +++ b/src/components/views/messages/IBodyProps.ts @@ -24,9 +24,6 @@ export interface IBodyProps { /* link URL for the highlights */ highlightLink?: string; - /* callback called when dynamic content in events are loaded */ - onHeightChanged?: () => void; - showUrlPreview?: boolean; forExport?: boolean; maxImageHeight?: number; diff --git a/src/components/views/messages/MFileBody.tsx b/src/components/views/messages/MFileBody.tsx index c5a9977e21..24b141599e 100644 --- a/src/components/views/messages/MFileBody.tsx +++ b/src/components/views/messages/MFileBody.tsx @@ -142,12 +142,6 @@ export default class MFileBody extends React.Component { }); } - public componentDidUpdate(prevProps: IProps, prevState: IState): void { - if (this.props.onHeightChanged && !prevState.decryptedBlob && this.state.decryptedBlob) { - this.props.onHeightChanged(); - } - } - private decryptFile = async (): Promise => { if (this.state.decryptedBlob) { return; diff --git a/src/components/views/messages/MImageBody.tsx b/src/components/views/messages/MImageBody.tsx index 7ce2cc097e..7c42ea4462 100644 --- a/src/components/views/messages/MImageBody.tsx +++ b/src/components/views/messages/MImageBody.tsx @@ -179,7 +179,6 @@ export class MImageBodyInner extends React.Component { private onImageLoad = (): void => { this.clearBlurhashTimeout(); - this.props.onHeightChanged?.(); let loadedImageDimensions: IState["loadedImageDimensions"]; diff --git a/src/components/views/messages/MVideoBody.tsx b/src/components/views/messages/MVideoBody.tsx index be0f692fe8..58ba7575fe 100644 --- a/src/components/views/messages/MVideoBody.tsx +++ b/src/components/views/messages/MVideoBody.tsx @@ -156,7 +156,6 @@ class MVideoBodyInner extends React.PureComponent { decryptedThumbnailUrl: thumbnailUrl, decryptedBlob: await this.props.mediaEventHelper.sourceBlob.value, }); - this.props.onHeightChanged?.(); } else { logger.log("NOT preloading video"); const content = this.props.mxEvent.getContent(); @@ -235,7 +234,6 @@ class MVideoBodyInner extends React.PureComponent { this.videoRef.current.play(); }, ); - this.props.onHeightChanged?.(); }; protected get showFileBody(): boolean { diff --git a/src/components/views/messages/MessageEvent.tsx b/src/components/views/messages/MessageEvent.tsx index 9b32c7f96a..231fa7f1fe 100644 --- a/src/components/views/messages/MessageEvent.tsx +++ b/src/components/views/messages/MessageEvent.tsx @@ -302,7 +302,6 @@ export default class MessageEvent extends React.Component implements IMe maxImageHeight: this.props.maxImageHeight, replacingEventId: this.props.replacingEventId, editState: this.props.editState, - onHeightChanged: this.props.onHeightChanged, onMessageAllowed: this.onTileUpdate, permalinkCreator: this.props.permalinkCreator, mediaEventHelper: this.mediaHelper, diff --git a/src/components/views/messages/ReactionsRow.tsx b/src/components/views/messages/ReactionsRow.tsx index 2e8b1f8c24..0c5dbdd1e2 100644 --- a/src/components/views/messages/ReactionsRow.tsx +++ b/src/components/views/messages/ReactionsRow.tsx @@ -127,7 +127,6 @@ export default class ReactionsRow extends React.PureComponent { }; private onReactionsChange = (): void => { - // TODO: Call `onHeightChanged` as needed this.setState({ myReactions: this.getMyReactions(), }); diff --git a/src/components/views/messages/TextualBody.tsx b/src/components/views/messages/TextualBody.tsx index bfca88bd4e..0a8cf22fb9 100644 --- a/src/components/views/messages/TextualBody.tsx +++ b/src/components/views/messages/TextualBody.tsx @@ -331,7 +331,6 @@ export default class TextualBody extends React.Component { stripReply={stripReply} linkify highlights={this.props.highlights} - onHeightChanged={this.props.onHeightChanged} ref={this.contentRef} renderKeywordPills renderMentionPills @@ -377,7 +376,6 @@ export default class TextualBody extends React.Component { links={this.state.links} mxEvent={this.props.mxEvent} onCancelClick={this.onCancelClick} - onHeightChanged={this.props.onHeightChanged} /> ); } diff --git a/src/components/views/polls/pollHistory/PollDetail.tsx b/src/components/views/polls/pollHistory/PollDetail.tsx index 7b6d6dd5bb..aafa85263c 100644 --- a/src/components/views/polls/pollHistory/PollDetail.tsx +++ b/src/components/views/polls/pollHistory/PollDetail.tsx @@ -24,8 +24,6 @@ interface Props { permalinkCreator: RoomPermalinkCreator; } -const NOOP = (): void => {}; - /** * Content of PollHistory when a specific poll is selected */ @@ -56,8 +54,6 @@ export const PollDetail: React.FC = ({ poll, permalinkCreator, requestMod void; + resizeObserver?: ResizeObserver; // a list of read-receipts we should show. Each object has a 'roomMember' and 'ts'. readReceipts?: IReadReceiptProps[]; @@ -289,8 +288,6 @@ export class UnwrappedEventTile extends React.Component public readonly ref = createRef(); public static defaultProps = { - // no-op function because onHeightChanged is optional yet some sub-components assume its existence - onHeightChanged: function () {}, forExport: false, layout: Layout.Group, }; @@ -443,14 +440,10 @@ export class UnwrappedEventTile extends React.Component } this.props.mxEvent.off(ThreadEvent.Update, this.updateThread); this.unmounted = false; + if (this.props.resizeObserver && this.ref.current) this.props.resizeObserver.unobserve(this.ref.current); } public componentDidUpdate(prevProps: Readonly, prevState: Readonly): void { - // If the shield state changed, the height might have changed. - // XXX: does the shield *actually* cause a change in height? Not sure. - if (prevState.shieldColour !== this.state.shieldColour && this.props.onHeightChanged) { - this.props.onHeightChanged(); - } // If we're not listening for receipts and expect to be, register a listener. if (!this.isListeningForReceipts && (this.shouldShowSentReceipt || this.shouldShowSendingReceipt)) { MatrixClientPeg.safeGet().on(RoomEvent.Receipt, this.onRoomReceipt); @@ -460,6 +453,8 @@ export class UnwrappedEventTile extends React.Component if (prevProps.eventSendStatus !== this.props.eventSendStatus) { this.verifyEvent(); } + + if (this.props.resizeObserver && this.ref.current) this.props.resizeObserver.observe(this.ref.current); } private onNewThread = (thread: Thread): void => { @@ -564,8 +559,7 @@ export class UnwrappedEventTile extends React.Component private onDecrypted = (): void => { // we need to re-verify the sending device. this.verifyEvent(); - // decryption might, of course, trigger a height change, so call onHeightChanged after the re-render - this.forceUpdate(this.props.onHeightChanged); + this.forceUpdate(); }; private onUserVerificationChanged = (userId: string, _trustStatus: UserVerificationStatus): void => { @@ -1201,7 +1195,6 @@ export class UnwrappedEventTile extends React.Component replyChain = ( // appease TS highlights: this.props.highlights, highlightLink: this.props.highlightLink, - onHeightChanged: () => this.props.onHeightChanged, permalinkCreator: this.props.permalinkCreator!, }, this.context.showHiddenEvents, @@ -1401,7 +1393,6 @@ export class UnwrappedEventTile extends React.Component // appease TS highlights: this.props.highlights, highlightLink: this.props.highlightLink, - onHeightChanged: this.props.onHeightChanged, permalinkCreator: this.props.permalinkCreator, }, this.context.showHiddenEvents, @@ -1453,7 +1444,6 @@ export class UnwrappedEventTile extends React.Component // appease TS highlights: this.props.highlights, highlightLink: this.props.highlightLink, - onHeightChanged: this.props.onHeightChanged, permalinkCreator: this.props.permalinkCreator, }, this.context.showHiddenEvents, diff --git a/src/components/views/rooms/LinkPreviewGroup.tsx b/src/components/views/rooms/LinkPreviewGroup.tsx index a3e922d75c..84943c24e8 100644 --- a/src/components/views/rooms/LinkPreviewGroup.tsx +++ b/src/components/views/rooms/LinkPreviewGroup.tsx @@ -6,7 +6,7 @@ SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Com Please see LICENSE files in the repository root for full details. */ -import React, { type JSX, useContext, useEffect } from "react"; +import React, { type JSX, useContext } from "react"; import { type MatrixEvent, MatrixError, type IPreviewUrlResponse, type MatrixClient } from "matrix-js-sdk/src/matrix"; import { logger } from "matrix-js-sdk/src/logger"; import CloseIcon from "@vector-im/compound-design-tokens/assets/web/icons/close"; @@ -24,10 +24,9 @@ interface IProps { links: string[]; // the URLs to be previewed mxEvent: MatrixEvent; // the Event associated with the preview onCancelClick(): void; // called when the preview's cancel ('hide') button is clicked - onHeightChanged?(): void; // called when the preview's contents has loaded } -const LinkPreviewGroup: React.FC = ({ links, mxEvent, onCancelClick, onHeightChanged }) => { +const LinkPreviewGroup: React.FC = ({ links, mxEvent, onCancelClick }) => { const cli = useContext(MatrixClientContext); const [expanded, toggleExpanded] = useStateToggle(); @@ -40,10 +39,6 @@ const LinkPreviewGroup: React.FC = ({ links, mxEvent, onCancelClick, onH [], ); - useEffect(() => { - onHeightChanged?.(); - }, [onHeightChanged, expanded, previews]); - const showPreviews = expanded ? previews : previews.slice(0, INITIAL_NUM_PREVIEWS); let toggleButton: JSX.Element | undefined; diff --git a/src/components/views/rooms/PinnedEventTile.tsx b/src/components/views/rooms/PinnedEventTile.tsx index cfa9db2526..afb612c397 100644 --- a/src/components/views/rooms/PinnedEventTile.tsx +++ b/src/components/views/rooms/PinnedEventTile.tsx @@ -90,7 +90,6 @@ export function PinnedEventTile({ event, room, permalinkCreator }: PinnedEventTi {}} // we need to give this, apparently permalinkCreator={permalinkCreator} replacingEventId={event.replacingEventId()} /> diff --git a/src/components/views/rooms/ReplyTile.tsx b/src/components/views/rooms/ReplyTile.tsx index 0f2b580d7e..2db56e397e 100644 --- a/src/components/views/rooms/ReplyTile.tsx +++ b/src/components/views/rooms/ReplyTile.tsx @@ -33,7 +33,6 @@ interface IProps { permalinkCreator?: RoomPermalinkCreator; highlights?: string[]; highlightLink?: string; - onHeightChanged?(): void; toggleExpandedQuote?: () => void; getRelationsForEvent?: GetRelationsForEvent; } @@ -41,10 +40,6 @@ interface IProps { export default class ReplyTile extends React.PureComponent { private anchorElement = createRef(); - public static defaultProps = { - onHeightChanged: () => {}, - }; - public componentDidMount(): void { this.props.mxEvent.on(MatrixEventEvent.Decrypted, this.onDecrypted); this.props.mxEvent.on(MatrixEventEvent.BeforeRedaction, this.onEventRequiresUpdate); @@ -59,9 +54,6 @@ export default class ReplyTile extends React.PureComponent { private onDecrypted = (): void => { this.forceUpdate(); - if (this.props.onHeightChanged) { - this.props.onHeightChanged(); - } }; private onEventRequiresUpdate = (): void => { @@ -170,7 +162,6 @@ export default class ReplyTile extends React.PureComponent { // appease TS highlights: this.props.highlights, highlightLink: this.props.highlightLink, - onHeightChanged: this.props.onHeightChanged, permalinkCreator: this.props.permalinkCreator, }, false /* showHiddenEvents shouldn't be relevant */, diff --git a/src/components/views/rooms/SearchResultTile.tsx b/src/components/views/rooms/SearchResultTile.tsx index 289f3fb008..e5a77df60e 100644 --- a/src/components/views/rooms/SearchResultTile.tsx +++ b/src/components/views/rooms/SearchResultTile.tsx @@ -31,7 +31,6 @@ interface IProps { timeline: MatrixEvent[]; // indexes of the matching events (not contextual ones) ourEventsIndexes: number[]; - onHeightChanged?: () => void; permalinkCreator?: RoomPermalinkCreator; } @@ -115,7 +114,6 @@ export default class SearchResultTile extends React.Component { highlights={highlights} permalinkCreator={this.props.permalinkCreator} highlightLink={this.props.resultLink} - onHeightChanged={this.props.onHeightChanged} isTwelveHour={isTwelveHour} alwaysShowTimestamps={alwaysShowTimestamps} lastInSection={lastInSection} diff --git a/src/events/EventTileFactory.tsx b/src/events/EventTileFactory.tsx index eeeb7b4875..12e9f869f3 100644 --- a/src/events/EventTileFactory.tsx +++ b/src/events/EventTileFactory.tsx @@ -52,7 +52,6 @@ export interface EventTileTypeProps | "highlights" | "highlightLink" | "showUrlPreview" - | "onHeightChanged" | "forExport" | "getRelationsForEvent" | "editState" @@ -274,7 +273,6 @@ export function renderTile( highlightLink, showUrlPreview, permalinkCreator, - onHeightChanged, callEventGrouper, getRelationsForEvent, isSeeingThroughMessageHiddenForModeration, @@ -292,7 +290,6 @@ export function renderTile( highlights, highlightLink, showUrlPreview, - onHeightChanged, editState, replacingEventId, getRelationsForEvent, @@ -311,7 +308,6 @@ export function renderTile( highlightLink, showUrlPreview, permalinkCreator, - onHeightChanged, callEventGrouper, getRelationsForEvent, isSeeingThroughMessageHiddenForModeration, @@ -344,7 +340,6 @@ export function renderReplyTile( mxEvent, highlights, highlightLink, - onHeightChanged, showUrlPreview, overrideBodyTypes, overrideEventTypes, @@ -359,7 +354,6 @@ export function renderReplyTile( mxEvent, highlights, highlightLink, - onHeightChanged, showUrlPreview, overrideBodyTypes, overrideEventTypes, diff --git a/src/renderer/code-block.tsx b/src/renderer/code-block.tsx index af9e4faefb..78b8282489 100644 --- a/src/renderer/code-block.tsx +++ b/src/renderer/code-block.tsx @@ -14,7 +14,7 @@ import CodeBlock from "../components/views/messages/CodeBlock.tsx"; * Replaces `pre` elements with a CodeBlock component */ export const codeBlockRenderer: RendererMap = { - pre: (pre, { onHeightChanged }) => { - return ; + pre: (pre) => { + return ; }, }; diff --git a/src/renderer/utils.tsx b/src/renderer/utils.tsx index 5c7d6959e5..0cf37b9a8c 100644 --- a/src/renderer/utils.tsx +++ b/src/renderer/utils.tsx @@ -88,7 +88,6 @@ export function replacerToRenderFunction(replacer: Replacer): Opts["render"] { interface Parameters { isHtml: boolean; - onHeightChanged?: () => void; // Required for keywordPillRenderer keywordRegexpPattern?: RegExp; // Required for mentionPillRenderer diff --git a/test/unit-tests/components/views/messages/MBeaconBody-test.tsx b/test/unit-tests/components/views/messages/MBeaconBody-test.tsx index 3c6f05d7ec..e0b6481307 100644 --- a/test/unit-tests/components/views/messages/MBeaconBody-test.tsx +++ b/test/unit-tests/components/views/messages/MBeaconBody-test.tsx @@ -63,7 +63,6 @@ describe("", () => { mxEvent: defaultEvent, highlights: [], highlightLink: "", - onHeightChanged: jest.fn(), onMessageAllowed: jest.fn(), // we dont use these and they pollute the snapshots permalinkCreator: {} as unknown as RoomPermalinkCreator, diff --git a/test/unit-tests/components/views/messages/MFileBody-test.tsx b/test/unit-tests/components/views/messages/MFileBody-test.tsx index 6d7f491bbe..e5e56c2efa 100644 --- a/test/unit-tests/components/views/messages/MFileBody-test.tsx +++ b/test/unit-tests/components/views/messages/MFileBody-test.tsx @@ -62,7 +62,6 @@ describe("", () => { }); const props = { - onHeightChanged: jest.fn(), onMessageAllowed: jest.fn(), permalinkCreator: new RoomPermalinkCreator(new Room(mediaEvent.getRoomId()!, cli, cli.getUserId()!)), }; diff --git a/test/unit-tests/components/views/messages/MImageBody-test.tsx b/test/unit-tests/components/views/messages/MImageBody-test.tsx index e22989fd47..b46ae29f3b 100644 --- a/test/unit-tests/components/views/messages/MImageBody-test.tsx +++ b/test/unit-tests/components/views/messages/MImageBody-test.tsx @@ -75,7 +75,6 @@ describe("", () => { }); const props = { - onHeightChanged: jest.fn(), onMessageAllowed: jest.fn(), permalinkCreator: new RoomPermalinkCreator(new Room(encryptedMediaEvent.getRoomId()!, cli, cli.getUserId()!)), }; diff --git a/test/unit-tests/components/views/messages/MLocationBody-test.tsx b/test/unit-tests/components/views/messages/MLocationBody-test.tsx index 18a1abb4a9..35681700ca 100644 --- a/test/unit-tests/components/views/messages/MLocationBody-test.tsx +++ b/test/unit-tests/components/views/messages/MLocationBody-test.tsx @@ -39,7 +39,6 @@ describe("MLocationBody", () => { mxEvent: defaultEvent, highlights: [], highlightLink: "", - onHeightChanged: jest.fn(), onMessageAllowed: jest.fn(), permalinkCreator: {} as RoomPermalinkCreator, mediaEventHelper: {} as MediaEventHelper, diff --git a/test/unit-tests/components/views/messages/MPollBody-test.tsx b/test/unit-tests/components/views/messages/MPollBody-test.tsx index b4f1566a08..52b015bfd0 100644 --- a/test/unit-tests/components/views/messages/MPollBody-test.tsx +++ b/test/unit-tests/components/views/messages/MPollBody-test.tsx @@ -909,7 +909,6 @@ function getMPollBodyPropsFromEvent(mxEvent: MatrixEvent): IBodyProps { highlightLink: "unused", highlights: [], mediaEventHelper: {} as unknown as MediaEventHelper, - onHeightChanged: () => {}, onMessageAllowed: () => {}, permalinkCreator: {} as unknown as RoomPermalinkCreator, }; diff --git a/test/unit-tests/components/views/messages/MPollEndBody-test.tsx b/test/unit-tests/components/views/messages/MPollEndBody-test.tsx index 3b3b4eb5c9..7015e3d1d9 100644 --- a/test/unit-tests/components/views/messages/MPollEndBody-test.tsx +++ b/test/unit-tests/components/views/messages/MPollEndBody-test.tsx @@ -70,7 +70,6 @@ describe("", () => { mxEvent: pollEndEvent, highlightLink: "unused", mediaEventHelper: {} as unknown as MediaEventHelper, - onHeightChanged: () => {}, onMessageAllowed: () => {}, permalinkCreator: {} as unknown as RoomPermalinkCreator, ref: undefined as any, diff --git a/test/unit-tests/components/views/messages/MStickerBody-test.tsx b/test/unit-tests/components/views/messages/MStickerBody-test.tsx index cf94a6d0c8..d78f797dea 100644 --- a/test/unit-tests/components/views/messages/MStickerBody-test.tsx +++ b/test/unit-tests/components/views/messages/MStickerBody-test.tsx @@ -64,7 +64,6 @@ describe("", () => { }); const props = { - onHeightChanged: jest.fn(), onMessageAllowed: jest.fn(), permalinkCreator: new RoomPermalinkCreator(new Room(mediaEvent.getRoomId()!, cli, cli.getUserId()!)), }; diff --git a/test/unit-tests/components/views/messages/MVideoBody-test.tsx b/test/unit-tests/components/views/messages/MVideoBody-test.tsx index 996d875e09..dd916e8de0 100644 --- a/test/unit-tests/components/views/messages/MVideoBody-test.tsx +++ b/test/unit-tests/components/views/messages/MVideoBody-test.tsx @@ -184,7 +184,6 @@ function makeMVideoBody(w: number, h: number): RenderResult { mxEvent: event, highlights: [], highlightLink: "", - onHeightChanged: jest.fn(), onMessageAllowed: jest.fn(), permalinkCreator: {} as RoomPermalinkCreator, mediaEventHelper: { media: { isEncrypted: false } } as MediaEventHelper, diff --git a/test/unit-tests/components/views/messages/MessageEvent-test.tsx b/test/unit-tests/components/views/messages/MessageEvent-test.tsx index 8b643fd1b5..a2f788c4ab 100644 --- a/test/unit-tests/components/views/messages/MessageEvent-test.tsx +++ b/test/unit-tests/components/views/messages/MessageEvent-test.tsx @@ -59,13 +59,7 @@ describe("MessageEvent", () => { let event: MatrixEvent; const renderMessageEvent = (): RenderResult => { - return render( - , - ); + return render(); }; beforeEach(() => { diff --git a/test/unit-tests/components/views/messages/TextualBody-test.tsx b/test/unit-tests/components/views/messages/TextualBody-test.tsx index 7094ff7ff0..5534ae6911 100644 --- a/test/unit-tests/components/views/messages/TextualBody-test.tsx +++ b/test/unit-tests/components/views/messages/TextualBody-test.tsx @@ -81,7 +81,6 @@ describe("", () => { highlights: [] as string[], highlightLink: "", onMessageAllowed: jest.fn(), - onHeightChanged: jest.fn(), mediaEventHelper: {} as MediaEventHelper, }; @@ -426,10 +425,7 @@ describe("", () => { it("renders url previews correctly", () => { const ev = mkRoomTextMessage("Visit https://matrix.org/"); - const { container, rerender } = getComponent( - { mxEvent: ev, showUrlPreview: true, onHeightChanged: jest.fn() }, - matrixClient, - ); + const { container, rerender } = getComponent({ mxEvent: ev, showUrlPreview: true }, matrixClient); expect(container).toHaveTextContent(ev.getContent().body); expect(container.querySelector("a")).toHaveAttribute("href", "https://matrix.org/"); @@ -450,11 +446,7 @@ describe("", () => { jest.spyOn(ev, "replacingEventDate").mockReturnValue(new Date(1993, 7, 3)); ev.makeReplaced(ev2); - getComponent( - { mxEvent: ev, showUrlPreview: true, onHeightChanged: jest.fn(), replacingEventId: ev.getId() }, - matrixClient, - rerender, - ); + getComponent({ mxEvent: ev, showUrlPreview: true, replacingEventId: ev.getId() }, matrixClient, rerender); expect(container).toHaveTextContent(ev2.getContent()["m.new_content"].body + "(edited)"); @@ -468,13 +460,10 @@ describe("", () => { it("should listen to showUrlPreview change", () => { const ev = mkRoomTextMessage("Visit https://matrix.org/"); - const { container, rerender } = getComponent( - { mxEvent: ev, showUrlPreview: false, onHeightChanged: jest.fn() }, - matrixClient, - ); + const { container, rerender } = getComponent({ mxEvent: ev, showUrlPreview: false }, matrixClient); expect(container.querySelector(".mx_LinkPreviewGroup")).toBeNull(); - getComponent({ mxEvent: ev, showUrlPreview: true, onHeightChanged: jest.fn() }, matrixClient, rerender); + getComponent({ mxEvent: ev, showUrlPreview: true }, matrixClient, rerender); expect(container.querySelector(".mx_LinkPreviewGroup")).toBeTruthy(); }); });