test: fix smoke test

.github/workflows/release.yml

@@ -19,7 +19,7 @@ jobs:
 
       - uses: actions/setup-node@v2
         with:
-          node-version: 14.x
+          node-version: 16.x
 
       - id: yarn-cache-dir-path
         run: echo "::set-output name=dir::$(yarn cache dir)"

dev-chain/spec.json

@@ -10,7 +10,7 @@
     "accountStartNonce": "0x0",
     "maximumExtraDataSize": "0x20",
     "minGasLimit": "0x1388",
-    "networkID": "0x11",
+    "networkID": "0x539",
     "registrar": "0x0000000000000000000000000000000000001337",
     "eip150Transition": "0x0",
     "eip160Transition": "0x0",

packages/dev-frontend/package.json

@@ -17,10 +17,10 @@
     "connectkit": "^1.3.0",
     "ethers": "5.7.2",
     "lambert-w-function": "3.0.0",
-    "react": "17.0.1",
+    "react": "17.0.2",
     "react-circular-progressbar": "2.0.3",
     "react-copy-to-clipboard": "5.0.3",
-    "react-dom": "17.0.1",
+    "react-dom": "17.0.2",
     "react-modal": "^3.15.1",
     "react-router-dom": "5.2.0",
     "recharts": "2.1.10",
