🐛 more fixes

.changeset/afraid-suns-talk.md

@@ -1,6 +1,6 @@
 ---
 "@evmts/vite-plugin": patch
-"@evmts/webpack-plugin": patch
+"@evmts/bundler": patch
 ---
 
-Added e2e playwright tests to test the Vite and NEXT.js example apps running with EVMts
+Added e2e playwright tests to test the Vite example app

.github/workflows/e2e.yml

@@ -12,6 +12,8 @@ jobs:
   e2e-vite:
     name: Playwright E2E @evmts/example-vite
     runs-on: ubuntu-latest
+    container:
+      image: mcr.microsoft.com/playwright:v1.37.1-jammy
     steps:
       - uses: actions/checkout@v3
         with:
@@ -21,32 +23,44 @@ jobs:
       - name: "Setup"
         uses: ./.github/actions/setup
 
-      - name: Run Playwright
-        run: pnpm i && npx playwright install && pnpm nx affected --target=e2e:ci
+      - name: Run anvil
+        run: anvil --port=8546 --fork-url ${{ secrets.RPC_URL_MAINNET }} --fork-block-number 14457512 &
         env:
+          ANVIL_FORK_URL: ${{ secrets.ANVIL_FORK_URL }}
           NX_CLOUD_ACCESS_TOKEN: ${{ secrets.NX_CLOUD_ACCESS_TOKEN }}
           ANVIL_RPC_URL_1: ${{ secrets.RPC_URL_MAINNET }}
-          PRIVATE_KEY: ${{ secrets.PRIVATE_KEY }}
           EXAMPLE_PROJECT: "@evmts/example-vite"
           SERVER_PORT: 5173
+          VITE_RPC_URL_1: "http://localhost:8546"
+          PRIVATE_KEY: "test test test test test test test test test test test junk"
 
-  e2e-next:
-    name: Playwright E2E @evmts/example-next
-    runs-on: ubuntu-latest
-    steps:
-      - uses: actions/checkout@v3
-        with:
-          fetch-depth: 0
-          submodules: recursive
-
-      - name: "Setup"
-        uses: ./.github/actions/setup
-
-      - name: Run Playwright
-        run: pnpm i && npx playwright install && pnpm nx affected --target=e2e:ci
+      - name: Run @evmts/vite-example tests
+        run: xvfb-run pnpm nx e2e:ci @evmts/e2e
         env:
           NX_CLOUD_ACCESS_TOKEN: ${{ secrets.NX_CLOUD_ACCESS_TOKEN }}
           ANVIL_RPC_URL_1: ${{ secrets.RPC_URL_MAINNET }}
-          PRIVATE_KEY: ${{ secrets.PRIVATE_KEY }}
-          EXAMPLE_PROJECT: "@evmts/example-next"
-          SERVER_PORT: 3000
+          EXAMPLE_PROJECT: "@evmts/example-vite"
+          SERVER_PORT: 5173
+          VITE_RPC_URL_1: "http://localhost:8546"
+          PRIVATE_KEY: "test test test test test test test test test test test junk"
+
+      - name: 'Upload test-results artifacts'
+        uses: actions/upload-artifact@v3
+        if: failure()
+        with:
+          name: test-results
+          path: e2e/test-results/**/*
+          retention-days: 15
+
+      - name: 'Upload playwright-report'
+        uses: actions/upload-artifact@v3
+        if: failure()
+        with:
+          name: test-results
+          path: e2e/playwright-report/**/*
+          retention-days: 15
+
+      - name: Shutdown Anvil
+        run: pkill -2 anvil
+
+

e2e/.gitignore

@@ -1,4 +1,6 @@
 node_modules
+test-results/
+playwright-report/
 .DS_Store
 dist
 dist-ssr

e2e/package.json

