From 26216ec527e123e1b1342baef5beed06e9457e6d Mon Sep 17 00:00:00 2001 From: Kerry Date: Wed, 2 Mar 2022 12:55:03 +0100 Subject: [PATCH] remove code related to encrypted file download button in iframe (#7940) * remove code related to encrypted file download button in iframe Signed-off-by: Kerry Archibald * i18n Signed-off-by: Kerry Archibald * remove getIframeFn in mfilebody filedownloader Signed-off-by: Kerry Archibald * remove iframe ref too Signed-off-by: Kerry Archibald --- res/css/views/messages/_MFileBody.scss | 14 ----- src/components/views/messages/MFileBody.tsx | 65 +-------------------- src/i18n/strings/en_EN.json | 2 +- src/utils/FileDownloader.ts | 11 +--- 4 files changed, 5 insertions(+), 87 deletions(-) diff --git a/res/css/views/messages/_MFileBody.scss b/res/css/views/messages/_MFileBody.scss index ccb6b9a355..d8918fc1c0 100644 --- a/res/css/views/messages/_MFileBody.scss +++ b/res/css/views/messages/_MFileBody.scss @@ -45,20 +45,6 @@ limitations under the License. pointer-events: none; } -/* Remove the border and padding for iframes for download links. */ -.mx_MFileBody_download iframe { - margin: 0px; - padding: 0px; - border: none; - width: 100%; - /* Set the height of the iframe to be 1 line of text. - * Iframes don't automatically size themselves to fit their content. - * So either we have to fix the height of the iframe using CSS or - * use javascript's cross-origin postMessage API to communicate how - * big the content of the iframe is. */ - height: 1.5em; -} - .mx_MFileBody_info { cursor: pointer; diff --git a/src/components/views/messages/MFileBody.tsx b/src/components/views/messages/MFileBody.tsx index ce99ddc688..b618e7f965 100644 --- a/src/components/views/messages/MFileBody.tsx +++ b/src/components/views/messages/MFileBody.tsx @@ -31,19 +31,6 @@ import { FileDownloader } from "../../../utils/FileDownloader"; import TextWithTooltip from "../elements/TextWithTooltip"; import RoomContext, { TimelineRenderingType } from "../../../contexts/RoomContext"; -export let DOWNLOAD_ICON_URL; // cached copy of the download.svg asset for the sandboxed iframe later on - -async function cacheDownloadIcon() { - if (DOWNLOAD_ICON_URL) return; // cached already - // eslint-disable-next-line @typescript-eslint/no-var-requires - const svg = await fetch(require("../../../../res/img/download.svg")).then(r => r.text()); - DOWNLOAD_ICON_URL = "data:image/svg+xml;base64," + window.btoa(svg); -} - -// Cache the asset immediately -// noinspection JSIgnoredPromiseFromCall -cacheDownloadIcon(); - // User supplied content can contain scripts, we have to be careful that // we don't accidentally run those script within the same origin as the // client. Otherwise those scripts written by remote users can read @@ -74,29 +61,6 @@ cacheDownloadIcon(); // the downside of using a sandboxed iframe is that the browers are overly // restrictive in what you are allowed to do with the generated URL. -/** - * Get the current CSS style for a DOMElement. - * @param {HTMLElement} element The element to get the current style of. - * @return {string} The CSS style encoded as a string. - */ -export function computedStyle(element: HTMLElement) { - if (!element) { - return ""; - } - const style = window.getComputedStyle(element, null); - let cssText = style.cssText; - // noinspection EqualityComparisonWithCoercionJS - if (cssText == "") { - // Firefox doesn't implement ".cssText" for computed styles. - // https://bugzilla.mozilla.org/show_bug.cgi?id=137687 - for (let i = 0; i < style.length; i++) { - cssText += style[i] + ":"; - cssText += style.getPropertyValue(style[i]) + ";"; - } - } - return cssText; -} - interface IProps extends IBodyProps { /* whether or not to show the default placeholder for the file. Defaults to true. */ showGenericPlaceholder: boolean; @@ -115,10 +79,9 @@ export default class MFileBody extends React.Component { showGenericPlaceholder: true, }; - private iframe: React.RefObject = createRef(); private dummyLink: React.RefObject = createRef(); private userDidClick = false; - private fileDownloader: FileDownloader = new FileDownloader(() => this.iframe.current); + private fileDownloader: FileDownloader = new FileDownloader(); public constructor(props: IProps) { super(props); @@ -143,17 +106,11 @@ export default class MFileBody extends React.Component { return presentableTextForFile(this.content); } - private downloadFile(fileName: string, text: string) { + private downloadFile(fileName: string) { this.fileDownloader.download({ blob: this.state.decryptedBlob, name: fileName, autoDownload: this.userDidClick, - opts: { - imgSrc: DOWNLOAD_ICON_URL, - imgStyle: null, - style: computedStyle(this.dummyLink.current), - textContent: _t("Download %(text)s", { text }), - }, }); } @@ -185,7 +142,7 @@ export default class MFileBody extends React.Component { const mediaHelper = this.props.mediaEventHelper; if (mediaHelper?.media.isEncrypted) { await this.decryptFile(); - this.downloadFile(this.fileName, this.linkText); + this.downloadFile(this.fileName); } else { // As a button we're missing the `download` attribute for styling reasons, so // download with the file downloader. @@ -256,8 +213,6 @@ export default class MFileBody extends React.Component { ); } - const url = "usercontent/"; // XXX: this path should probably be passed from the skin - // If the attachment is encrypted then put the link inside an iframe. return ( @@ -274,20 +229,6 @@ export default class MFileBody extends React.Component { { /* eslint-disable-next-line */ } - { /* - TODO: Move iframe (and dummy link) into FileDownloader. - We currently have it set up this way because of styles applied to the iframe - itself which cannot be easily handled/overridden by the FileDownloader. In - future, the download link may disappear entirely at which point it could also - be suitable to just remove this bit of code. - */ } -