@@ -61,7 +61,7 @@
   "scripts": {
     "analyze": "source-map-explorer 'build/static/js/*.js'",
     "start": "vite",
-    "start-demo": "cross-env REACT_APP_DEMO_MODE=true run-s start",
+    "start-demo": "cross-env VITE_APP_DEMO_MODE=true vite --force",
     "build": "run-s 'build:*'",
     "build:set-version": "node scripts/set-version.cjs",
     "build:tsc": "tsc",

packages/dev-frontend/scripts/set-version.cjs

@@ -1,7 +1,7 @@
 const { execSync } = require("child_process");
 const { existsSync, readFileSync, writeFileSync } = require("fs");
 
-const envVar = "REACT_APP_VERSION";
+const envVar = "VITE_APP_VERSION";
 const envVarPattern = new RegExp(`^${envVar}=.*`);
 
 const getCommitHash = () => {

packages/dev-frontend/src/App.test.tsx

@@ -13,16 +13,17 @@ const trove = Trove.create(params);
 test("there's no smoke", async () => {
   const { getByText, getByLabelText, findByText } = render(<App />);
 
+  fireEvent.click(await findByText(/connect wallet/i));
+  fireEvent.click(getByText(/browser wallet/i));
+
   expect(await findByText(/you can borrow lusd by opening a trove/i)).toBeInTheDocument();
 
   fireEvent.click(getByText(/open trove/i));
   fireEvent.click(getByLabelText(/collateral/i));
   fireEvent.change(getByLabelText(/^collateral$/i), { target: { value: `${trove.collateral}` } });
   fireEvent.click(getByLabelText(/^borrow$/i));
   fireEvent.change(getByLabelText(/^borrow$/i), { target: { value: `${trove.debt}` } });
-
-  const confirmButton = await findByText(/confirm/i);
-  fireEvent.click(confirmButton);
+  fireEvent.click(await findByText(/confirm/i));
 
   expect(await findByText(/adjust/i)).toBeInTheDocument();
 });

packages/dev-frontend/src/App.tsx

@@ -1,6 +1,6 @@
 import React from "react";
 import { createClient, WagmiConfig } from "wagmi";
-import { mainnet, goerli } from "wagmi/chains";
+import { mainnet, goerli, localhost } from "wagmi/chains";
 import { ConnectKitProvider, getDefaultClient } from "connectkit";
 import { Flex, Heading, ThemeProvider, Paragraph, Link } from "theme-ui";
 
@@ -17,9 +17,11 @@ import { LiquityFrontend } from "./LiquityFrontend";
 import { AppLoader } from "./components/AppLoader";
 import { useAsyncValue } from "./hooks/AsyncValue";
 
-if (import.meta.env.REACT_APP_DEMO_MODE === "true") {
+const isDemoMode = import.meta.env.VITE_APP_DEMO_MODE === "true";
+
+if (isDemoMode) {
   const ethereum = new DisposableWalletProvider(
-    import.meta.env.REACT_APP_RPC_URL || `http://${window.location.hostname}:8545`,
+    import.meta.env.VITE_APP_RPC_URL || `http://${window.location.hostname || "localhost"}:8545`,
     "0x4d5db4107d237df6a3d58ee5f70ae63d73d7658d4026f2eefd2f204c81682cb7"
   );
 
@@ -70,9 +72,9 @@ const UnsupportedNetworkFallback: React.FC = () => (
     }}
   >
     <Heading sx={{ mb: 3 }}>
-      <Icon name="exclamation-triangle" /> Liquity is not deployed to this network.
+      <Icon name="exclamation-triangle" /> Liquity is not supported on this network.
     </Heading>
-    Please switch to Ropsten, Rinkeby, Kovan, Görli or Kiln.
+    Please switch to mainnet or Görli.
   </Flex>
 );
 
@@ -87,7 +89,12 @@ const App = () => {
           client={createClient(
             getDefaultClient({
               appName: "Liquity",
-              chains: config.value.testnetOnly ? [goerli] : [mainnet, goerli],
+              chains:
+                isDemoMode || import.meta.env.MODE === "test"
+                  ? [localhost]
+                  : config.value.testnetOnly
+                  ? [goerli]
+                  : [mainnet, goerli],
               walletConnectProjectId: config.value.walletConnectProjectId,
               infuraId: config.value.infuraApiKey,
               alchemyId: config.value.alchemyApiKey

packages/dev-frontend/src/components/SystemStats.tsx

@@ -130,7 +130,7 @@ export const SystemStats: React.FC<SystemStatsProps> = ({ variant = "info", show
           {import.meta.env.DEV ? (
             "development"
           ) : (
-            <GitHubCommit>{import.meta.env.REACT_APP_VERSION}</GitHubCommit>
+            <GitHubCommit>{import.meta.env.VITE_APP_VERSION}</GitHubCommit>
           )}
         </Box>
       </Box>

packages/dev-frontend/src/hooks/LiquityContext.tsx

@@ -93,7 +93,7 @@ export const LiquityProvider: React.FC<LiquityProviderProps> = ({
     }
   }, [config, connection]);
 
-  if (!config || !account.address || !connection) {
+  if (!config || !account.address) {
     return <>{loader}</>;
   }
 

packages/dev-frontend/src/setupTests.ts

@@ -19,9 +19,4 @@ const ethereum = new DisposableWalletProvider(
 // Let web3-react's InjectedConnector find our DisposableWalletProvider
 Object.assign(window, { ethereum });
 
-// Object.fromEntries = <T = any>(
-//   entries: Iterable<readonly [PropertyKey, T]>
-// ): { [k in PropertyKey]: T } =>
-//   Object.assign({}, ...Array.from(entries).map(([k, v]) => ({ [k]: v })));
-
 window.fetch = fetch as typeof window.fetch; // node-fetch is not perfectly compliant...

packages/dev-frontend/vite.config.ts

@@ -36,7 +36,13 @@ export default defineConfig({
   test: {
     globals: true,
     environment: "jsdom",
-    setupFiles: "./src/setupTests.ts"
+    setupFiles: "./src/setupTests.ts",
+    deps: {
+      inline: ["connectkit"] // fixes import of "react/jsx-runtime"
+    },
+    testTimeout: 10000,
+    // the WalletConnect connector of wagmi throws "EthereumProvider.init is not a function" ???
+    dangerouslyIgnoreUnhandledErrors: true
   },
   server: {
     cors: false

packages/lib-react/package.json

@@ -33,7 +33,7 @@
     "eslint-plugin-react": "7.22.0",
     "eslint-plugin-react-hooks": "4.2.0",
     "npm-run-all": "4.1.5",
-    "react": "17.0.1",
+    "react": "17.0.2",
     "typescript": "4.1.5"
   }
 }

scripts/start-local-tunnel.sh

@@ -58,4 +58,4 @@ fi
 
 
 # Start frontend with configured RPC URL
-PORT=32318 BROWSER=none REACT_APP_RPC_URL="$NGROK_RPC_URL" yarn workspace @liquity/dev-frontend start-demo >/dev/null &
+PORT=32318 BROWSER=none VITE_APP_RPC_URL="$NGROK_RPC_URL" yarn workspace @liquity/dev-frontend start-demo >/dev/null &

yarn.lock

@@ -1780,10 +1780,10 @@ __metadata:
     lambert-w-function: 3.0.0
     node-fetch: ^3.3.1
     npm-run-all: 4.1.5
-    react: 17.0.1
+    react: 17.0.2
     react-circular-progressbar: 2.0.3
     react-copy-to-clipboard: 5.0.3
-    react-dom: 17.0.1
+    react-dom: 17.0.2
     react-modal: ^3.15.1
     react-router-dom: 5.2.0
     recharts: 2.1.10
@@ -1888,7 +1888,7 @@ __metadata:
     eslint-plugin-react: 7.22.0
     eslint-plugin-react-hooks: 4.2.0
     npm-run-all: 4.1.5
-    react: 17.0.1
+    react: 17.0.2
     typescript: 4.1.5
   peerDependencies:
     "@liquity/lib-base": ^3.0.0
@@ -18811,16 +18811,16 @@ __metadata:
   languageName: node
   linkType: hard
 
-"react-dom@npm:17.0.1":
-  version: 17.0.1
-  resolution: "react-dom@npm:17.0.1"
+"react-dom@npm:17.0.2":
+  version: 17.0.2
+  resolution: "react-dom@npm:17.0.2"
   dependencies:
     loose-envify: ^1.1.0
     object-assign: ^4.1.1
-    scheduler: ^0.20.1
+    scheduler: ^0.20.2
   peerDependencies:
-    react: 17.0.1
-  checksum: df2af300dd4f49a5daaccc38f5a307def2a9ae2b7ebffa3dce8fb9986129057696b86a2c94e5ae36133057c69428c500e4ee3bf5884eb44e5632ace8b7ace41f
+    react: 17.0.2
+  checksum: 1c1eaa3bca7c7228d24b70932e3d7c99e70d1d04e13bb0843bbf321582bc25d7961d6b8a6978a58a598af2af496d1cedcfb1bf65f6b0960a0a8161cb8dab743c
   languageName: node
   linkType: hard
 
@@ -18963,13 +18963,13 @@ __metadata:
   languageName: node
   linkType: hard
 
-"react@npm:17.0.1":
-  version: 17.0.1
-  resolution: "react@npm:17.0.1"
+"react@npm:17.0.2":
+  version: 17.0.2
+  resolution: "react@npm:17.0.2"
   dependencies:
     loose-envify: ^1.1.0
     object-assign: ^4.1.1
-  checksum: 83b9df9529a2b489f00a4eaa608fc7d55518b258e046c100344ae068713e43ae64e477a140f87e38cfe75489bcfd26d27fce5818f89f4ec41bdbda7ead4bb426
+  checksum: b254cc17ce3011788330f7bbf383ab653c6848902d7936a87b09d835d091e3f295f7e9dd1597c6daac5dc80f90e778c8230218ba8ad599f74adcc11e33b9d61b
   languageName: node
   linkType: hard
 
@@ -19885,7 +19885,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"scheduler@npm:^0.20.1":
+"scheduler@npm:^0.20.2":
   version: 0.20.2
   resolution: "scheduler@npm:0.20.2"
   dependencies: