diff --git a/package.json b/package.json index 119d1ca..f14ca55 100644 --- a/package.json +++ b/package.json @@ -106,7 +106,8 @@ ], "moduleNameMapper": { "\\.(css|less|svg)+$": "identity-obj-proxy", - "./IndexedDBWorker\\?worker": "/test/mocks/workerMock.ts" + "^\\./IndexedDBWorker\\?worker$": "/test/mocks/workerMock.ts", + "^\\./olm$": "/test/mocks/olmMock.ts" } } } diff --git a/src/App.tsx b/src/App.tsx index a81da41..0299734 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -14,9 +14,7 @@ See the License for the specific language governing permissions and limitations under the License. */ -import Olm from "@matrix-org/olm"; -import olmWasmPath from "@matrix-org/olm/olm.wasm?url"; -import React, { Suspense, useEffect, useState } from "react"; +import React, { Suspense } from "react"; import { BrowserRouter as Router, Switch, Route } from "react-router-dom"; import * as Sentry from "@sentry/react"; import { OverlayProvider } from "@react-aria/overlays"; @@ -30,7 +28,7 @@ import { ClientProvider } from "./ClientContext"; import { usePageFocusStyle } from "./usePageFocusStyle"; import { SequenceDiagramViewerPage } from "./SequenceDiagramViewerPage"; import { InspectorContextProvider } from "./room/GroupCallInspector"; -import { CrashView, LoadingView } from "./FullScreenView"; +import { CrashView } from "./FullScreenView"; const SentryRoute = Sentry.withSentryRouting(Route); @@ -39,58 +37,42 @@ interface AppProps { } export default function App({ history }: AppProps) { - const [olmLoaded, setOlmLoaded] = useState(false); - usePageFocusStyle(); - useEffect(() => { - if (!olmLoaded) { - // TODO: https://gitlab.matrix.org/matrix-org/olm/-/issues/10 - window.OLM_OPTIONS = {}; - Olm.init({ locateFile: () => olmWasmPath }).then(() => - setOlmLoaded(true) - ); - } - }, [olmLoaded, setOlmLoaded]); - const errorPage = ; return ( - {olmLoaded ? ( - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - ) : ( - - )} + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + ); } diff --git a/src/matrix-utils.ts b/src/matrix-utils.ts index fb4b41a..796b822 100644 --- a/src/matrix-utils.ts +++ b/src/matrix-utils.ts @@ -18,6 +18,7 @@ import type { MatrixClient } from "matrix-js-sdk/src/client"; import type { Room } from "matrix-js-sdk/src/models/room"; import IndexedDBWorker from "./IndexedDBWorker?worker"; import { getUrlParams } from "./UrlParams"; +import { loadOlm } from "./olm"; export const defaultHomeserver = (import.meta.env.VITE_DEFAULT_HOMESERVER as string) ?? @@ -72,8 +73,9 @@ export async function initClient( clientOptions: ICreateClientOpts, restore: boolean ): Promise { - let indexedDB: IDBFactory; + await loadOlm(); + let indexedDB: IDBFactory; try { indexedDB = window.indexedDB; } catch (e) {} diff --git a/src/olm.ts b/src/olm.ts new file mode 100644 index 0000000..0ee0b24 --- /dev/null +++ b/src/olm.ts @@ -0,0 +1,29 @@ +/* +Copyright 2022 New Vector Ltd + +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 Olm from "@matrix-org/olm"; +import olmWasmPath from "@matrix-org/olm/olm.wasm?url"; + +// https://gitlab.matrix.org/matrix-org/olm/-/issues/10 +window.OLM_OPTIONS = {}; + +let olmLoaded: Promise | null = null; + +/** + * Loads Olm, if not already loaded. + */ +export const loadOlm = (): Promise => + (olmLoaded ??= Olm.init({ locateFile: () => olmWasmPath })); diff --git a/test/mocks/olmMock.ts b/test/mocks/olmMock.ts new file mode 100644 index 0000000..8bc7429 --- /dev/null +++ b/test/mocks/olmMock.ts @@ -0,0 +1 @@ +module.exports = { loadOlm: jest.fn(async () => {}) }