fix: value argument is not being properly passed to the contract call

matter-labs · Oct 10, 2024 · 8732d1a · 8732d1a
1 parent e350e0c
commit 8732d1a
Show file tree

Hide file tree

Showing 3 changed files with 23 additions and 17 deletions.
diff --git a/packages/app/src/components/contract/interaction/FunctionForm.vue b/packages/app/src/components/contract/interaction/FunctionForm.vue
@@ -36,6 +36,8 @@ import { ethers } from "ethers";
 import Input from "@/components/common/Input.vue";
 import FunctionArrayParameter from "@/components/contract/interaction/FunctionArrayParameter.vue";
 
+import { PAYABLE_AMOUNT_PARAM_NAME } from "@/composables/useContractInteraction";
+
 import type { AbiFragment } from "@/composables/useAddress";
 
 import { getRawFunctionType, getRequiredArrayLength, isArrayFunctionType } from "@/utils/helpers";
@@ -80,7 +82,7 @@ const inputs = computed(() => {
   );
   if (props.abiFragment.stateMutability === "payable") {
     inputsArray.unshift({
-      key: "value",
+      key: PAYABLE_AMOUNT_PARAM_NAME,
       type: "ether",
       label: "payableAmount (ether)",
       placeholder: "payableAmount (ether)",

diff --git a/packages/app/src/composables/useContractInteraction.ts b/packages/app/src/composables/useContractInteraction.ts
@@ -9,6 +9,8 @@ import useContext from "@/composables/useContext";
 import type { AbiFragment } from "./useAddress";
 import type { WalletError } from "@matterlabs/composables";
 
+export const PAYABLE_AMOUNT_PARAM_NAME = "payable_function_payable_amount";
+
 export default (context = useContext()) => {
   const walletContext = {
     isReady: context.isReady,
@@ -43,16 +45,18 @@ export default (context = useContext()) => {
       const signer = await getL2Signer();
       const contract = new ethers.Contract(address, [abiFragment], signer!);
       const method = contract[abiFragment.name];
-      const methodArguments = Object.entries(params).map(([, inputValue]) => {
-        if (inputValue === "true") {
-          inputValue = true;
-        } else if (inputValue === "false") {
-          inputValue = false;
-        }
-        return inputValue;
-      });
+      const methodArguments = Object.entries(params)
+        .filter(([key]) => key !== PAYABLE_AMOUNT_PARAM_NAME)
+        .map(([, inputValue]) => {
+          if (inputValue === "true") {
+            inputValue = true;
+          } else if (inputValue === "false") {
+            inputValue = false;
+          }
+          return inputValue;
+        });
       const methodOptions = {
-        value: ethers.utils.parseEther((params.value as string) ?? "0"),
+        value: ethers.utils.parseEther((params[PAYABLE_AMOUNT_PARAM_NAME] as string) ?? "0"),
       };
       const res = await method(
         ...[

diff --git a/packages/app/tests/composables/useContractInteraction.spec.ts b/packages/app/tests/composables/useContractInteraction.spec.ts
@@ -4,7 +4,7 @@ import { ethers } from "ethers";
 
 import { useWalletMock } from "../mocks";
 
-import useContractInteraction from "@/composables/useContractInteraction";
+import useContractInteraction, { PAYABLE_AMOUNT_PARAM_NAME } from "@/composables/useContractInteraction";
 
 import type { AbiFragment } from "@/composables/useAddress";
 
@@ -116,13 +116,13 @@ describe("useContractInteraction:", () => {
           stateMutability: "payable",
         },
         {
-          value: "0.1",
+          [PAYABLE_AMOUNT_PARAM_NAME]: "0.1",
           address: ["0x0cc725e6ba24e7db79f62f22a7994a8ee33adc1b"],
         }
       );
       expect(mock.mock.lastCall).toEqual([
         ["0x0cc725e6ba24e7db79f62f22a7994a8ee33adc1b"],
-        { gasLimit: "10000000", value: ethers.utils.parseEther("0.1") },
+        { value: ethers.utils.parseEther("0.1") },
       ]);
       mock.mockRestore();
     });
@@ -139,10 +139,10 @@ describe("useContractInteraction:", () => {
           stateMutability: "payable",
         },
         {
-          value: "0.1",
+          [PAYABLE_AMOUNT_PARAM_NAME]: "0.1",
         }
       );
-      expect(mock.mock.lastCall).toEqual([{ gasLimit: "10000000", value: ethers.utils.parseEther("0.1") }]);
+      expect(mock.mock.lastCall).toEqual([{ value: ethers.utils.parseEther("0.1") }]);
       mock.mockRestore();
     });
     it("change input to boolean type", async () => {
@@ -158,11 +158,11 @@ describe("useContractInteraction:", () => {
           stateMutability: "payable",
         },
         {
-          value: "0.1",
+          [PAYABLE_AMOUNT_PARAM_NAME]: "0.1",
           bool: "false",
         }
       );
-      expect(mock.mock.lastCall).toEqual([false, { gasLimit: "10000000", value: ethers.utils.parseEther("0.1") }]);
+      expect(mock.mock.lastCall).toEqual([false, { value: ethers.utils.parseEther("0.1") }]);
       mock.mockRestore();
     });
     it("sets isRequestPending to true when request is pending", async () => {