@@ -9,7 +9,7 @@
   "scripts": {
     "clean": "rm -rf node_modules && rm -rf artifacts && rm -rf dist && rm -rf cache",
     "e2e": "playwright test",
-    "e2e:ci": "xvfb-run playwright test --headed",
+    "e2e:ci": "npx playwright test",
     "format": "rome format . --write",
     "format:check": "rome format .",
     "preinstall": "npx only-allow pnpm",
@@ -19,14 +19,12 @@
     "typecheck": "tsc --noEmit"
   },
   "dependencies": {
-    "@evmts/example-next": "workspace:^",
-    "@evmts/example-vite": "workspace:^",
     "typescript": "^5.2.2"
   },
   "devDependencies": {
     "@playwright/test": "^1.37.1",
-    "@synthetixio/synpress": "3.7.2-beta.5",
+    "@synthetixio/synpress": "3.7.2-beta.7",
     "rome": "^12.1.3",
-    "viem": "^1.8.1"
+    "viem": "^1.10.8"
   }
 }

e2e/playwright.config.ts

@@ -5,23 +5,32 @@ import path from 'path';
 dotenv.config();
 
 const config: PlaywrightTestConfig = {
-	testDir: 'src',
-	retries: 3,
+	testDir: './src',
+	retries: 1,
+	reporter: [
+		['line'],
+		['junit', { outputFile: 'test-results/results.xml' }],
+		['json', { outputFile: 'test-results/results.json' }],
+		['html'],
+	],
 	use: {
-		headless: false,
+		trace: 'retain-on-failure',
+		screenshot: 'only-on-failure',
+    video: 'retain-on-failure',
 		launchOptions: {
 			slowMo: parseInt(process.env.PLAYWRIGHT_SLOW_MO || '0'),
 		}
 	},
 	webServer: {
-		command: `ANVIL_RPC_URL_1=${process.env.ANVIL_RPC_URL_1} echo "starting dev server ${process.env.EXAMPLE_PROJECT}" && pnpm nx dev ${process.env.EXAMPLE_PROJECT ?? "@evmts/example-vite"}`,
-		port: process.env.SERVER_PORT ? Number.parseInt(process.env.SERVER_PORT) : 5173,
-		reuseExistingServer: true,
-		timeout: 180000,
+		command: `pnpm nx test-server ${process.env.EXAMPLE_PROJECT ?? "@evmts/example-vite"}`,
+		url: `http://localhost:${process.env.SERVER_PORT ?? '5173'}`,
+		reuseExistingServer: false,
 		env: {
-			VITE_RPC_URL_1: process.env.VITE_RPC_URL_1 ?? 'http://localhost:8545',
-			VITE_RPC_URL_420: process.env.VITE_RPC_URL_420 ?? 'http://localhost:9545',
-			PRIVATE_KEY: process.env.PRIVATE_KEY ?? '0xac0974bec39a17e36ba4a6b4d238ff944bacb478cbed5efcae784d7bf4f2ff80',
+			VITE_RPC_URL_1: 'http://localhost:8546',
+			VITE_RPC_URL_10: 'http://localhost:9545',
+			VITE_RPC_URL_420: 'http://localhost:9546',
+			PRIVATE_KEY: 'test test test test test test test test test test test junk',
+			SERVER_PORT: process.env.SERVER_PORT ?? '5173',
 		}
 	},
 	projects: [

e2e/src/ReadAndWrite.spec.ts

@@ -1,9 +1,11 @@
-import { testWithSynpress } from './fixtures'
+import { testWithSynpress, network } from './fixtures'
 // @ts-ignore
 import metamask from "@synthetixio/synpress/commands/metamask.js";
 
 testWithSynpress('should be able to read and write', async ({ page }) => {
-	await page.goto('http://localhost:5173')
+	const pageUrl =`http://localhost:${process.env.SERVER_PORT ?? '5173'}`
+	console.log(`going to ${pageUrl}`)
+	await page.goto(pageUrl)
 	await page.getByTestId('rk-connect-button').click()
 	await page.getByText('MetaMask').click()
 	await metamask.acceptAccess();

e2e/src/fixtures.ts

@@ -8,15 +8,15 @@ import {
 } from '@playwright/test'
 import metamask from '@synthetixio/synpress/commands/metamask.js'
 import helpers from '@synthetixio/synpress/helpers.js'
-import {Chain, mainnet} from 'viem/chains'
+import { Chain, mainnet } from 'viem/chains'
 
 const { initialSetup } = metamask
 const { prepareMetamask } = helpers
 
 export const testWithSynpress = base.extend<{
 	context: BrowserContext
 }>({
-	context: async ({}, use) => {
+	context: async ({ }, use) => {
 		// required for synpress
 		global.expect = expect
 		// download metamask
@@ -43,21 +43,26 @@ export const testWithSynpress = base.extend<{
 		// wait for metamask
 		await context.pages()[0].waitForTimeout(3000)
 		// setup metamask
-		await initialSetup(chromium, {
-			secretWordsOrPrivateKey:
-				process.env.PRIVATE_KEY,
-			network: {
-				...mainnet,
-				rpcUrls: {
-					public: {http: [process.env.ANVIL_RPC_URL_1]},
-					default: {http: [process.env.ANVIL_RPC_URL_1]}
-				}
-			} satisfies Chain,
-			password: 'Tester@1234',
-			enableAdvancedSettings: true,
-		})
+		await initialSetup(chromium, config)
 		await use(context)
-		await context.close()
 	},
 })
 export { expect }
+
+export const network = {
+	name: 'forked-mainnet',
+	chainId: mainnet.id,
+	symbol: mainnet.nativeCurrency.symbol,
+	rpcUrl: 'http://localhost:8546',
+	rpcUrls: {
+		public: { http: ['http://localhost:8546'] },
+		default: { http: ['http://localhost:8546'] }
+	}
+} satisfies Chain
+export const config = {
+	network,
+	secretWordsOrPrivateKey:
+		'test test test test test test test test test test test junk',
+	password: 'Tester@1234',
+	enableAdvancedSettings: true,
+}

examples/next/package.json

@@ -8,7 +8,7 @@
 	"scripts": {
 		"build": "pnpm build:dist",
 		"build:dist": "next build",
-		"dev": "NEXT_RPC_URL_1=http://localhost:8545 anvil --fork-url $ANVIL_RPC_URL_1 & next dev",
+		"dev": "NEXT_RPC_URL_1=http://localhost:8545 anvil --port 8546 --fork-url $ANVIL_RPC_URL_1 & next dev",
 		"lint": "next lint",
 		"start": "next start"
 	},

examples/next/src/wagmi/WagmiWrites.tsx

@@ -3,20 +3,22 @@ import { getRandomInt } from '../utils/getRandomInt'
 import {
 	Address,
 	useAccount,
+	useChainId,
 	useContractRead,
 	useContractWrite,
 	useWaitForTransaction,
 } from 'wagmi'
 
 export const WagmiWrites = () => {
+	const chainId = useChainId()
 	const { address, isConnected } = useAccount()
 
 	const { data, refetch } = useContractRead({
 		/**
 		 * Spreading in a method will spread abi, address and args
 		 * Hover over balanceOf and click go-to-definition should take you to the method definition in solidity if compiling from solidity
 		 */
-		...WagmiMintExample.read().balanceOf(address as Address),
+		...WagmiMintExample.read({ chainId }).balanceOf(address as Address),
 		enabled: isConnected,
 	})
 
@@ -25,7 +27,8 @@ export const WagmiWrites = () => {
 		 * Not calling the function will return abi and address without args
 		 * This is useful for when you want to lazily call the function like in case of useContractWrite
 		 */
-		...WagmiMintExample.write().mint,
+		address: '0xFBA3912Ca04dd458c843e2EE08967fC04f3579c2',
+		...WagmiMintExample.write({ chainId }).mint,
 	})
 
 	useWaitForTransaction({
@@ -44,7 +47,9 @@ export const WagmiWrites = () => {
 			<button
 				type='button'
 				onClick={() =>
-					writeMint(WagmiMintExample.write().mint(BigInt(getRandomInt())))
+					writeMint({
+						...WagmiMintExample.write({ chainId }).mint(BigInt(getRandomInt())),
+					})
 				}
 			>
 				Mint

examples/next/tsconfig.json

@@ -6,7 +6,7 @@
         "localContracts": {
           "contracts": [
             {
-              "name": "MyContract",
+              "name": "WagmiMintExample",
               "addresses": {
                 "1": "0xFBA3912Ca04dd458c843e2EE08967fC04f3579c2",
                 "420": "0x1df10ec981ac5871240be4a94f250dd238b77901"
@@ -35,7 +35,11 @@
       }
     ],
     "target": "es6",
-    "lib": ["dom", "dom.iterable", "esnext"],
+    "lib": [
+      "dom",
+      "dom.iterable",
+      "esnext"
+    ],
     "allowJs": true,
     "skipLibCheck": true,
     "strict": true,
@@ -49,6 +53,12 @@
     "jsx": "preserve",
     "incremental": true
   },
-  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"],
-  "exclude": ["node_modules"]
-}
+  "include": [
+    "next-env.d.ts",
+    "**/*.ts",
+    "**/*.tsx"
+  ],
+  "exclude": [
+    "node_modules"
+  ]
+}

examples/vite/package.json

@@ -2,18 +2,16 @@
 	"name": "@evmts/example-vite",
 	"version": "0.0.1",
 	"private": true,
-	"contributors": [
-		"Will Cory <[email protected]>"
-	],
+	"contributors": ["Will Cory <[email protected]>"],
 	"scripts": {
-		"anvil": "source .env && anvil --fork-url https://eth-mainnet.g.alchemy.com/v2/$VITE_ALCHEMY_API_KEY",
 		"build": "pnpm build:contracts && pnpm build:dist",
 		"build:contracts": "forge build",
 		"build:dist": "vite build",
 		"clean": "rm -rf node_modules && rm -rf artifacts && rm -rf dist && rm -rf cache",
 		"deploy-contracts": "source .env && forge script script/Deploy.s.sol:Deploy --broadcast --verify -vvvv",
 		"deploy-contracts:anvil": "pnpm deploy-contracts --fork-url http://localhost:8545",
-		"dev": "anvil --fork-url $ANVIL_RPC_URL_1 & vite",
+		"dev": "anvil --port 8546 --fork-block-number 14457512 --fork-url $ANVIL_RPC_URL_1 & vite",
+		"test-server": "vite",
 		"format": "rome format . --write",
 		"format:check": "rome format .",
 		"generate": "evmts generate",
@@ -24,7 +22,6 @@
 		"preview": "vite preview",
 		"rome": "^12.1.2",
 		"serve": "serve -s -l tcp://0.0.0.0:5173 dist",
-		"serve:test": "source .env & anvil --fork-url https://eth-mainnet.g.alchemy.com/v2/$VITE_ALCHEMY_API_KEY & vite",
 		"test": "vitest"
 	},
 	"dependencies": {

nx.json

@@ -7,6 +7,14 @@
 		"format:check": {
 			"inputs": ["default"]
 		},
+		"e2e": {
+			"inputs": ["default", "outputsDist"],
+			"dependsOn": ["^build:dist", "pretest"]
+		},
+		"e2e:ci": {
+			"inputs": ["default", "outputsDist"],
+			"dependsOn": ["^build:dist", "pretest"]
+		},
 		"test": {
 			"inputs": ["default", "outputsDist"],
 			"dependsOn": ["^build:dist", "pretest"]
@@ -49,6 +57,9 @@
 		},
 		"dev": {
 			"dependsOn": ["^build", "predev"]
+		},
+		"test-server": {
+			"dependsOn": ["^build"]
 		}
 	},
 	"tasksRunnerOptions": {
@@ -64,6 +75,7 @@
 					"format:check",
 					"typecheck",
 					"e2e",
+					"e2e:ci",
 					"format:check",
 					"lint:check",
 					"format:check"