From f93bd51499ed34844b666bf6d333227adf4368bf Mon Sep 17 00:00:00 2001 From: Sebastian Date: Thu, 15 Dec 2022 17:11:24 -0300 Subject: wxApi from context and using the new testing sdk --- .../src/wallet/DestinationSelection/index.ts | 3 +- .../src/wallet/DestinationSelection/state.ts | 4 +- .../src/wallet/DestinationSelection/test.ts | 113 +++++++++------------ 3 files changed, 51 insertions(+), 69 deletions(-) (limited to 'packages/taler-wallet-webextension/src/wallet/DestinationSelection') diff --git a/packages/taler-wallet-webextension/src/wallet/DestinationSelection/index.ts b/packages/taler-wallet-webextension/src/wallet/DestinationSelection/index.ts index 2f066d744..f1e766a18 100644 --- a/packages/taler-wallet-webextension/src/wallet/DestinationSelection/index.ts +++ b/packages/taler-wallet-webextension/src/wallet/DestinationSelection/index.ts @@ -18,7 +18,6 @@ import { Loading } from "../../components/Loading.js"; import { HookError } from "../../hooks/useAsyncAsHook.js"; import { AmountFieldHandler, ButtonHandler } from "../../mui/handlers.js"; import { compose, StateViewMap } from "../../utils/index.js"; -import { wxApi } from "../../wxApi.js"; import { useComponentState } from "./state.js"; import { LoadingUriView, ReadyView, SelectCurrencyView } from "./views.js"; @@ -88,6 +87,6 @@ const viewMapping: StateViewMap = { export const DestinationSelectionPage = compose( "DestinationSelectionPage", - (p: Props) => useComponentState(p, wxApi), + (p: Props) => useComponentState(p), viewMapping, ); diff --git a/packages/taler-wallet-webextension/src/wallet/DestinationSelection/state.ts b/packages/taler-wallet-webextension/src/wallet/DestinationSelection/state.ts index a67f926bc..0621d3304 100644 --- a/packages/taler-wallet-webextension/src/wallet/DestinationSelection/state.ts +++ b/packages/taler-wallet-webextension/src/wallet/DestinationSelection/state.ts @@ -17,15 +17,15 @@ import { Amounts } from "@gnu-taler/taler-util"; import { WalletApiOperation } from "@gnu-taler/taler-wallet-core"; import { useState } from "preact/hooks"; +import { useBackendContext } from "../../context/backend.js"; import { useAsyncAsHook } from "../../hooks/useAsyncAsHook.js"; import { assertUnreachable, RecursiveState } from "../../utils/index.js"; -import { wxApi } from "../../wxApi.js"; import { Contact, Props, State } from "./index.js"; export function useComponentState( props: Props, - api: typeof wxApi, ): RecursiveState { + const api = useBackendContext() const parsedInitialAmount = !props.amount ? undefined : Amounts.parse(props.amount); diff --git a/packages/taler-wallet-webextension/src/wallet/DestinationSelection/test.ts b/packages/taler-wallet-webextension/src/wallet/DestinationSelection/test.ts index c2aa04849..afba5db35 100644 --- a/packages/taler-wallet-webextension/src/wallet/DestinationSelection/test.ts +++ b/packages/taler-wallet-webextension/src/wallet/DestinationSelection/test.ts @@ -23,11 +23,12 @@ import { Amounts, ExchangeEntryStatus, ExchangeListItem, - ExchangeTosStatus, + ExchangeTosStatus } from "@gnu-taler/taler-util"; import { WalletApiOperation } from "@gnu-taler/taler-wallet-core"; import { expect } from "chai"; -import { createWalletApiMock, mountHook } from "../../test-utils.js"; +import { tests } from "../../../../web-util/src/index.browser.js"; +import { createWalletApiMock, nullFunction } from "../../test-utils.js"; import { useComponentState } from "./state.js"; const exchangeArs: ExchangeListItem = { @@ -42,7 +43,7 @@ const exchangeArs: ExchangeListItem = { describe("Destination selection states", () => { it("should select currency if no amount specified", async () => { - const { handler, mock } = createWalletApiMock(); + const { handler, TestingContext } = createWalletApiMock(); handler.addWalletCallResponse( WalletApiOperation.ListExchanges, @@ -54,83 +55,65 @@ describe("Destination selection states", () => { const props = { type: "get" as const, - goToWalletManualWithdraw: () => { - return null; - }, - goToWalletWalletInvoice: () => { - null; - }, + goToWalletManualWithdraw: nullFunction, + goToWalletWalletInvoice: nullFunction, }; - const { pullLastResultOrThrow, waitForStateUpdate, assertNoPendingUpdate } = - mountHook(() => useComponentState(props, mock)); - - { - const state = pullLastResultOrThrow(); - - if (state.status !== "loading") expect.fail(); - if (state.error) expect.fail(); - } - - expect(await waitForStateUpdate()).true; - - { - const state = pullLastResultOrThrow(); - - if (state.status !== "select-currency") expect.fail(); - if (state.error) expect.fail(); - expect(state.currencies).deep.eq({ - ARS: "ARS", - "": "Select a currency", - }); - - state.onCurrencySelected(exchangeArs.currency!); - } - - expect(await waitForStateUpdate()).true; - - { - const state = pullLastResultOrThrow(); - if (state.status !== "ready") expect.fail(); - if (state.error) expect.fail(); - expect(state.goToBank.onClick).eq(undefined); - expect(state.goToWallet.onClick).eq(undefined); + const hookBehavior = await tests.hookBehaveLikeThis(useComponentState, props, [ + ({ status }) => { + expect(status).equal("loading"); + }, + (state) => { + if (state.status !== "select-currency") expect.fail(); + if (state.error) expect.fail(); + expect(state.currencies).deep.eq({ + ARS: "ARS", + "": "Select a currency", + }); + + state.onCurrencySelected(exchangeArs.currency!); + }, + (state) => { + if (state.status !== "ready") expect.fail(); + if (state.error) expect.fail(); + expect(state.goToBank.onClick).eq(undefined); + expect(state.goToWallet.onClick).eq(undefined); - expect(state.amountHandler.value).deep.eq(Amounts.parseOrThrow("ARS:0")); - } + expect(state.amountHandler.value).deep.eq(Amounts.parseOrThrow("ARS:0")); + }, + ], TestingContext) - await assertNoPendingUpdate(); + expect(hookBehavior).deep.equal({ result: "ok" }) expect(handler.getCallingQueueState()).eq("empty"); + }); it("should be possible to start with an amount specified in request params", async () => { - const { handler, mock } = createWalletApiMock(); + const { handler, TestingContext } = createWalletApiMock(); const props = { type: "get" as const, - goToWalletManualWithdraw: () => { - return null; - }, - goToWalletWalletInvoice: () => { - null; - }, + goToWalletManualWithdraw: nullFunction, + goToWalletWalletInvoice: nullFunction, amount: "ARS:2", }; - const { pullLastResultOrThrow, waitForStateUpdate, assertNoPendingUpdate } = - mountHook(() => useComponentState(props, mock)); - - { - const state = pullLastResultOrThrow(); - - if (state.status !== "ready") expect.fail(); - if (state.error) expect.fail(); - expect(state.goToBank.onClick).not.eq(undefined); - expect(state.goToWallet.onClick).not.eq(undefined); - expect(state.amountHandler.value).deep.eq(Amounts.parseOrThrow("ARS:2")); - } + const hookBehavior = await tests.hookBehaveLikeThis(useComponentState, props, [ + // ({ status }) => { + // expect(status).equal("loading"); + // }, + (state) => { + if (state.status !== "ready") expect.fail(); + if (state.error) expect.fail(); + expect(state.goToBank.onClick).not.eq(undefined); + expect(state.goToWallet.onClick).not.eq(undefined); + + expect(state.amountHandler.value).deep.eq(Amounts.parseOrThrow("ARS:2")); + }, + ], TestingContext) - await assertNoPendingUpdate(); + expect(hookBehavior).deep.equal({ result: "ok" }) expect(handler.getCallingQueueState()).eq("empty"); + }); }); -- cgit v1.2.3