From ce2cf27a6e148c510e9ba816f5ecf18971bd8055 Mon Sep 17 00:00:00 2001
From: Michael Telatynski <7t3chguy@gmail.com>
Date: Wed, 10 May 2023 17:16:04 +0100
Subject: [PATCH 1/2] Add test for falling back from thumbnail to original
---
.../views/messages/MImageBody-test.tsx | 37 ++++++++++++++++++-
1 file changed, 36 insertions(+), 1 deletion(-)
diff --git a/test/components/views/messages/MImageBody-test.tsx b/test/components/views/messages/MImageBody-test.tsx
index ca400f13ee1..71b3a79dccd 100644
--- a/test/components/views/messages/MImageBody-test.tsx
+++ b/test/components/views/messages/MImageBody-test.tsx
@@ -16,7 +16,7 @@ limitations under the License.
import React from "react";
import { fireEvent, render, screen } from "@testing-library/react";
-import { EventType, MatrixEvent, Room } from "matrix-js-sdk/src/matrix";
+import { EventType, getHttpUriForMxc, MatrixEvent, Room } from "matrix-js-sdk/src/matrix";
import fetchMock from "fetch-mock-jest";
import encrypt from "matrix-encrypt-attachment";
import { mocked } from "jest-mock";
@@ -171,4 +171,39 @@ describe("", () => {
expect(screen.getByRole("progressbar")).toBeInTheDocument();
});
});
+
+ it("should fall back to /download/ if /thumbnail/ fails", async () => {
+ const thumbUrl = "https://server/_matrix/media/r0/thumbnail/server/image?width=800&height=600&method=scale";
+ const downloadUrl = "https://server/_matrix/media/r0/download/server/image";
+ // eslint-disable-next-line no-restricted-properties
+ cli.mxcUrlToHttp.mockImplementation(
+ (mxcUrl: string, width?: number, height?: number, resizeMethod?: string, allowDirectLinks?: boolean) => {
+ return getHttpUriForMxc("https://server", mxcUrl, width, height, resizeMethod, allowDirectLinks);
+ },
+ );
+
+ const event = new MatrixEvent({
+ room_id: "!room:server",
+ sender: userId,
+ type: EventType.RoomMessage,
+ content: {
+ body: "alt for a test image",
+ info: {
+ w: 40,
+ h: 50,
+ },
+ url: "mxc://server/image",
+ },
+ });
+
+ const { container } = render(
+ ,
+ );
+
+ const img = container.querySelector(".mx_MImageBody_thumbnail")!;
+ expect(img).toHaveProperty("src", thumbUrl);
+
+ fireEvent.error(img);
+ expect(img).toHaveProperty("src", downloadUrl);
+ });
});
From c31fe2bf3ab91e2d9d29b425b139a2641071e364 Mon Sep 17 00:00:00 2001
From: Michael Telatynski <7t3chguy@gmail.com>
Date: Wed, 10 May 2023 17:16:34 +0100
Subject: [PATCH 2/2] Fall back from server generated thumbnail to original
image
---
src/components/views/messages/MImageBody.tsx | 8 ++++++++
1 file changed, 8 insertions(+)
diff --git a/src/components/views/messages/MImageBody.tsx b/src/components/views/messages/MImageBody.tsx
index e7c0964d160..6a705cc79aa 100644
--- a/src/components/views/messages/MImageBody.tsx
+++ b/src/components/views/messages/MImageBody.tsx
@@ -165,6 +165,14 @@ export default class MImageBody extends React.Component {
};
private onImageError = (): void => {
+ // If the thumbnail failed to load then try again using the contentUrl
+ if (this.state.thumbUrl) {
+ this.setState({
+ thumbUrl: null,
+ });
+ return;
+ }
+
this.clearBlurhashTimeout();
this.setState({
imgError: true,