diff --git a/frontend/src/lib/components/accounts/ImportTokenForm.svelte b/frontend/src/lib/components/accounts/ImportTokenForm.svelte index 4ccb5dafc0b..0cda94b5d8b 100644 --- a/frontend/src/lib/components/accounts/ImportTokenForm.svelte +++ b/frontend/src/lib/components/accounts/ImportTokenForm.svelte @@ -7,6 +7,7 @@ import { createEventDispatcher } from "svelte"; import { isNullish } from "@dfinity/utils"; import CalloutWarning from "$lib/components/common/CalloutWarning.svelte"; + import ImportTokenCanisterId from "$lib/components/accounts/ImportTokenCanisterId.svelte"; export let ledgerCanisterId: Principal | undefined = undefined; export let indexCanisterId: Principal | undefined = undefined; @@ -24,17 +25,25 @@

{$i18n.import_token.description}

dispatch("nnsSubmit")}> - - {$i18n.import_token.ledger_label} + {:else} + - + {$i18n.import_token.ledger_label} + + {/if} (Optional)", - "placeholder": "00000-00000-00000-00000-000", + "placeholder": "_____-_____-_____-_____-cai", "index_canister_description": "To see this token's transaction history in the NNS dapp, you need to provide its index canister. Note: not all tokens have index canisters.", "review_token_info": "Review token info", "warning": "Warning: Be careful what token you import! Anyone can create a token including one with the same name as existing tokens, such as ckBTC.", diff --git a/frontend/src/tests/lib/components/accounts/ImportTokenForm.spec.ts b/frontend/src/tests/lib/components/accounts/ImportTokenForm.spec.ts index f7a990e4b7e..e41d0c33934 100644 --- a/frontend/src/tests/lib/components/accounts/ImportTokenForm.spec.ts +++ b/frontend/src/tests/lib/components/accounts/ImportTokenForm.spec.ts @@ -163,13 +163,18 @@ describe("ImportTokenForm", () => { }); it("should display addIndexCanister mode ", async () => { + const ledgerCanisterId = principal(0); const { po } = renderComponent({ - ledgerCanisterId: principal(0), + ledgerCanisterId, indexCanisterId: undefined, addIndexCanisterMode: true, }); - expect(await po.getLedgerCanisterInputPo().isDisabled()).toEqual(true); + expect(await po.getLedgerCanisterInputPo().isPresent()).toEqual(false); + expect(await po.getLedgerCanisterIdPo().isPresent()).toEqual(true); + expect(await po.getLedgerCanisterIdPo().getCanisterIdText()).toEqual( + ledgerCanisterId.toText() + ); expect(await po.getIndexCanisterInputPo().isRequired()).toEqual(true); expect((await po.getIndexCanisterInputPo().getText()).trim()).toEqual( "Index Canister ID" diff --git a/frontend/src/tests/lib/pages/IcrcWallet.spec.ts b/frontend/src/tests/lib/pages/IcrcWallet.spec.ts index 34c6936e764..43f8df70785 100644 --- a/frontend/src/tests/lib/pages/IcrcWallet.spec.ts +++ b/frontend/src/tests/lib/pages/IcrcWallet.spec.ts @@ -729,6 +729,12 @@ describe("IcrcWallet", () => { expect(spyOnSetImportedTokens).toBeCalledTimes(0); expect(await addIndexCanisterModalPo.isPresent()).toBe(true); expect(get(busyStore)).toEqual([]); + expect( + await addIndexCanisterModalPo + .getImportTokenFormPo() + .getLedgerCanisterIdPo() + .getCanisterIdText() + ).toEqual(ledgerCanisterId.toText()); await addIndexCanisterModalPo.typeIndexCanisterId( indexCanisterId.toText() diff --git a/frontend/src/tests/page-objects/ImportTokenForm.page-object.ts b/frontend/src/tests/page-objects/ImportTokenForm.page-object.ts index c73af5c63db..c7529c31027 100644 --- a/frontend/src/tests/page-objects/ImportTokenForm.page-object.ts +++ b/frontend/src/tests/page-objects/ImportTokenForm.page-object.ts @@ -1,5 +1,6 @@ import { ButtonPo } from "$tests/page-objects/Button.page-object"; import { CalloutWarningPo } from "$tests/page-objects/CalloutWarning.page-object"; +import { ImportTokenCanisterIdPo } from "$tests/page-objects/ImportTokenCanisterId.page-object"; import { InputWithErrorPo } from "$tests/page-objects/InputWithError.page-object"; import { BasePageObject } from "$tests/page-objects/base.page-object"; import type { PageObjectElement } from "$tests/types/page-object.types"; @@ -18,6 +19,13 @@ export class ImportTokenFormPo extends BasePageObject { }); } + getLedgerCanisterIdPo(): ImportTokenCanisterIdPo { + return ImportTokenCanisterIdPo.under({ + element: this.root, + testId: "ledger-canister-id-view", + }); + } + getIndexCanisterInputPo(): InputWithErrorPo { return InputWithErrorPo.under({ element: this.root,