imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Properly translate errors in AddThreepid.ts (#10432)

Browse source 
* Properly translate errors in AddThreepid.ts

Part of https://github.com/vector-im/element-web/issues/9597

* Use translated message

* Avoid returning undefined ever

* More usage

* Introduce UserFriendlyError

* Use UserFriendlyError

* Add more usage instead of normal error

* Use types and translatedMessage

* Fix lints

* Update i18n although it's wrong

* Use unknown for easier creation from try/catch

* Use types

* Use error types

* Use types

* Update i18n strings

* Remove generic re-label of HTTPError

See https://github.com/matrix-org/matrix-react-sdk/pull/10432#discussion_r1156468143

The HTTPError already has a good label and it isn't even translated if we re-label it here in this way generically

Probably best to just remove in favor of thinking about a translations in general from the `matrix-js-sdk`, see https://github.com/matrix-org/matrix-js-sdk/issues/1309

* Make error message extraction generic

* Update i18n strings

* Add tests for email addresses

* More consistent error logging to actually see error in logs

* Consistent error handling

* Any is okay because we have a fallback

* Check error type

* Use dedicated mockResolvedValue function

See https://github.com/matrix-org/matrix-react-sdk/pull/10432#discussion_r1163344034
This commit is contained in:
Eric Eastwood 2023-04-14 09:40:19 -05:00 • committed by GitHub
parent 8f8b74b32c
commit c1e7905ddc
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
9 changed files with 300 additions and 132 deletions
Download patch file Download diff file Expand all files Collapse all files

133
test/components/views/settings/discovery/EmailAddresses-test.tsx
View file

@ -15,26 +15,135 @@ limitations under the License.
*/
import React from "react";
import { render, screen } from "@testing-library/react";
import { fireEvent, render, screen } from "@testing-library/react";
import { IThreepid, ThreepidMedium } from "matrix-js-sdk/src/@types/threepids";
import { IRequestTokenResponse } from "matrix-js-sdk/src/client";
import { MatrixError } from "matrix-js-sdk/src/http-api";
import { UserFriendlyError } from "../../../../../src/languageHandler";
import { EmailAddress } from "../../../../../src/components/views/settings/discovery/EmailAddresses";
import { clearAllModals, getMockClientWithEventEmitter } from "../../../../test-utils";
const mockGetAccessToken = jest.fn().mockResolvedValue("getAccessToken");
jest.mock("../../../../../src/IdentityAuthClient", () =>
jest.fn().mockImplementation(() => ({
getAccessToken: mockGetAccessToken,
})),
);
const emailThreepidFixture: IThreepid = {
medium: ThreepidMedium.Email,
address: "foo@bar.com",
validated_at: 12345,
added_at: 12342,
bound: false,
};
describe("<EmailAddress/>", () => {
it("should track props.email.bound changes", async () => {
const email: IThreepid = {
medium: ThreepidMedium.Email,
address: "foo@bar.com",
validated_at: 12345,
added_at: 12342,
bound: false,
};
const mockClient = getMockClientWithEventEmitter({
getIdentityServerUrl: jest.fn().mockReturnValue("https://fake-identity-server"),
generateClientSecret: jest.fn(),
doesServerSupportSeparateAddAndBind: jest.fn(),
requestEmailToken: jest.fn(),
bindThreePid: jest.fn(),
});
const { rerender } = render(<EmailAddress email={email} />);
beforeEach(() => {
jest.useFakeTimers();
});
afterEach(async () => {
jest.useRealTimers();
await clearAllModals();
});
it("should track props.email.bound changes", async () => {
const { rerender } = render(<EmailAddress email={emailThreepidFixture} />);
await screen.findByText("Share");
email.bound = true;
rerender(<EmailAddress email={{ ...email }} />);
rerender(
<EmailAddress
email={{
...emailThreepidFixture,
bound: true,
}}
/>,
);
await screen.findByText("Revoke");
});
describe("Email verification share phase", () => {
it("shows translated error message", async () => {
render(<EmailAddress email={emailThreepidFixture} />);
mockClient.doesServerSupportSeparateAddAndBind.mockResolvedValue(true);
mockClient.requestEmailToken.mockRejectedValue(
new MatrixError(
{ errcode: "M_THREEPID_IN_USE", error: "Some fake MatrixError occured" },
400,
"https://fake-url/",
),
);
fireEvent.click(screen.getByText("Share"));
// Expect error dialog/modal to be shown. We have to wait for the UI to transition.
expect(await screen.findByText("This email address is already in use")).toBeInTheDocument();
});
});
describe("Email verification complete phase", () => {
beforeEach(async () => {
// Start these tests out at the "Complete" phase
render(<EmailAddress email={emailThreepidFixture} />);
mockClient.requestEmailToken.mockResolvedValue({ sid: "123-fake-sid" } satisfies IRequestTokenResponse);
mockClient.doesServerSupportSeparateAddAndBind.mockResolvedValue(true);
fireEvent.click(screen.getByText("Share"));
// Then wait for the completion screen to come up
await screen.findByText("Complete");
});
it("Shows error dialog when share completion fails (email not verified yet)", async () => {
mockClient.bindThreePid.mockRejectedValue(
new MatrixError(
{ errcode: "M_THREEPID_AUTH_FAILED", error: "Some fake MatrixError occured" },
403,
"https://fake-url/",
),
);
fireEvent.click(screen.getByText("Complete"));
// Expect error dialog/modal to be shown. We have to wait for the UI to transition.
// Check the title
expect(await screen.findByText("Your email address hasn't been verified yet")).toBeInTheDocument();
// Check the description
expect(
await screen.findByText(
"Click the link in the email you received to verify and then click continue again.",
),
).toBeInTheDocument();
});
it("Shows error dialog when share completion fails (UserFriendlyError)", async () => {
const fakeErrorText = "Fake UserFriendlyError error in test";
mockClient.bindThreePid.mockRejectedValue(new UserFriendlyError(fakeErrorText));
fireEvent.click(screen.getByText("Complete"));
// Expect error dialog/modal to be shown. We have to wait for the UI to transition.
// Check the title
expect(await screen.findByText("Unable to verify email address.")).toBeInTheDocument();
// Check the description
expect(await screen.findByText(fakeErrorText)).toBeInTheDocument();
});
it("Shows error dialog when share completion fails (generic error)", async () => {
const fakeErrorText = "Fake plain error in test";
mockClient.bindThreePid.mockRejectedValue(new Error(fakeErrorText));
fireEvent.click(screen.getByText("Complete"));
// Expect error dialog/modal to be shown. We have to wait for the UI to transition.
// Check the title
expect(await screen.findByText("Unable to verify email address.")).toBeInTheDocument();
// Check the description
expect(await screen.findByText(fakeErrorText)).toBeInTheDocument();
});
});
});