Show a progress bar while migrating from legacy crypto (#12104)

* Show a progress bar during migration of crypto data

* playwright: add new `pageWithCredentials` fixture

* Add a playwright test for migration progress

* Add documentation for `idbSave`
This commit is contained in:
Richard van der Hoff 2024-01-17 07:14:49 +00:00 committed by GitHub
parent 2d3351bb33
commit 993a7029b8
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
12 changed files with 72194 additions and 5 deletions

View file

@ -14,14 +14,24 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
import { render, RenderResult } from "@testing-library/react";
import { act, render, RenderResult } from "@testing-library/react";
import React, { ComponentProps } from "react";
import EventEmitter from "events";
import { CryptoEvent } from "matrix-js-sdk/src/matrix";
import { sleep } from "matrix-js-sdk/src/utils";
import { LoginSplashView } from "../../../../src/components/structures/auth/LoginSplashView";
import type { MatrixClient } from "matrix-js-sdk/src/matrix";
describe("<LoginSplashView />", () => {
let matrixClient: MatrixClient;
beforeEach(() => {
matrixClient = new EventEmitter() as unknown as MatrixClient;
});
function getComponent(props: Partial<ComponentProps<typeof LoginSplashView>> = {}): RenderResult {
const defaultProps = {
matrixClient,
onLogoutClick: () => {},
syncError: null,
};
@ -46,4 +56,20 @@ describe("<LoginSplashView />", () => {
rendered.getByRole("button", { name: "Logout" }).click();
expect(onLogoutClick).toHaveBeenCalled();
});
it("Shows migration progress", async () => {
const rendered = getComponent();
act(() => {
matrixClient.emit(CryptoEvent.LegacyCryptoStoreMigrationProgress, 5, 10);
});
rendered.getByText("Hang tight.", { exact: false });
// Wait for the animation to update
await act(() => sleep(500));
const progress = rendered.getByRole("progressbar");
expect(progress.getAttribute("value")).toEqual("5");
expect(progress.getAttribute("max")).toEqual("10");
});
});