[taler-merchant-backoffice] branch master updated: bank: testing registration.

[gnunet]

This is an automated email from the git hooks/post-receive script.

ms pushed a commit to branch master
in repository merchant-backoffice.

The following commit(s) were added to refs/heads/master by this push:
     new cf762a0  bank: testing registration.
cf762a0 is described below

commit cf762a00d208b57155dfc4ca4136c0d2c8572bdb
Author: ms <ms@taler.net>
AuthorDate: Wed Dec 15 12:10:06 2021 +0100

    bank: testing registration.
---
 packages/bank/package.json                |  1 +
 packages/bank/src/pages/home/index.tsx    | 64 +++++++++++++++++--------------
 packages/bank/tests/__tests__/homepage.js | 20 +++++++---
 3 files changed, 51 insertions(+), 34 deletions(-)

diff --git a/packages/bank/package.json b/packages/bank/package.json
index c050ab6..2b3b446 100644
--- a/packages/bank/package.json
+++ b/packages/bank/package.json
@@ -50,6 +50,7 @@
     "@types/jest": "^27.0.2",
     "@typescript-eslint/eslint-plugin": "^5.3.0",
     "@typescript-eslint/parser": "^5.3.0",
+    "jest-fetch-mock": "^3.0.3",
     "bulma": "^0.9.3",
     "bulma-checkbox": "^1.1.1",
     "bulma-radio": "^1.1.1",
diff --git a/packages/bank/src/pages/home/index.tsx 
b/packages/bank/src/pages/home/index.tsx
index 3c6ae7d..c94a8e7 100644
--- a/packages/bank/src/pages/home/index.tsx
+++ b/packages/bank/src/pages/home/index.tsx
@@ -164,31 +164,34 @@ async function accountInfoCall(
  * the page's (to indicate a successful login or a problem).
  */
 async function registrationCall(
-  url: string,
   req: RegistrationRequestType,
   backendStateSetter: StateUpdater<BackendStateTypeOpt>,
   pageStateSetter: StateUpdater<PageStateType>
-  // pageStateSetter: (fn: (state: PageStateType) => void) => void,
 ) {
-  console.log("Try to register", req);
-  var handleResp = (respStatus: number) => {
-    switch (respStatus) {
-      case 200: {
-        pageStateSetter((state) => ({ ...state, isLoggedIn: true }));
-        backendStateSetter((state) => ({
-          ...state,
-          url: url,
-          username: req.username,
-          password: req.password,
-        }));
-        break;
-      }
-      default: {
-        pageStateSetter((state) => ({ ...state, hasProblem: true }));
-      }
-    }
-  };
-  handleResp(200);
+
+  let baseUrl = getRootPath();
+  try {
+    var res = await fetch(
+      `${baseUrl}testing/register`,
+      {method: 'POST', body: JSON.stringify(req)}
+    );
+  } catch (error) {
+    console.log("Could not POST new registration to the bank", error);
+    pageStateSetter((prevState) => ({ ...prevState, hasProblem: true }));
+    return;
+  }
+  if (!res.ok) {
+    pageStateSetter((prevState) => ({ ...prevState, hasProblem: true }));
+  } else {
+    console.log("Credentials are valid");
+    pageStateSetter((prevState) => ({ ...prevState, isLoggedIn: true }));
+    backendStateSetter((prevState) => ({
+      ...prevState,
+      url: baseUrl,
+      username: req.username,
+      password: req.password,
+    }));
+  }
 }
 
 /**************************
@@ -198,25 +201,29 @@ async function registrationCall(
 /**
  * Show only the account's balance.
  */
-export function Account(props: { balance: string }) {
-  return <p>Your balance is {props.balance}</p>;
+export function Account(props: any) {
+  const { data, error } = useSWR(`accounts/${props.accountLabel}`);
+  console.log("data", data);
+  console.log("error", error);
+  return <p>Your balance is coming...</p>;
 }
 
 /**
  * Factor out login credentials.
  */
 function SWRWithCredentials(props: any): VNode {
-  const { username, password } = props;
+  const { username, password, backendUrl } = props;
   const headers = new Headers();
   headers.append(
     "Authorization",
     `Basic ${Buffer.from(username + ":" + password).toString("base64")}`
   );
+  console.log("API call to", backendUrl);
   return (
     <SWRConfig
       value={{
         fetcher: (url) =>
-          fetch(url, { headers: headers }).then((r) => r.json()),
+          fetch(backendUrl + url || "", { headers: headers }).then((r) => 
r.json()),
       }}
     >
       {props.children}
@@ -243,7 +250,7 @@ export function BankHome(): VNode {
    * history */
   if (pageState.isLoggedIn) {
     if (typeof backendState === "undefined") {
-      console.log("Credentials not found in state, even after login.");
+      console.log("Credentials not found in state, even after login.", 
backendState);
       pageStateSetter((state) => ({ ...state, hasProblem: true }));
       return <p>Page has a problem</p>;
     }
@@ -251,8 +258,9 @@ export function BankHome(): VNode {
       <SWRWithCredentials
         username={backendState.username}
         password={backendState.password}
+        backendUrl={backendState.url}
       >
-        <p>Hey!</p>
+        <Account accountLabel={backendState.username} />
       </SWRWithCredentials>
     );
 
@@ -272,6 +280,7 @@ export function BankHome(): VNode {
   var registrationData: RegistrationRequestType;
   return (
     <div>
+      <p>Sign up!</p>
       <input
         type="text"
         placeholder="username"
@@ -298,7 +307,6 @@ export function BankHome(): VNode {
       <button
         onClick={() => {
           registrationCall(
-            getRootPath(),
             registrationData,
             backendStateSetter,
             pageStateSetter
diff --git a/packages/bank/tests/__tests__/homepage.js 
b/packages/bank/tests/__tests__/homepage.js
index c83f1e2..0529bba 100644
--- a/packages/bank/tests/__tests__/homepage.js
+++ b/packages/bank/tests/__tests__/homepage.js
@@ -4,17 +4,25 @@ import { BankHome } from '../../src/pages/home';
 import { h } from 'preact';
 import { render, fireEvent, screen } from '@testing-library/preact';
 import expect from 'expect';
+import fetchMock from "jest-fetch-mock";
+
+fetchMock.enableMocks();
+
+beforeEach(() => {
+  fetch.resetMocks();
+});
 
 describe("home page", () => {
-  test("greetings", () => {
-    const { container  } = render(<BankHome />);
+  test("new registration failure", async () => {
+    render(<BankHome />);
     const u = screen.getByPlaceholderText("username");
     const p = screen.getByPlaceholderText("password");
-    fireEvent.change(u, {target: {value: "foo"}})
-    fireEvent.change(p, {target: {value: "bar"}})
+    fireEvent.input(u, {target: {value: "foo"}})
+    fireEvent.input(p, {target: {value: "bar"}})
+    // Mocking 500 response.
+    fetch.mockReject("API is down");
     const s = screen.getByText("Submit");
     fireEvent.click(s);
-    /* FIXME: currently failing because the login credentials don't
-     * get stored to the state.  */
+    await screen.findByText("has a problem", {exact: false});
   })
 })

-- 
To stop receiving notification emails like this one, please contact
gnunet@gnunet.org.