cherry-pick: demobank-ui: clean up build system
This commit is contained in:
Sebastian
parent
a286649b0a
commit
3685f8cfb8
@ -1,19 +1,11 @@
|
||||
# bank web
|
||||
# Taler Demobank UI
|
||||
|
||||
## CLI Commands
|
||||
|
||||
- `npm install`: Installs dependencies
|
||||
- `pnpm install`: Installs dependencies
|
||||
|
||||
- `npm run dev`: Run a development, HMR server
|
||||
- `pnpm run build`: Production-ready build
|
||||
|
||||
- `npm run serve`: Run a production-like server
|
||||
- `pnpm run check`: Run type checker
|
||||
|
||||
- `npm run build`: Production-ready build
|
||||
|
||||
- `npm run lint`: Pass TypeScript files using ESLint
|
||||
|
||||
- `npm run test`: Run Jest and Enzyme with
|
||||
[`enzyme-adapter-preact-pure`](https://github.com/preactjs/enzyme-adapter-preact-pure) for
|
||||
your tests
|
||||
|
||||
For detailed explanation on how things work, checkout the [CLI Readme](https://github.com/developit/preact-cli/blob/master/README.md).
|
||||
- `pnpm run lint`: Pass TypeScript files using ESLint
|
||||
|
||||
160
packages/demobank-ui/build.mjs
Executable file
160
packages/demobank-ui/build.mjs
Executable file
@ -0,0 +1,160 @@
|
||||
#!/usr/bin/env node
|
||||
/*
|
||||
This file is part of GNU Taler
|
||||
(C) 2022 Taler Systems S.A.
|
||||
|
||||
GNU Taler is free software; you can redistribute it and/or modify it under the
|
||||
terms of the GNU General Public License as published by the Free Software
|
||||
Foundation; either version 3, or (at your option) any later version.
|
||||
|
||||
GNU Taler is distributed in the hope that it will be useful, but WITHOUT ANY
|
||||
WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR
|
||||
A PARTICULAR PURPOSE. See the GNU General Public License for more details.
|
||||
|
||||
You should have received a copy of the GNU General Public License along with
|
||||
GNU Taler; see the file COPYING. If not, see <http://www.gnu.org/licenses/>
|
||||
*/
|
||||
|
||||
import esbuild from "esbuild";
|
||||
import path from "path";
|
||||
import fs from "fs";
|
||||
import crypto from "crypto";
|
||||
import { sassPlugin } from "esbuild-sass-plugin";
|
||||
|
||||
const BASE = process.cwd();
|
||||
|
||||
const preact = path.join(
|
||||
BASE,
|
||||
"node_modules",
|
||||
"preact",
|
||||
"compat",
|
||||
"dist",
|
||||
"compat.module.js",
|
||||
);
|
||||
|
||||
const preactCompatPlugin = {
|
||||
name: "preact-compat",
|
||||
setup(build) {
|
||||
build.onResolve({ filter: /^(react-dom|react)$/ }, (args) => {
|
||||
//console.log("onresolve", JSON.stringify(args, undefined, 2));
|
||||
return {
|
||||
path: preact,
|
||||
};
|
||||
});
|
||||
},
|
||||
};
|
||||
|
||||
const entryPoints = ["src/index.tsx"];
|
||||
|
||||
let GIT_ROOT = BASE;
|
||||
while (!fs.existsSync(path.join(GIT_ROOT, ".git")) && GIT_ROOT !== "/") {
|
||||
GIT_ROOT = path.join(GIT_ROOT, "../");
|
||||
}
|
||||
if (GIT_ROOT === "/") {
|
||||
console.log("not found");
|
||||
process.exit(1);
|
||||
}
|
||||
const GIT_HASH = GIT_ROOT === "/" ? undefined : git_hash();
|
||||
|
||||
let _package = JSON.parse(fs.readFileSync(path.join(BASE, "package.json")));
|
||||
|
||||
function git_hash() {
|
||||
const rev = fs
|
||||
.readFileSync(path.join(GIT_ROOT, ".git", "HEAD"))
|
||||
.toString()
|
||||
.trim()
|
||||
.split(/.*[: ]/)
|
||||
.slice(-1)[0];
|
||||
if (rev.indexOf("/") === -1) {
|
||||
return rev;
|
||||
} else {
|
||||
return fs.readFileSync(path.join(GIT_ROOT, ".git", rev)).toString().trim();
|
||||
}
|
||||
}
|
||||
|
||||
// FIXME: Put this into some helper library.
|
||||
function copyFilesPlugin(options) {
|
||||
const getDigest = (string) => {
|
||||
const hash = crypto.createHash("md5");
|
||||
const data = hash.update(string, "utf-8");
|
||||
|
||||
return data.digest("hex");
|
||||
};
|
||||
|
||||
const getFileDigest = (path) => {
|
||||
if (!fs.existsSync(path)) {
|
||||
return null;
|
||||
}
|
||||
|
||||
if (fs.statSync(path).isDirectory()) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return getDigest(fs.readFileSync(path));
|
||||
};
|
||||
|
||||
function filter(src, dest) {
|
||||
if (!fs.existsSync(dest)) {
|
||||
return true;
|
||||
}
|
||||
|
||||
if (fs.statSync(dest).isDirectory()) {
|
||||
return true;
|
||||
}
|
||||
|
||||
return getFileDigest(src) !== getFileDigest(dest);
|
||||
}
|
||||
|
||||
return {
|
||||
name: "copy-files",
|
||||
setup(build) {
|
||||
let src = options.src || "./static";
|
||||
let dest = options.dest || "./dist";
|
||||
build.onEnd(() =>
|
||||
fs.cpSync(src, dest, {
|
||||
dereference: options.dereference || true,
|
||||
errorOnExist: options.errorOnExist || false,
|
||||
filter: options.filter || filter,
|
||||
force: options.force || true,
|
||||
preserveTimestamps: options.preserveTimestamps || true,
|
||||
recursive: options.recursive || true,
|
||||
}),
|
||||
);
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
export const buildConfig = {
|
||||
entryPoints: [...entryPoints],
|
||||
bundle: true,
|
||||
outdir: "dist",
|
||||
minify: false,
|
||||
loader: {
|
||||
".svg": "text",
|
||||
".png": "dataurl",
|
||||
".jpeg": "dataurl",
|
||||
},
|
||||
target: ["es6"],
|
||||
format: "esm",
|
||||
platform: "browser",
|
||||
sourcemap: true,
|
||||
jsxFactory: "h",
|
||||
jsxFragment: "Fragment",
|
||||
define: {
|
||||
__VERSION__: `"${_package.version}"`,
|
||||
__GIT_HASH__: `"${GIT_HASH}"`,
|
||||
},
|
||||
plugins: [
|
||||
preactCompatPlugin,
|
||||
sassPlugin(),
|
||||
copyFilesPlugin({
|
||||
src: "static/index.html",
|
||||
dest: "dist/index.html",
|
||||
}),
|
||||
],
|
||||
};
|
||||
|
||||
esbuild.build(buildConfig).catch((e) => {
|
||||
console.log(e);
|
||||
process.exit(1);
|
||||
});
|
||||
@ -1,4 +0,0 @@
|
||||
{
|
||||
"register": {},
|
||||
"transactions": {}
|
||||
}
|
||||
@ -1,27 +0,0 @@
|
||||
Object.defineProperty(window, 'requestAnimationFrame', {
|
||||
value: function(cb) {} // Silence the browser.
|
||||
})
|
||||
|
||||
Object.defineProperty(window, 'localStorage', {
|
||||
value: {
|
||||
store: {},
|
||||
getItem: function(key) {
|
||||
return this.store[key];
|
||||
},
|
||||
setItem: function(key, value) {
|
||||
return this.store[key] = value;
|
||||
},
|
||||
clear: function() {
|
||||
this.store = {};
|
||||
}
|
||||
}
|
||||
});
|
||||
Object.defineProperty(window, 'location', {
|
||||
value: {
|
||||
origin: "http://localhost:8080", /* where taler-local rev proxy listens to */
|
||||
search: "",
|
||||
pathname: "/sandbox/demobanks/default",
|
||||
}
|
||||
})
|
||||
|
||||
export default window;
|
||||
@ -4,15 +4,10 @@
|
||||
"version": "0.1.0",
|
||||
"license": "AGPL-3.0-OR-LATER",
|
||||
"scripts": {
|
||||
"dev": "preact watch --port ${PORT:=9090} --no-sw --no-esm -c preact.mock.js",
|
||||
"build": "preact build --no-sw --no-esm -c preact.single-config.js --dest build && sh remove-link-stylesheet.sh",
|
||||
"serve": "sirv build --port ${PORT:=8080} --cors --single",
|
||||
"build": "./build.mjs",
|
||||
"check": "tsc",
|
||||
"lint": "eslint 'src/**/*.{js,jsx,ts,tsx}'",
|
||||
"test": "jest ./tests",
|
||||
"build-storybook": "build-storybook",
|
||||
"serve-single": "sirv single --port ${PORT:=8080} --cors --single",
|
||||
"pretty": "prettier --write src",
|
||||
"storybook": "start-storybook -p 6006"
|
||||
"pretty": "prettier --write src"
|
||||
},
|
||||
"eslintConfig": {
|
||||
"parser": "@typescript-eslint/parser",
|
||||
@ -24,77 +19,62 @@
|
||||
"build/"
|
||||
],
|
||||
"rules": {
|
||||
"@typescript-eslint/no-explicit-any": [0],
|
||||
"@typescript-eslint/ban-ts-comment": [1],
|
||||
"quotes": [2, "single", {"allowTemplateLiterals": true,"avoidEscape": false}],
|
||||
"indent": [2,2],
|
||||
"prefer-arrow-callback": [2, {"allowNamedFunctions": false, "allowUnboundThis": true}],
|
||||
"curly": [2,"multi"],
|
||||
"prefer-template": [1]
|
||||
"@typescript-eslint/no-explicit-any": [
|
||||
0
|
||||
],
|
||||
"@typescript-eslint/ban-ts-comment": [
|
||||
1
|
||||
],
|
||||
"quotes": [
|
||||
2,
|
||||
"single",
|
||||
{
|
||||
"allowTemplateLiterals": true,
|
||||
"avoidEscape": false
|
||||
}
|
||||
],
|
||||
"indent": [
|
||||
2,
|
||||
2
|
||||
],
|
||||
"prefer-arrow-callback": [
|
||||
2,
|
||||
{
|
||||
"allowNamedFunctions": false,
|
||||
"allowUnboundThis": true
|
||||
}
|
||||
],
|
||||
"curly": [
|
||||
2,
|
||||
"multi"
|
||||
],
|
||||
"prefer-template": [
|
||||
1
|
||||
]
|
||||
}
|
||||
},
|
||||
"dependencies": {
|
||||
"base64-inline-loader": "1.1.1",
|
||||
"date-fns": "2.25.0",
|
||||
"date-fns": "2.29.3",
|
||||
"jed": "1.1.1",
|
||||
"preact": "^10.5.15",
|
||||
"preact-render-to-string": "^5.1.19",
|
||||
"preact-router": "^3.2.1",
|
||||
"preact-render-to-string": "^5.2.6",
|
||||
"preact-router": "^4.1.0",
|
||||
"qrcode-generator": "^1.4.4",
|
||||
"swr": "1.1"
|
||||
"swr": "~1.3.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/core": "7.18.9",
|
||||
"@babel/plugin-transform-modules-commonjs": "7.18.6",
|
||||
"@babel/plugin-transform-react-jsx-source": "7.18.6",
|
||||
"@babel/preset-env": "7.18.9",
|
||||
"@creativebulma/bulma-tooltip": "^1.2.0",
|
||||
"@gnu-taler/pogen": "^0.0.5",
|
||||
"@storybook/addon-a11y": "6.2.9",
|
||||
"@storybook/addon-actions": "6.2.9",
|
||||
"@storybook/addon-essentials": "6.2.9",
|
||||
"@storybook/addon-links": "6.2.9",
|
||||
"@storybook/preact": "6.2.9",
|
||||
"@storybook/preset-scss": "^1.0.3",
|
||||
"@testing-library/jest-dom": "^5.16.1",
|
||||
"@testing-library/preact": "^2.0.1",
|
||||
"@testing-library/preact-hooks": "^1.1.0",
|
||||
"@types/enzyme": "^3.10.10",
|
||||
"@types/jest": "^27.0.2",
|
||||
"@typescript-eslint/eslint-plugin": "^5.3.0",
|
||||
"@typescript-eslint/parser": "^5.3.0",
|
||||
"babel-loader": "^8.2.2",
|
||||
"base64-inline-loader": "^1.1.1",
|
||||
"bulma": "^0.9.3",
|
||||
"@typescript-eslint/eslint-plugin": "^5.41.0",
|
||||
"@typescript-eslint/parser": "^5.41.0",
|
||||
"bulma": "^0.9.4",
|
||||
"bulma-checkbox": "^1.1.1",
|
||||
"bulma-radio": "^1.1.1",
|
||||
"enzyme": "^3.11.0",
|
||||
"enzyme-adapter-preact-pure": "^3.2.0",
|
||||
"eslint": "^8.1.0",
|
||||
"esbuild": "^0.15.12",
|
||||
"esbuild-sass-plugin": "^2.4.0",
|
||||
"eslint": "^8.26.0",
|
||||
"eslint-config-preact": "^1.2.0",
|
||||
"html-webpack-inline-chunk-plugin": "^1.1.1",
|
||||
"html-webpack-inline-source-plugin": "0.0.10",
|
||||
"html-webpack-skip-assets-plugin": "^1.0.1",
|
||||
"inline-chunk-html-plugin": "^1.1.1",
|
||||
"jest": "^27.3.1",
|
||||
"jest-fetch-mock": "^3.0.3",
|
||||
"jest-preset-preact": "^4.0.5",
|
||||
"jest-watch-typeahead": "^1.0.0",
|
||||
"jest-environment-jsdom": "^27.4.6",
|
||||
"jssha": "^3.2.0",
|
||||
"po2json": "^0.4.5",
|
||||
"preact-cli": "3.0.5",
|
||||
"sass": "1.32.13",
|
||||
"sass-loader": "^10",
|
||||
"script-ext-html-webpack-plugin": "^2.1.5",
|
||||
"sirv-cli": "^1.0.14",
|
||||
"preact": "10.11.2",
|
||||
"typescript": "^4.4.4"
|
||||
},
|
||||
"jest": {
|
||||
"preset": "jest-preset-preact",
|
||||
"setupFiles": [
|
||||
"<rootDir>/tests/__mocks__/browserMocks.ts",
|
||||
"<rootDir>/tests/__mocks__/setupTests.ts"
|
||||
]
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,70 +0,0 @@
|
||||
/*
|
||||
This file is part of GNU Taler
|
||||
(C) 2021 Taler Systems S.A.
|
||||
|
||||
GNU Taler is free software; you can redistribute it and/or modify it under the
|
||||
terms of the GNU General Public License as published by the Free Software
|
||||
Foundation; either version 3, or (at your option) any later version.
|
||||
|
||||
GNU Taler is distributed in the hope that it will be useful, but WITHOUT ANY
|
||||
WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR
|
||||
A PARTICULAR PURPOSE. See the GNU General Public License for more details.
|
||||
|
||||
You should have received a copy of the GNU General Public License along with
|
||||
GNU Taler; see the file COPYING. If not, see <http://www.gnu.org/licenses/>
|
||||
*/
|
||||
|
||||
/**
|
||||
*
|
||||
* @author Sebastian Javier Marchano (sebasjm)
|
||||
*/
|
||||
|
||||
import { DefinePlugin } from 'webpack';
|
||||
|
||||
import pack from './package.json';
|
||||
import * as cp from 'child_process';
|
||||
|
||||
const commitHash = cp.execSync('git rev-parse --short HEAD').toString();
|
||||
|
||||
export default {
|
||||
webpack(config, env, helpers) {
|
||||
// ensure that process.env will not be undefined on runtime
|
||||
config.node.process = 'mock'
|
||||
|
||||
// add __VERSION__ to be use in the html
|
||||
config.plugins.push(
|
||||
new DefinePlugin({
|
||||
'process.env.__VERSION__': JSON.stringify(env.isProd ? pack.version : `dev-${commitHash}`) ,
|
||||
}),
|
||||
);
|
||||
|
||||
// suddenly getting out of memory error from build process, error below [1]
|
||||
// FIXME: remove preact-cli, use rollup
|
||||
let { index } = helpers.getPluginsByName(config, 'WebpackFixStyleOnlyEntriesPlugin')[0]
|
||||
config.plugins.splice(index, 1)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* [1] from this error decided to remove plugin 'webpack-fix-style-only-entries
|
||||
leaving this error for future reference
|
||||
|
||||
|
||||
<--- Last few GCs --->
|
||||
|
||||
[32479:0x2e01870] 19969 ms: Mark-sweep 1869.4 (1950.2) -> 1443.1 (1504.1) MB, 497.5 / 0.0 ms (average mu = 0.631, current mu = 0.455) allocation failure scavenge might not succeed
|
||||
[32479:0x2e01870] 21907 ms: Mark-sweep 2016.9 (2077.9) -> 1628.6 (1681.4) MB, 1596.0 / 0.0 ms (average mu = 0.354, current mu = 0.176) allocation failure scavenge might not succeed
|
||||
|
||||
<--- JS stacktrace --->
|
||||
|
||||
==== JS stack trace =========================================
|
||||
|
||||
0: ExitFrame [pc: 0x13cf099]
|
||||
Security context: 0x2f4ca66c08d1 <JSObject>
|
||||
1: /* anonymous * / [0x35d05555b4b9] [...path/merchant-backoffice/node_modules/.pnpm/webpack-fix-style-only-entries@0.5.2/node_modules/webpack-fix-style-only-entries/index.js:~80] [pc=0x2145e699d1a4](this=0x1149465410e9 <GlobalObject Object map = 0xff481b5b5f9>,0x047e52e36a49 <Dependency map = 0x1ed1fe41cd19>)
|
||||
2: arguments adaptor frame: 3...
|
||||
|
||||
FATAL ERROR: invalid array length Allocation failed - JavaScript heap out of memory
|
||||
|
||||
*/
|
||||
@ -1,55 +0,0 @@
|
||||
/*
|
||||
This file is part of GNU Taler
|
||||
(C) 2021 Taler Systems S.A.
|
||||
|
||||
GNU Taler is free software; you can redistribute it and/or modify it under the
|
||||
terms of the GNU General Public License as published by the Free Software
|
||||
Foundation; either version 3, or (at your option) any later version.
|
||||
|
||||
GNU Taler is distributed in the hope that it will be useful, but WITHOUT ANY
|
||||
WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR
|
||||
A PARTICULAR PURPOSE. See the GNU General Public License for more details.
|
||||
|
||||
You should have received a copy of the GNU General Public License along with
|
||||
GNU Taler; see the file COPYING. If not, see <http://www.gnu.org/licenses/>
|
||||
*/
|
||||
|
||||
/**
|
||||
*
|
||||
* @author Sebastian Javier Marchano (sebasjm)
|
||||
*/
|
||||
|
||||
import { DefinePlugin, ProvidePlugin } from 'webpack';
|
||||
|
||||
import pack from './package.json';
|
||||
import * as cp from 'child_process';
|
||||
|
||||
const commitHash = cp.execSync('git rev-parse --short HEAD').toString();
|
||||
import path from 'path';
|
||||
|
||||
export default {
|
||||
webpack(config, env, helpers) {
|
||||
// Ensure that process.env will not be undefined at runtime.
|
||||
config.node.process = 'mock'
|
||||
let DEMO_SITES = {
|
||||
"Blog": process.env.TALER_ENV_URL_MERCHANT_BLOG,
|
||||
"Donations": process.env.TALER_ENV_URL_MERCHANT_DONATIONS,
|
||||
"Survey": process.env.TALER_ENV_URL_MERCHANT_SURVEY,
|
||||
"Landing": process.env.TALER_ENV_URL_INTRO,
|
||||
"Bank": process.env.TALER_ENV_URL_BANK,
|
||||
}
|
||||
console.log("demo links found", DEMO_SITES);
|
||||
// Add __VERSION__ to be use in the html.
|
||||
config.plugins.push(
|
||||
new DefinePlugin({
|
||||
'process.env.__VERSION__': JSON.stringify(env.isProd ? pack.version : `dev-${commitHash}`) ,
|
||||
}),
|
||||
// 'window' gets mocked to point at a running euFin instance.
|
||||
new ProvidePlugin({window: path.resolve("mocks/window")}),
|
||||
new DefinePlugin({"DEMO_SITES": JSON.stringify(DEMO_SITES)})
|
||||
);
|
||||
|
||||
let { index } = helpers.getPluginsByName(config, 'WebpackFixStyleOnlyEntriesPlugin')[0]
|
||||
config.plugins.splice(index, 1)
|
||||
}
|
||||
}
|
||||
@ -1,60 +0,0 @@
|
||||
/*
|
||||
This file is part of GNU Taler
|
||||
(C) 2021 Taler Systems S.A.
|
||||
|
||||
GNU Taler is free software; you can redistribute it and/or modify it under the
|
||||
terms of the GNU General Public License as published by the Free Software
|
||||
Foundation; either version 3, or (at your option) any later version.
|
||||
|
||||
GNU Taler is distributed in the hope that it will be useful, but WITHOUT ANY
|
||||
WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR
|
||||
A PARTICULAR PURPOSE. See the GNU General Public License for more details.
|
||||
|
||||
You should have received a copy of the GNU General Public License along with
|
||||
GNU Taler; see the file COPYING. If not, see <http://www.gnu.org/licenses/>
|
||||
*/
|
||||
|
||||
/**
|
||||
*
|
||||
* @author Sebastian Javier Marchano (sebasjm)
|
||||
*/
|
||||
|
||||
import defaultConfig from './preact.config'
|
||||
|
||||
export default {
|
||||
webpack(config, env, helpers, options) {
|
||||
defaultConfig.webpack(config, env, helpers, options)
|
||||
|
||||
//1. check no file is under /routers or /component/{routers,async} to prevent async components
|
||||
// https://github.com/preactjs/preact-cli#route-based-code-splitting
|
||||
|
||||
//2. remove devtools to prevent sourcemaps
|
||||
config.devtool = false
|
||||
|
||||
//3. change assetLoader to load assets inline
|
||||
const loaders = helpers.getLoaders(config)
|
||||
const assetsLoader = loaders.find(lo => lo.rule.test.test('something.woff'))
|
||||
if (assetsLoader) {
|
||||
assetsLoader.rule.use = 'base64-inline-loader'
|
||||
assetsLoader.rule.loader = undefined
|
||||
}
|
||||
|
||||
//4. remove critters
|
||||
//critters remove the css bundle from htmlWebpackPlugin.files.css
|
||||
//for now, pushing all the content into the html is enough
|
||||
const crittersWrapper = helpers.getPluginsByName(config, 'Critters')
|
||||
if (crittersWrapper && crittersWrapper.length > 0) {
|
||||
const [{ index }] = crittersWrapper
|
||||
config.plugins.splice(index, 1)
|
||||
}
|
||||
|
||||
//5. remove favicon from src/assets
|
||||
|
||||
//6. remove performance hints since we now that this is going to be big
|
||||
if (config.performance) {
|
||||
config.performance.hints = false
|
||||
}
|
||||
|
||||
//7. template.html should have a favicon and add js/css content
|
||||
}
|
||||
}
|
||||
@ -1,8 +0,0 @@
|
||||
# This script has been placed in the public domain.
|
||||
|
||||
FILE=$(ls build/bundle.*.css)
|
||||
BUNDLE=${FILE#build}
|
||||
grep -q '<link href="'$BUNDLE'" rel="stylesheet">' build/index.html || { echo bundle $BUNDLE not found in index.html; exit 1; }
|
||||
echo -n Removing link from index.html ...
|
||||
sed 's_<link href="'$BUNDLE'" rel="stylesheet">__' -i build/index.html
|
||||
echo done
|
||||
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M22 6c0-1.1-.9-2-2-2H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6zm-2 0l-8 5-8-5h16zm0 12H4V8l8 5 8-5v10z"/></svg>
|
||||
|
Before Width: | Height: | Size: 274 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><path d="M0 0h24v24H0z" fill="none"/><path d="M17 15h2v2h-2zM17 11h2v2h-2zM17 7h2v2h-2zM13.74 7l1.26.84V7z"/><path d="M10 3v1.51l2 1.33V5h9v14h-4v2h6V3z"/><path d="M8.17 5.7L15 10.25V21H1V10.48L8.17 5.7zM10 19h3v-7.84L8.17 8.09 3 11.38V19h3v-6h4v6z"/></svg>
|
||||
|
Before Width: | Height: | Size: 359 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M11 23.59v-3.6c-5.01-.26-9-4.42-9-9.49C2 5.26 6.26 1 11.5 1S21 5.26 21 10.5c0 4.95-3.44 9.93-8.57 12.4l-1.43.69zM11.5 3C7.36 3 4 6.36 4 10.5S7.36 18 11.5 18H13v2.3c3.64-2.3 6-6.08 6-9.8C19 6.36 15.64 3 11.5 3zm-1 11.5h2v2h-2zm2-1.5h-2c0-3.25 3-3 3-5 0-1.1-.9-2-2-2s-2 .9-2 2h-2c0-2.21 1.79-4 4-4s4 1.79 4 4c0 2.5-3 2.75-3 5z"/></svg>
|
||||
|
Before Width: | Height: | Size: 483 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M17 1.01L7 1c-1.1 0-1.99.9-1.99 2v18c0 1.1.89 2 1.99 2h10c1.1 0 2-.9 2-2V3c0-1.1-.9-1.99-2-1.99zM17 19H7V5h10v14z"/></svg>
|
||||
|
Before Width: | Height: | Size: 272 B |
@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24px" viewBox="0 0 24 24" width="24px" fill="#000000"><g><rect fill="none" height="24" width="24"/></g><g><g><path d="M18,10.48V6c0-1.1-0.9-2-2-2H4C2.9,4,2,4.9,2,6v12c0,1.1,0.9,2,2,2h12c1.1,0,2-0.9,2-2v-4.48l4,3.98v-11L18,10.48z M16,9.69V18H4V6h12V9.69z"/><circle cx="10" cy="10" r="2"/><path d="M14,15.43c0-0.81-0.48-1.53-1.22-1.85C11.93,13.21,10.99,13,10,13c-0.99,0-1.93,0.21-2.78,0.58C6.48,13.9,6,14.62,6,15.43 V16h8V15.43z"/></g></g></svg>
|
||||
|
Before Width: | Height: | Size: 525 B |
@ -1,7 +1,6 @@
|
||||
import { FunctionalComponent, h } from 'preact';
|
||||
import { TranslationProvider } from '../context/translation';
|
||||
import { BankHome } from '../pages/home/index';
|
||||
import { Menu } from './menu';
|
||||
import { FunctionalComponent } from "preact";
|
||||
import { TranslationProvider } from "../context/translation";
|
||||
import { BankHome } from "../pages/home/index";
|
||||
|
||||
const App: FunctionalComponent = () => {
|
||||
return (
|
||||
|
||||
@ -19,14 +19,14 @@
|
||||
* @author Sebastian Javier Marchano (sebasjm)
|
||||
*/
|
||||
|
||||
import { StateUpdater, useState } from 'preact/hooks';
|
||||
import { StateUpdater, useState } from "preact/hooks";
|
||||
export type ValueOrFunction<T> = T | ((p: T) => T);
|
||||
|
||||
const calculateRootPath = () => {
|
||||
const rootPath =
|
||||
typeof window !== undefined
|
||||
? window.location.origin + window.location.pathname
|
||||
: '/';
|
||||
: "/";
|
||||
return rootPath;
|
||||
};
|
||||
|
||||
@ -34,14 +34,14 @@ export function useBackendURL(
|
||||
url?: string,
|
||||
): [string, boolean, StateUpdater<string>, () => void] {
|
||||
const [value, setter] = useNotNullLocalStorage(
|
||||
'backend-url',
|
||||
"backend-url",
|
||||
url || calculateRootPath(),
|
||||
);
|
||||
const [triedToLog, setTriedToLog] = useLocalStorage('tried-login');
|
||||
const [triedToLog, setTriedToLog] = useLocalStorage("tried-login");
|
||||
|
||||
const checkedSetter = (v: ValueOrFunction<string>) => {
|
||||
setTriedToLog('yes');
|
||||
return setter((p) => (v instanceof Function ? v(p) : v).replace(/\/$/, ''));
|
||||
setTriedToLog("yes");
|
||||
return setter((p) => (v instanceof Function ? v(p) : v).replace(/\/$/, ""));
|
||||
};
|
||||
|
||||
const resetBackend = () => {
|
||||
@ -54,7 +54,7 @@ export function useBackendDefaultToken(): [
|
||||
string | undefined,
|
||||
StateUpdater<string | undefined>,
|
||||
] {
|
||||
return useLocalStorage('backend-token');
|
||||
return useLocalStorage("backend-token");
|
||||
}
|
||||
|
||||
export function useBackendInstanceToken(
|
||||
@ -64,59 +64,60 @@ export function useBackendInstanceToken(
|
||||
const [defaultToken, defaultSetToken] = useBackendDefaultToken();
|
||||
|
||||
// instance named 'default' use the default token
|
||||
if (id === 'default')
|
||||
return [defaultToken, defaultSetToken];
|
||||
if (id === "default") return [defaultToken, defaultSetToken];
|
||||
|
||||
return [token, setToken];
|
||||
}
|
||||
|
||||
export function useLang(initial?: string): [string, StateUpdater<string>] {
|
||||
const browserLang =
|
||||
typeof window !== 'undefined'
|
||||
typeof window !== "undefined"
|
||||
? navigator.language || (navigator as any).userLanguage
|
||||
: undefined;
|
||||
const defaultLang = (browserLang || initial || 'en').substring(0, 2);
|
||||
const [value, setValue] = useNotNullLocalStorage('lang-preference', defaultLang);
|
||||
function updateValue(newValue: (string | ((v: string) => string))) {
|
||||
const defaultLang = (browserLang || initial || "en").substring(0, 2);
|
||||
const [value, setValue] = useNotNullLocalStorage(
|
||||
"lang-preference",
|
||||
defaultLang,
|
||||
);
|
||||
function updateValue(newValue: string | ((v: string) => string)) {
|
||||
if (document.body.parentElement) {
|
||||
const htmlElement = document.body.parentElement
|
||||
if (typeof newValue === 'string') {
|
||||
const htmlElement = document.body.parentElement;
|
||||
if (typeof newValue === "string") {
|
||||
htmlElement.lang = newValue;
|
||||
setValue(newValue)
|
||||
} else if (typeof newValue === 'function')
|
||||
setValue(newValue);
|
||||
} else if (typeof newValue === "function")
|
||||
setValue((old) => {
|
||||
const nv = newValue(old)
|
||||
const nv = newValue(old);
|
||||
htmlElement.lang = nv;
|
||||
return nv
|
||||
})
|
||||
} else setValue(newValue)
|
||||
return nv;
|
||||
});
|
||||
} else setValue(newValue);
|
||||
}
|
||||
return [value, updateValue]
|
||||
return [value, updateValue];
|
||||
}
|
||||
|
||||
export function useLocalStorage(
|
||||
key: string,
|
||||
initialValue?: string,
|
||||
): [string | undefined, StateUpdater<string | undefined>] {
|
||||
const [storedValue, setStoredValue] = useState<string | undefined>(():
|
||||
| string
|
||||
| undefined => {
|
||||
return typeof window !== 'undefined'
|
||||
const [storedValue, setStoredValue] = useState<string | undefined>(
|
||||
(): string | undefined => {
|
||||
return typeof window !== "undefined"
|
||||
? window.localStorage.getItem(key) || initialValue
|
||||
: initialValue;
|
||||
});
|
||||
},
|
||||
);
|
||||
|
||||
const setValue = (
|
||||
value?: string | ((val?: string) => string | undefined),
|
||||
) => {
|
||||
setStoredValue((p) => {
|
||||
console.log("calling setStoredValue");
|
||||
console.log(window);
|
||||
const toStore = value instanceof Function ? value(p) : value;
|
||||
if (typeof window !== 'undefined')
|
||||
if (!toStore)
|
||||
window.localStorage.removeItem(key);
|
||||
else
|
||||
window.localStorage.setItem(key, toStore);
|
||||
|
||||
if (typeof window !== "undefined")
|
||||
if (!toStore) window.localStorage.removeItem(key);
|
||||
else window.localStorage.setItem(key, toStore);
|
||||
|
||||
return toStore;
|
||||
});
|
||||
@ -130,7 +131,7 @@ export function useNotNullLocalStorage(
|
||||
initialValue: string,
|
||||
): [string, StateUpdater<string>] {
|
||||
const [storedValue, setStoredValue] = useState<string>((): string => {
|
||||
return typeof window !== 'undefined'
|
||||
return typeof window !== "undefined"
|
||||
? window.localStorage.getItem(key) || initialValue
|
||||
: initialValue;
|
||||
});
|
||||
@ -138,13 +139,9 @@ export function useNotNullLocalStorage(
|
||||
const setValue = (value: string | ((val: string) => string)) => {
|
||||
const valueToStore = value instanceof Function ? value(storedValue) : value;
|
||||
setStoredValue(valueToStore);
|
||||
if (typeof window !== 'undefined')
|
||||
if (!valueToStore)
|
||||
window.localStorage.removeItem(key);
|
||||
else
|
||||
window.localStorage.setItem(key, valueToStore);
|
||||
|
||||
|
||||
if (typeof window !== "undefined")
|
||||
if (!valueToStore) window.localStorage.removeItem(key);
|
||||
else window.localStorage.setItem(key, valueToStore);
|
||||
};
|
||||
|
||||
return [storedValue, setValue];
|
||||
|
||||
34
packages/demobank-ui/src/index.html
Normal file
34
packages/demobank-ui/src/index.html
Normal file
@ -0,0 +1,34 @@
|
||||
<!--
|
||||
This file is part of GNU Taler
|
||||
(C) 2021--2022 Taler Systems S.A.
|
||||
|
||||
GNU Taler is free software; you can redistribute it and/or modify it under the
|
||||
terms of the GNU General Public License as published by the Free Software
|
||||
Foundation; either version 3, or (at your option) any later version.
|
||||
|
||||
GNU Taler is distributed in the hope that it will be useful, but WITHOUT ANY
|
||||
WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR
|
||||
A PARTICULAR PURPOSE. See the GNU General Public License for more details.
|
||||
|
||||
You should have received a copy of the GNU General Public License along with
|
||||
GNU Taler; see the file COPYING. If not, see <http://www.gnu.org/licenses/>
|
||||
|
||||
@author Sebastian Javier Marchano
|
||||
-->
|
||||
<!DOCTYPE html>
|
||||
<html lang="en" class="has-aside-left has-aside-mobile-transition has-navbar-fixed-top has-aside-expanded">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1">
|
||||
<meta name="mobile-web-app-capable" content="yes">
|
||||
<meta name="apple-mobile-web-app-capable" content="yes">
|
||||
|
||||
<link rel="icon" href="data:;base64,AAABAAEAEBAAAAEAIABoBAAAFgAAACgAAAAQAAAAIAAAAAEAIAAAAAAAAAQAABILAAASCwAAAAAAAAAAAAD///////////////////////////////////////////////////////////////////////////////////////////////////7//v38//78/P/+/fz//vz7///+/v/+/f3//vz7///+/v/+/fz//v38///////////////////////+/v3///7+/////////////////////////////////////////////////////////v3//v79///////+/v3///////r28v/ct5//06SG/9Gffv/Xqo7/7N/V/9e2nf/bsJb/6uDW/9Sskf/euKH/+/j2///////+/v3//////+3azv+/eE3/2rWd/9Kkhv/Vr5T/48i2/8J+VP/Qn3//3ryn/795Tf/WrpP/2LCW/8B6T//w4Nb///////Pn4P+/d0v/9u3n/+7d0v/EhV7//v///+HDr//fxLD/zph2/+TJt//8/Pv/woBX//Lm3f/y5dz/v3hN//bu6f/JjGn/4sW0///////Df1j/8OLZ//v6+P+/elH/+vj1//jy7f+/elL//////+zYzP/Eg13//////967p//MlHT/wn5X///////v4Nb/yY1s///////jw7H/06KG////////////z5t9/+fNvf//////x4pn//Pp4v/8+vn/w39X/8WEX///////5s/A/9CbfP//////27Oc/9y2n////////////9itlf/gu6f//////86Vdf/r2Mz//////8SCXP/Df1j//////+7d0v/KkG7//////+HBrf/VpYr////////////RnoH/5sq6///////Ii2n/8ubf//39/P/Cf1j/xohk/+bNvv//////wn5W//Tq4//58/D/wHxV//7+/f/59fH/v3xU//39/P/w4Nf/xIFb///////hw7H/yo9t/+/f1f/AeU3/+/n2/+nSxP/FhmD//////9qzm//Upon/4MSx/96+qf//////xINc/+3bz//48e3/v3hN//Pn3///////6M+//752S//gw6//06aK/8J+VP/kzLr/zZd1/8OCWv/q18r/17KZ/9Ooi//fv6r/v3dK/+vWyP///////v39///////27un/1aeK/9Opjv/m1cf/1KCC/9a0nP/n08T/0Jx8/82YdP/QnHz/16yR//jx7P///////v39///////+/f3///7+///////+//7//v7+///////+/v7//v/+/////////////////////////v7//v79///////////////////+/v/+/Pv//v39///+/v/+/Pv///7+//7+/f/+/Pv//v39//79/P/+/Pv///7+////////////AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA==" />
|
||||
<link rel="shortcut icon" href="data:image/x-icon;," type="image/x-icon" />
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
<script type="module" src="index.tsx"></script>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,3 +1,7 @@
|
||||
import App from './components/app';
|
||||
|
||||
import App from "./components/app";
|
||||
export default App;
|
||||
import { render, h, Fragment } from "preact";
|
||||
|
||||
const app = document.getElementById("app");
|
||||
|
||||
render(<App />, app as any);
|
||||
|
||||
@ -17,6 +17,7 @@
|
||||
/* eslint-disable @typescript-eslint/no-explicit-any */
|
||||
import useSWR, { SWRConfig as _SWRConfig, useSWRConfig } from "swr";
|
||||
import { h, Fragment, VNode, createContext } from "preact";
|
||||
|
||||
import {
|
||||
useRef,
|
||||
useState,
|
||||
@ -24,20 +25,37 @@ import {
|
||||
StateUpdater,
|
||||
useContext,
|
||||
} from "preact/hooks";
|
||||
import { Buffer } from "buffer";
|
||||
import { useTranslator, Translate } from "../../i18n";
|
||||
import { QR } from "../../components/QR";
|
||||
import { useNotNullLocalStorage, useLocalStorage } from "../../hooks";
|
||||
import { useTranslator, Translate } from "../../i18n/index.js";
|
||||
import { QR } from "../../components/QR.js";
|
||||
import { useNotNullLocalStorage, useLocalStorage } from "../../hooks/index.js";
|
||||
import "../../scss/main.scss";
|
||||
import talerLogo from "../../assets/logo-white.svg";
|
||||
import { LangSelectorLikePy as LangSelector } from "../../components/menu/LangSelector";
|
||||
import { LangSelectorLikePy as LangSelector } from "../../components/menu/LangSelector.js";
|
||||
|
||||
// FIXME: Fix usages of SWRConfig, doing this isn't the best practice (but hey, it works for now)
|
||||
const SWRConfig = _SWRConfig as any;
|
||||
|
||||
const UI_ALLOW_REGISTRATIONS = "__LIBEUFIN_UI_ALLOW_REGISTRATIONS__" ?? 1;
|
||||
const UI_IS_DEMO = "__LIBEUFIN_UI_IS_DEMO__" ?? 0;
|
||||
const UI_BANK_NAME = "__LIBEUFIN_UI_BANK_NAME__" ?? "Taler Bank";
|
||||
/**
|
||||
* If the first argument does not look like a placeholder, return it.
|
||||
* Otherwise, return the default.
|
||||
*
|
||||
* Useful for placeholder string replacements optionally
|
||||
* done as part of the build system.
|
||||
*/
|
||||
const replacementOrDefault = (x: string, defaultVal: string) => {
|
||||
if (x.startsWith("__")) {
|
||||
return defaultVal;
|
||||
}
|
||||
return x;
|
||||
};
|
||||
|
||||
const UI_ALLOW_REGISTRATIONS =
|
||||
replacementOrDefault("__LIBEUFIN_UI_ALLOW_REGISTRATIONS__", "1") == "1";
|
||||
const UI_IS_DEMO = replacementOrDefault("__LIBEUFIN_UI_IS_DEMO__", "0") == "1";
|
||||
const UI_BANK_NAME = replacementOrDefault(
|
||||
"__LIBEUFIN_UI_BANK_NAME__",
|
||||
"Taler Bank",
|
||||
);
|
||||
|
||||
/**
|
||||
* FIXME:
|
||||
@ -156,15 +174,6 @@ function maybeDemoContent(content: VNode) {
|
||||
if (UI_IS_DEMO) return content;
|
||||
}
|
||||
|
||||
async function fetcher(url: string) {
|
||||
return fetch(url).then((r) => r.json());
|
||||
}
|
||||
|
||||
function genCaptchaNumbers(): string {
|
||||
return `${Math.floor(Math.random() * 10)} + ${Math.floor(
|
||||
Math.random() * 10,
|
||||
)}`;
|
||||
}
|
||||
/**
|
||||
* Bring the state to show the public accounts page.
|
||||
*/
|
||||
@ -276,22 +285,26 @@ function prepareHeaders(username: string, password: string) {
|
||||
const headers = new Headers();
|
||||
headers.append(
|
||||
"Authorization",
|
||||
`Basic ${Buffer.from(`${username}:${password}`).toString("base64")}`,
|
||||
`Basic ${window.btoa(`${username}:${password}`)}`,
|
||||
);
|
||||
headers.append("Content-Type", "application/json");
|
||||
return headers;
|
||||
}
|
||||
|
||||
// Window can be mocked this way:
|
||||
// https://gist.github.com/theKashey/07090691c0a4680ed773375d8dbeebc1#file-webpack-conf-js
|
||||
// That allows the app to be pointed to a arbitrary
|
||||
// euFin backend when launched via "pnpm dev".
|
||||
const getRootPath = () => {
|
||||
const getBankBackendBaseUrl = () => {
|
||||
const overrideUrl = localStorage.getItem("bank-base-url");
|
||||
if (overrideUrl) {
|
||||
console.log(
|
||||
`using bank base URL ${overrideUrl} (override via bank-base-url localStorage)`,
|
||||
);
|
||||
return overrideUrl;
|
||||
}
|
||||
const maybeRootPath =
|
||||
typeof window !== undefined
|
||||
? window.location.origin + window.location.pathname
|
||||
: "/";
|
||||
if (!maybeRootPath.endsWith("/")) return `${maybeRootPath}/`;
|
||||
console.log(`using bank base URL (${maybeRootPath})`);
|
||||
return maybeRootPath;
|
||||
};
|
||||
|
||||
@ -785,7 +798,7 @@ async function loginCall(
|
||||
* let the Account component request the balance to check
|
||||
* whether the credentials are valid. */
|
||||
pageStateSetter((prevState) => ({ ...prevState, isLoggedIn: true }));
|
||||
let baseUrl = getRootPath();
|
||||
let baseUrl = getBankBackendBaseUrl();
|
||||
if (!baseUrl.endsWith("/")) baseUrl += "/";
|
||||
|
||||
backendStateSetter((prevState) => ({
|
||||
@ -813,7 +826,7 @@ async function registrationCall(
|
||||
backendStateSetter: StateUpdater<BackendStateTypeOpt>,
|
||||
pageStateSetter: StateUpdater<PageStateType>,
|
||||
) {
|
||||
let baseUrl = getRootPath();
|
||||
let baseUrl = getBankBackendBaseUrl();
|
||||
/**
|
||||
* If the base URL doesn't end with slash and the path
|
||||
* is not empty, then the concatenation made by URL()
|
||||
@ -873,19 +886,6 @@ async function registrationCall(
|
||||
* Functional components. *
|
||||
*************************/
|
||||
|
||||
function Currency(): VNode {
|
||||
const { data, error } = useSWR(
|
||||
`${getRootPath()}integration-api/config`,
|
||||
fetcher,
|
||||
);
|
||||
if (typeof error !== "undefined")
|
||||
return <b>error: currency could not be retrieved</b>;
|
||||
|
||||
if (typeof data === "undefined") return <Fragment>"..."</Fragment>;
|
||||
console.log("found bank config", data);
|
||||
return data.currency;
|
||||
}
|
||||
|
||||
function ErrorBanner(Props: any): VNode | null {
|
||||
const [pageState, pageStateSetter] = Props.pageState;
|
||||
const i18n = useTranslator();
|
||||
@ -2043,10 +2043,7 @@ function Account(Props: any): VNode {
|
||||
function SWRWithCredentials(props: any): VNode {
|
||||
const { username, password, backendUrl } = props;
|
||||
const headers = new Headers();
|
||||
headers.append(
|
||||
"Authorization",
|
||||
`Basic ${Buffer.from(`${username}:${password}`).toString("base64")}`,
|
||||
);
|
||||
headers.append("Authorization", `Basic ${btoa(`${username}:${password}`)}`);
|
||||
console.log("Likely backend base URL", backendUrl);
|
||||
return (
|
||||
<SWRConfig
|
||||
@ -2179,13 +2176,11 @@ function PublicHistories(Props: any): VNode {
|
||||
export function BankHome(): VNode {
|
||||
const [backendState, backendStateSetter] = useBackendState();
|
||||
const [pageState, pageStateSetter] = usePageState();
|
||||
const [accountState, accountStateSetter] = useAccountState();
|
||||
const setTxPageNumber = useTransactionPageNumber()[1];
|
||||
const i18n = useTranslator();
|
||||
|
||||
if (pageState.showPublicHistories)
|
||||
return (
|
||||
<SWRWithoutCredentials baseUrl={getRootPath()}>
|
||||
<SWRWithoutCredentials baseUrl={getBankBackendBaseUrl()}>
|
||||
<PageContext.Provider value={[pageState, pageStateSetter]}>
|
||||
<BankFrame>
|
||||
<PublicHistories pageStateSetter={pageStateSetter}>
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@ -1,52 +0,0 @@
|
||||
<!--
|
||||
This file is part of GNU Taler
|
||||
(C) 2021--2022 Taler Systems S.A.
|
||||
|
||||
GNU Taler is free software; you can redistribute it and/or modify it under the
|
||||
terms of the GNU General Public License as published by the Free Software
|
||||
Foundation; either version 3, or (at your option) any later version.
|
||||
|
||||
GNU Taler is distributed in the hope that it will be useful, but WITHOUT ANY
|
||||
WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR
|
||||
A PARTICULAR PURPOSE. See the GNU General Public License for more details.
|
||||
|
||||
You should have received a copy of the GNU General Public License along with
|
||||
GNU Taler; see the file COPYING. If not, see <http://www.gnu.org/licenses/>
|
||||
|
||||
@author Sebastian Javier Marchano
|
||||
-->
|
||||
<!DOCTYPE html>
|
||||
<html lang="en" class="has-aside-left has-aside-mobile-transition has-navbar-fixed-top has-aside-expanded">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title><%= htmlWebpackPlugin.options.title %></title>
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1">
|
||||
<meta name="mobile-web-app-capable" content="yes">
|
||||
<meta name="apple-mobile-web-app-capable" content="yes">
|
||||
|
||||
<link rel="icon" href="data:;base64,AAABAAEAEBAAAAEAIABoBAAAFgAAACgAAAAQAAAAIAAAAAEAIAAAAAAAAAQAABILAAASCwAAAAAAAAAAAAD///////////////////////////////////////////////////////////////////////////////////////////////////7//v38//78/P/+/fz//vz7///+/v/+/f3//vz7///+/v/+/fz//v38///////////////////////+/v3///7+/////////////////////////////////////////////////////////v3//v79///////+/v3///////r28v/ct5//06SG/9Gffv/Xqo7/7N/V/9e2nf/bsJb/6uDW/9Sskf/euKH/+/j2///////+/v3//////+3azv+/eE3/2rWd/9Kkhv/Vr5T/48i2/8J+VP/Qn3//3ryn/795Tf/WrpP/2LCW/8B6T//w4Nb///////Pn4P+/d0v/9u3n/+7d0v/EhV7//v///+HDr//fxLD/zph2/+TJt//8/Pv/woBX//Lm3f/y5dz/v3hN//bu6f/JjGn/4sW0///////Df1j/8OLZ//v6+P+/elH/+vj1//jy7f+/elL//////+zYzP/Eg13//////967p//MlHT/wn5X///////v4Nb/yY1s///////jw7H/06KG////////////z5t9/+fNvf//////x4pn//Pp4v/8+vn/w39X/8WEX///////5s/A/9CbfP//////27Oc/9y2n////////////9itlf/gu6f//////86Vdf/r2Mz//////8SCXP/Df1j//////+7d0v/KkG7//////+HBrf/VpYr////////////RnoH/5sq6///////Ii2n/8ubf//39/P/Cf1j/xohk/+bNvv//////wn5W//Tq4//58/D/wHxV//7+/f/59fH/v3xU//39/P/w4Nf/xIFb///////hw7H/yo9t/+/f1f/AeU3/+/n2/+nSxP/FhmD//////9qzm//Upon/4MSx/96+qf//////xINc/+3bz//48e3/v3hN//Pn3///////6M+//752S//gw6//06aK/8J+VP/kzLr/zZd1/8OCWv/q18r/17KZ/9Ooi//fv6r/v3dK/+vWyP///////v39///////27un/1aeK/9Opjv/m1cf/1KCC/9a0nP/n08T/0Jx8/82YdP/QnHz/16yR//jx7P///////v39///////+/f3///7+///////+//7//v7+///////+/v7//v/+/////////////////////////v7//v79///////////////////+/v/+/Pv//v39///+/v/+/Pv///7+//7+/f/+/Pv//v39//79/P/+/Pv///7+////////////AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA==" />
|
||||
<link rel="shortcut icon" href="data:image/x-icon;," type="image/x-icon" />
|
||||
|
||||
<% if (htmlWebpackPlugin.options.manifest.theme_color) { %>
|
||||
<meta name="theme-color" content="<%= htmlWebpackPlugin.options.manifest.theme_color %>">
|
||||
<% } %>
|
||||
|
||||
<% for (const index in htmlWebpackPlugin.files.css) { %>
|
||||
<% const file = htmlWebpackPlugin.files.css[index] %>
|
||||
<style data-href='<%= file %>' >
|
||||
<%= compilation.assets[file.substr(htmlWebpackPlugin.files.publicPath.length)].source() %>
|
||||
</style>
|
||||
<% } %>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<script>
|
||||
<%= compilation.assets[htmlWebpackPlugin.files.chunks["polyfills"].entry.substr(htmlWebpackPlugin.files.publicPath.length)].source() %>
|
||||
</script>
|
||||
<script>
|
||||
<%= compilation.assets[htmlWebpackPlugin.files.chunks["bundle"].entry.substr(htmlWebpackPlugin.files.publicPath.length)].source() %>
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
12
packages/demobank-ui/static/index.html
Normal file
12
packages/demobank-ui/static/index.html
Normal file
@ -0,0 +1,12 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
|
||||
<title>Demobank</title>
|
||||
<script type="module" src="index.js"></script>
|
||||
<link rel="stylesheet" href="index.css" />
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,21 +0,0 @@
|
||||
// Mock Browser API's which are not supported by JSDOM, e.g. ServiceWorker, LocalStorage
|
||||
/**
|
||||
* An example how to mock localStorage is given below 👇
|
||||
*/
|
||||
|
||||
/*
|
||||
// Mocks localStorage
|
||||
const localStorageMock = (function() {
|
||||
let store = {};
|
||||
|
||||
return {
|
||||
getItem: (key) => store[key] || null,
|
||||
setItem: (key, value) => store[key] = value.toString(),
|
||||
clear: () => store = {}
|
||||
};
|
||||
|
||||
})();
|
||||
|
||||
Object.defineProperty(window, 'localStorage', {
|
||||
value: localStorageMock
|
||||
}); */
|
||||
@ -1,3 +0,0 @@
|
||||
// This fixed an error related to the CSS and loading gif breaking my Jest test
|
||||
// See https://facebook.github.io/jest/docs/en/webpack.html#handling-static-assets
|
||||
export default 'test-file-stub';
|
||||
@ -1,6 +0,0 @@
|
||||
import { configure } from 'enzyme';
|
||||
import Adapter from 'enzyme-adapter-preact-pure';
|
||||
|
||||
configure({
|
||||
adapter: new Adapter() as any
|
||||
});
|
||||
@ -1,466 +0,0 @@
|
||||
import "core-js/stable";
|
||||
import "regenerator-runtime/runtime";
|
||||
import "@testing-library/jest-dom";
|
||||
import { BankHome } from '../../src/pages/home';
|
||||
import { h } from 'preact';
|
||||
import { waitFor, cleanup, render, fireEvent, screen } from '@testing-library/preact';
|
||||
import expect from 'expect';
|
||||
import fetchMock from "jest-fetch-mock";
|
||||
|
||||
/**
|
||||
* This mock makes the translator always return the
|
||||
* english string. It didn't work within the 'beforeAll'
|
||||
* function...
|
||||
*/
|
||||
jest.mock("../../src/i18n")
|
||||
const i18n = require("../../src/i18n")
|
||||
i18n.useTranslator.mockImplementation(() => function(arg) {return arg})
|
||||
|
||||
beforeAll(() => {
|
||||
Object.defineProperty(window, 'location', {
|
||||
value: {
|
||||
origin: "http://localhost",
|
||||
pathname: "/demobanks/default"
|
||||
}
|
||||
})
|
||||
global.Storage.prototype.setItem = jest.fn((key, value) => {})
|
||||
})
|
||||
|
||||
function fillCredentialsForm() {
|
||||
const username = Math.random().toString().substring(2);
|
||||
const u = screen.getByPlaceholderText("username");
|
||||
const p = screen.getByPlaceholderText("password");
|
||||
fireEvent.input(u, {target: {value: username}})
|
||||
fireEvent.input(p, {target: {value: "bar"}})
|
||||
const signinButton = screen.getByText("Login");
|
||||
return {
|
||||
username: username,
|
||||
signinButton: signinButton
|
||||
};
|
||||
}
|
||||
fetchMock.enableMocks();
|
||||
|
||||
function mockSuccessLoginOrRegistration() {
|
||||
fetch.once("{}", {
|
||||
status: 200
|
||||
}).once(JSON.stringify({
|
||||
balance: {
|
||||
amount: "EUR:10",
|
||||
credit_debit_indicator: "credit"
|
||||
},
|
||||
paytoUri: "payto://iban/123/ABC"
|
||||
}))
|
||||
}
|
||||
|
||||
/**
|
||||
* Render homepage -> navigate to register page -> submit registration.
|
||||
* 'webMock' is called before submission to mock the server response
|
||||
*/
|
||||
function signUp(context, webMock) {
|
||||
render(<BankHome />);
|
||||
const registerPage = screen.getByText("Register!");
|
||||
fireEvent.click(registerPage);
|
||||
const username = Math.random().toString().substring(2);
|
||||
const u = screen.getByPlaceholderText("username");
|
||||
const p = screen.getByPlaceholderText("password");
|
||||
fireEvent.input(u, {target: {value: username}})
|
||||
fireEvent.input(p, {target: {value: "bar"}})
|
||||
const registerButton = screen.getByText("Register");
|
||||
webMock();
|
||||
fireEvent.click(registerButton);
|
||||
context.username = username;
|
||||
return context;
|
||||
}
|
||||
|
||||
describe("wire transfer", () => {
|
||||
beforeEach(() => {
|
||||
signUp({}, mockSuccessLoginOrRegistration); // context unused
|
||||
})
|
||||
test("Wire transfer success", async () => {
|
||||
const transferButton = screen.getByText("Create wire transfer");
|
||||
const payto = screen.getByPlaceholderText("payto address");
|
||||
fireEvent.input(payto, {target: {value: "payto://only-checked-by-the-backend!"}})
|
||||
fetch.once("{}"); // 200 OK
|
||||
fireEvent.click(transferButton);
|
||||
await screen.findByText("wire transfer created", {exact: false})
|
||||
})
|
||||
test("Wire transfer fail", async () => {
|
||||
const transferButton = screen.getByText("Create wire transfer");
|
||||
const payto = screen.getByPlaceholderText("payto address");
|
||||
fireEvent.input(payto, {target: {value: "payto://only-checked-by-the-backend!"}})
|
||||
fetch.once("{}", {status: 400});
|
||||
fireEvent.click(transferButton);
|
||||
// assert this below does NOT appear.
|
||||
await waitFor(() => expect(
|
||||
screen.queryByText("wire transfer created", {exact: false})).not.toBeInTheDocument());
|
||||
})
|
||||
})
|
||||
|
||||
describe("withdraw", () => {
|
||||
afterEach(() => {
|
||||
fetch.resetMocks();
|
||||
cleanup();
|
||||
})
|
||||
|
||||
|
||||
let context = {};
|
||||
// Register and land on the profile page.
|
||||
beforeEach(() => {
|
||||
context = signUp(context, mockSuccessLoginOrRegistration);
|
||||
})
|
||||
|
||||
test("network failure before withdrawal creation", async () => {
|
||||
const a = screen.getAllByPlaceholderText("amount")[0];
|
||||
fireEvent.input(a, {target: {value: "10"}});
|
||||
let withdrawButton = screen.getByText("Charge Taler wallet");
|
||||
// mock network failure.
|
||||
fetch.mockReject("API is down");
|
||||
fireEvent.click(withdrawButton);
|
||||
await screen.findByText("could not create withdrawal operation", {exact: false})
|
||||
})
|
||||
|
||||
test("HTTP response error upon withdrawal creation", async () => {
|
||||
const a = screen.getAllByPlaceholderText("amount")[0];
|
||||
fireEvent.input(a, {target: {value: "10,0"}});
|
||||
let withdrawButton = screen.getByText("Charge Taler wallet");
|
||||
fetch.once("{}", {status: 404});
|
||||
fireEvent.click(withdrawButton);
|
||||
await screen.findByText("gave response error", {exact: false})
|
||||
})
|
||||
|
||||
test("Abort withdrawal", async () => {
|
||||
const a = screen.getAllByPlaceholderText("amount")[0];
|
||||
fireEvent.input(a, {target: {value: "10,0"}});
|
||||
let withdrawButton = screen.getByText("Charge Taler wallet");
|
||||
fetch.once(JSON.stringify({
|
||||
taler_withdraw_uri: "taler://withdraw/foo",
|
||||
withdrawal_id: "foo"
|
||||
}));
|
||||
/**
|
||||
* After triggering a withdrawal, check if the taler://withdraw URI
|
||||
* rendered, and confirm if so. Lastly, check that a success message
|
||||
* appeared on the screen.
|
||||
*/
|
||||
fireEvent.click(withdrawButton);
|
||||
const abortButton = await screen.findByText("abort withdrawal", {exact: false})
|
||||
fireEvent.click(abortButton);
|
||||
expect(fetch).toHaveBeenLastCalledWith(
|
||||
`http://localhost/demobanks/default/access-api/accounts/${context.username}/withdrawals/foo/abort`,
|
||||
expect.anything()
|
||||
)
|
||||
await waitFor(() => expect(
|
||||
screen.queryByText("abort withdrawal", {exact: false})).not.toBeInTheDocument());
|
||||
})
|
||||
|
||||
test("Successful withdrawal creation and confirmation", async () => {
|
||||
const a = screen.getAllByPlaceholderText("amount")[0];
|
||||
fireEvent.input(a, {target: {value: "10,0"}});
|
||||
let withdrawButton = await screen.findByText("Charge Taler wallet");
|
||||
fetch.once(JSON.stringify({
|
||||
taler_withdraw_uri: "taler://withdraw/foo",
|
||||
withdrawal_id: "foo"
|
||||
}));
|
||||
/**
|
||||
* After triggering a withdrawal, check if the taler://withdraw URI
|
||||
* rendered, and confirm if so. Lastly, check that a success message
|
||||
* appeared on the screen. */
|
||||
fireEvent.click(withdrawButton);
|
||||
expect(fetch).toHaveBeenCalledWith(
|
||||
`http://localhost/demobanks/default/access-api/accounts/${context.username}/withdrawals`,
|
||||
expect.objectContaining({body: JSON.stringify({amount: "EUR:10.0"})})
|
||||
)
|
||||
// assume wallet POSTed the payment details.
|
||||
const confirmButton = await screen.findByText("confirm withdrawal", {exact: false})
|
||||
/**
|
||||
* Not expecting a new withdrawal possibility while one is being processed.
|
||||
*/
|
||||
await waitFor(() => expect(
|
||||
screen.queryByText("charge taler wallet", {exact: false})).not.toBeInTheDocument());
|
||||
fetch.once("{}")
|
||||
// Confirm currently processed withdrawal.
|
||||
fireEvent.click(confirmButton);
|
||||
/**
|
||||
* After having confirmed above, wait that the
|
||||
* pre-withdrawal elements disappears and a success
|
||||
* message appears.
|
||||
*/
|
||||
await waitFor(() => expect(
|
||||
screen.queryByText(
|
||||
"confirm withdrawal",
|
||||
{exact: false})).not.toBeInTheDocument()
|
||||
);
|
||||
await waitFor(() => expect(
|
||||
screen.queryByText(
|
||||
"give this address to the taler wallet",
|
||||
{exact: false})).not.toBeInTheDocument()
|
||||
);
|
||||
expect(fetch).toHaveBeenLastCalledWith(
|
||||
`http://localhost/demobanks/default/access-api/accounts/${context.username}/withdrawals/foo/confirm`,
|
||||
expect.anything())
|
||||
// success message
|
||||
await screen.findByText("withdrawal confirmed", {exact: false})
|
||||
|
||||
/**
|
||||
* Click on a "return to homepage / close" button, and
|
||||
* check that the withdrawal confirmation is gone, and
|
||||
* the option to withdraw again reappeared.
|
||||
*/
|
||||
const closeButton = await screen.findByText("close", {exact: false})
|
||||
fireEvent.click(closeButton);
|
||||
|
||||
/**
|
||||
* After closing the operation, the confirmation message is not expected.
|
||||
*/
|
||||
await waitFor(() => expect(
|
||||
screen.queryByText("withdrawal confirmed", {exact: false})).not.toBeInTheDocument()
|
||||
);
|
||||
|
||||
/**
|
||||
* After closing the operation, the possibility to withdraw again should be offered.
|
||||
*/
|
||||
await waitFor(() => expect(
|
||||
screen.queryByText(
|
||||
"charge taler wallet",
|
||||
{exact: false})).toBeInTheDocument()
|
||||
);
|
||||
})
|
||||
})
|
||||
|
||||
describe("home page", () => {
|
||||
afterEach(() => {
|
||||
fetch.resetMocks();
|
||||
cleanup();
|
||||
})
|
||||
test("public histories", async () => {
|
||||
render(<BankHome />);
|
||||
/**
|
||||
* Mock list of public accounts. 'bar' is
|
||||
* the shown account, since it occupies the last
|
||||
* position (and SPA picks it via the 'pop()' method) */
|
||||
fetch.once(JSON.stringify({
|
||||
"publicAccounts" : [ {
|
||||
"balance" : "EUR:1",
|
||||
"iban" : "XXX",
|
||||
"accountLabel" : "foo"
|
||||
}, {
|
||||
"balance" : "EUR:2",
|
||||
"iban" : "YYY",
|
||||
"accountLabel" : "bar"
|
||||
}]
|
||||
})).once(JSON.stringify({
|
||||
transactions: [{
|
||||
debtorIban: "XXX",
|
||||
debtorBic: "YYY",
|
||||
debtorName: "Foo",
|
||||
creditorIban: "AAA",
|
||||
creditorBic: "BBB",
|
||||
creditorName: "Bar",
|
||||
direction: "DBIT",
|
||||
amount: "EUR:5",
|
||||
subject: "Reimbursement",
|
||||
date: "1970-01-01"
|
||||
}, {
|
||||
debtorIban: "XXX",
|
||||
debtorBic: "YYY",
|
||||
debtorName: "Foo",
|
||||
creditorIban: "AAA",
|
||||
creditorBic: "BBB",
|
||||
creditorName: "Bar",
|
||||
direction: "CRDT",
|
||||
amount: "EUR:5",
|
||||
subject: "Bonus",
|
||||
date: "2000-01-01"
|
||||
}]
|
||||
})).once(JSON.stringify({
|
||||
transactions: [{
|
||||
debtorIban: "XXX",
|
||||
debtorBic: "YYY",
|
||||
debtorName: "Foo",
|
||||
creditorIban: "AAA",
|
||||
creditorBic: "BBB",
|
||||
creditorName: "Bar",
|
||||
direction: "DBIT",
|
||||
amount: "EUR:5",
|
||||
subject: "Donation",
|
||||
date: "1970-01-01"
|
||||
}, {
|
||||
debtorIban: "XXX",
|
||||
debtorBic: "YYY",
|
||||
debtorName: "Foo",
|
||||
creditorIban: "AAA",
|
||||
creditorBic: "BBB",
|
||||
creditorName: "Bar",
|
||||
direction: "CRDT",
|
||||
amount: "EUR:5",
|
||||
subject: "Refund",
|
||||
date: "2000-01-01"
|
||||
}]
|
||||
}))
|
||||
|
||||
// Navigate to dedicate public histories page.
|
||||
const publicTxsPage = screen.getByText("transactions");
|
||||
fireEvent.click(publicTxsPage);
|
||||
|
||||
/**
|
||||
* Check that transactions data appears on the page.
|
||||
*/
|
||||
await screen.findByText("reimbursement", {exact: false});
|
||||
await screen.findByText("bonus", {exact: false});
|
||||
/**
|
||||
* The transactions below should not appear, because only
|
||||
* one public account renders.
|
||||
*/
|
||||
await waitFor(() => expect(
|
||||
screen.queryByText("refund", {exact: false})).not.toBeInTheDocument());
|
||||
await waitFor(() => expect(
|
||||
screen.queryByText("donation", {exact: false})).not.toBeInTheDocument());
|
||||
/**
|
||||
* First HTTP mock:
|
||||
*/
|
||||
await expect(fetch).toHaveBeenCalledWith(
|
||||
"http://localhost/demobanks/default/access-api/public-accounts"
|
||||
)
|
||||
/**
|
||||
* Only expecting this request (second mock), as SWR doesn't let
|
||||
* the unshown history request to the backend:
|
||||
*/
|
||||
await expect(fetch).toHaveBeenCalledWith(
|
||||
"http://localhost/demobanks/default/access-api/accounts/bar/transactions?page=0"
|
||||
)
|
||||
/**
|
||||
* Switch tab:
|
||||
*/
|
||||
let fooTab = await screen.findByText("foo", {exact: false});
|
||||
fireEvent.click(fooTab);
|
||||
/**
|
||||
* Last two HTTP mocks should render now:
|
||||
*/
|
||||
await screen.findByText("refund", {exact: false});
|
||||
await screen.findByText("donation", {exact: false});
|
||||
|
||||
// Expect SWR to have requested 'foo' history
|
||||
// (consuming the last HTTP mock):
|
||||
await expect(fetch).toHaveBeenCalledWith(
|
||||
"http://localhost/demobanks/default/access-api/accounts/foo/transactions?page=0"
|
||||
)
|
||||
let backButton = await screen.findByText("Go back", {exact: false});
|
||||
fireEvent.click(backButton);
|
||||
await waitFor(() => expect(
|
||||
screen.queryByText("donation", {exact: false})).not.toBeInTheDocument());
|
||||
await screen.findByText("welcome to eufin bank", {exact: false})
|
||||
})
|
||||
|
||||
// check page informs about the current balance
|
||||
// after a successful registration.
|
||||
|
||||
test("new registration response error 404", async () => {
|
||||
var context = signUp({}, () => fetch.mockResponseOnce("Not found", {status: 404}));
|
||||
await screen.findByText("has a problem", {exact: false});
|
||||
expect(fetch).toHaveBeenCalledWith(
|
||||
"http://localhost/demobanks/default/access-api/testing/register",
|
||||
expect.objectContaining(
|
||||
{body: JSON.stringify({username: context.username, password: "bar"}), method: "POST"},
|
||||
))
|
||||
})
|
||||
|
||||
test("registration network failure", async () => {
|
||||
let context = signUp({}, ()=>fetch.mockReject("API is down"));
|
||||
await screen.findByText("has a problem", {exact: false});
|
||||
expect(fetch).toHaveBeenCalledWith(
|
||||
"http://localhost/demobanks/default/access-api/testing/register",
|
||||
expect.objectContaining(
|
||||
{body: JSON.stringify({username: context.username, password: "bar"}), method: "POST"}
|
||||
))
|
||||
})
|
||||
|
||||
test("login non existent user", async () => {
|
||||
render(<BankHome />);
|
||||
const { username, signinButton } = fillCredentialsForm();
|
||||
fetch.once("{}", {status: 404});
|
||||
fireEvent.click(signinButton);
|
||||
await screen.findByText("username or account label not found", {exact: false})
|
||||
})
|
||||
test("login wrong credentials", async () => {
|
||||
render(<BankHome />);
|
||||
const { username, signinButton } = fillCredentialsForm();
|
||||
fetch.once("{}", {status: 401});
|
||||
fireEvent.click(signinButton);
|
||||
await screen.findByText("wrong credentials given", {exact: false})
|
||||
})
|
||||
|
||||
/**
|
||||
* Test that balance and last transactions get shown
|
||||
* after a successful login.
|
||||
*/
|
||||
test("login success", async () => {
|
||||
render(<BankHome />);
|
||||
const { username, signinButton } = fillCredentialsForm();
|
||||
|
||||
// Response to balance request.
|
||||
fetch.once(JSON.stringify({
|
||||
balance: {
|
||||
amount: "EUR:10",
|
||||
credit_debit_indicator: "credit"
|
||||
},
|
||||
paytoUri: "payto://iban/123/ABC"
|
||||
})).once(JSON.stringify({ // Response to history request.
|
||||
transactions: [{
|
||||
debtorIban: "XXX",
|
||||
debtorBic: "YYY",
|
||||
debtorName: "Foo",
|
||||
creditorIban: "AAA",
|
||||
creditorBic: "BBB",
|
||||
creditorName: "Bar",
|
||||
direction: "DBIT",
|
||||
amount: "EUR:5",
|
||||
subject: "Donation",
|
||||
date: "01-01-1970"
|
||||
}, {
|
||||
debtorIban: "XXX",
|
||||
debtorBic: "YYY",
|
||||
debtorName: "Foo",
|
||||
creditorIban: "AAA",
|
||||
creditorBic: "BBB",
|
||||
creditorName: "Bar",
|
||||
direction: "CRDT",
|
||||
amount: "EUR:5",
|
||||
subject: "Refund",
|
||||
date: "01-01-2000"
|
||||
}]
|
||||
}))
|
||||
fireEvent.click(signinButton);
|
||||
expect(fetch).toHaveBeenCalledWith(
|
||||
`http://localhost/demobanks/default/access-api/accounts/${username}`,
|
||||
expect.anything()
|
||||
)
|
||||
await screen.findByText("balance is 10 EUR", {exact: false})
|
||||
// The two transactions in the history mocked above.
|
||||
await screen.findByText("refund", {exact: false})
|
||||
await screen.findByText("donation", {exact: false})
|
||||
expect(fetch).toHaveBeenCalledWith(
|
||||
`http://localhost/demobanks/default/access-api/accounts/${username}/transactions?page=0`,
|
||||
expect.anything()
|
||||
)
|
||||
})
|
||||
|
||||
test("registration success", async () => {
|
||||
let context = signUp({}, mockSuccessLoginOrRegistration);
|
||||
/**
|
||||
* Tests that a balance is shown after the successful
|
||||
* registration.
|
||||
*/
|
||||
await screen.findByText("balance is 10 EUR", {exact: false})
|
||||
/**
|
||||
* The expectation below tests whether the account
|
||||
* balance was requested after the successful registration.
|
||||
*/
|
||||
expect(fetch).toHaveBeenCalledWith(
|
||||
"http://localhost/demobanks/default/access-api/testing/register",
|
||||
expect.anything() // no need to match auth headers.
|
||||
)
|
||||
expect(fetch).toHaveBeenCalledWith(
|
||||
`http://localhost/demobanks/default/access-api/accounts/${context.username}`,
|
||||
expect.anything() // no need to match auth headers.
|
||||
)
|
||||
})
|
||||
})
|
||||
3
packages/demobank-ui/tests/declarations.d.ts
vendored
3
packages/demobank-ui/tests/declarations.d.ts
vendored
@ -1,3 +0,0 @@
|
||||
// Enable enzyme adapter's integration with TypeScript
|
||||
// See: https://github.com/preactjs/enzyme-adapter-preact-pure#usage-with-typescript
|
||||
/// <reference types="enzyme-adapter-preact-pure" />
|
||||
@ -1,19 +1,13 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
/* Basic Options */
|
||||
"target": "ES5" /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', or 'ESNEXT'. */,
|
||||
"module": "ESNext" /* Specify module code generation: 'none', commonjs', 'amd', 'system', 'umd', 'es2015', or 'ESNext'. */,
|
||||
// "lib": [], /* Specify library files to be included in the compilation: */
|
||||
"target": "ES5",
|
||||
"module": "ES6",
|
||||
"lib": ["DOM", "ES2016"],
|
||||
"allowJs": true /* Allow javascript files to be compiled. */,
|
||||
// "checkJs": true, /* Report errors in .js files. */
|
||||
"jsx": "react" /* Specify JSX code generation: 'preserve', 'react-native', or 'react'. */,
|
||||
"jsxFactory": "h" /* Specify the JSX factory function to use when targeting react JSX emit, e.g. React.createElement or h. */,
|
||||
// "declaration": true, /* Generates corresponding '.d.ts' file. */
|
||||
// "sourceMap": true, /* Generates corresponding '.map' file. */
|
||||
// "outFile": "./", /* Concatenate and emit output to single file. */
|
||||
// "outDir": "./", /* Redirect output structure to the directory. */
|
||||
// "rootDir": "./", /* Specify the root directory of input files. Use to control the output directory structure with --outDir. */
|
||||
// "removeComments": true, /* Do not emit comments to output. */
|
||||
"jsx": "react-jsx" /* Specify JSX code generation: 'preserve', 'react-native', or 'react'. */,
|
||||
"jsxImportSource": "preact",
|
||||
"noEmit": true /* Do not emit outputs. */,
|
||||
// "importHelpers": true, /* Import emit helpers from 'tslib'. */
|
||||
// "downlevelIteration": true, /* Provide full support for iterables in 'for-of', spread, and destructuring when targeting 'ES5' or 'ES3'. */
|
||||
@ -21,11 +15,7 @@
|
||||
|
||||
/* Strict Type-Checking Options */
|
||||
"strict": true /* Enable all strict type-checking options. */,
|
||||
// "noImplicitAny": true, /* Raise error on expressions and declarations with an implied 'any' type. */
|
||||
// "strictNullChecks": true, /* Enable strict null checks. */
|
||||
// "noImplicitThis": true, /* Raise error on 'this' expressions with an implied 'any' type. */
|
||||
// "alwaysStrict": true, /* Parse in strict mode and emit "use strict" for each source file. */
|
||||
|
||||
"noImplicitAny": true /* Raise error on expressions and declarations with an implied 'any' type. */,
|
||||
/* Additional Checks */
|
||||
// "noUnusedLocals": true, /* Report errors on unused locals. */
|
||||
// "noUnusedParameters": true, /* Report errors on unused parameters. */
|
||||
@ -33,14 +23,14 @@
|
||||
// "noFallthroughCasesInSwitch": true, /* Report errors for fallthrough cases in switch statement. */
|
||||
|
||||
/* Module Resolution Options */
|
||||
"moduleResolution": "node" /* Specify module resolution strategy: 'node' (Node.js) or 'classic' (TypeScript pre-1.6). */,
|
||||
"moduleResolution": "Node" /* Specify module resolution strategy: 'node' (Node.js) or 'classic' (TypeScript pre-1.6). */,
|
||||
"esModuleInterop": true /* */,
|
||||
// "baseUrl": "./", /* Base directory to resolve non-absolute module names. */
|
||||
// "paths": {}, /* A series of entries which re-map imports to lookup locations relative to the 'baseUrl'. */
|
||||
// "rootDirs": [], /* List of root folders whose combined content represents the structure of the project at runtime. */
|
||||
// "typeRoots": [], /* List of folders to include type definitions from. */
|
||||
// "types": [], /* Type declaration files to be included in compilation. */
|
||||
// "allowSyntheticDefaultImports": true, /* Allow default imports from modules with no default export. This does not affect code emit, just typechecking. */
|
||||
"allowSyntheticDefaultImports": true /* Allow default imports from modules with no default export. This does not affect code emit, just typechecking. */,
|
||||
// "preserveSymlinks": true, /* Do not resolve the real path of symlinks. */
|
||||
|
||||
/* Source Map Options */
|
||||
@ -56,5 +46,5 @@
|
||||
/* Advanced Options */
|
||||
"skipLibCheck": true /* Skip type checking of declaration files. */
|
||||
},
|
||||
"include": ["src/**/*", "tests/**/*"]
|
||||
"include": ["src/**/*"]
|
||||
}
|
||||
|
||||
5501
pnpm-lock.yaml
5501
pnpm-lock.yaml
File diff suppressed because it is too large
Load Diff
Loading…
Reference in New Issue
Block a user