Skip to content

Commit

Permalink
chore(boxes): adding frontend test to vanilla-js box
Browse files Browse the repository at this point in the history
Please read [contributing guidelines](CONTRIBUTING.md) and remove this line.
  • Loading branch information
signorecello committed Mar 4, 2024
1 parent 86d6749 commit cd1ca2e
Show file tree
Hide file tree
Showing 9 changed files with 152 additions and 14 deletions.
1 change: 1 addition & 0 deletions boxes/Dockerfile
Original file line number Diff line number Diff line change
Expand Up @@ -14,4 +14,5 @@ WORKDIR /usr/src/boxes
ENV AZTEC_NARGO=/usr/src/noir/noir-repo/target/release/nargo
ENV AZTEC_CLI=/usr/src/yarn-project/cli/aztec-cli-dest
RUN yarn && yarn build
RUN npx -y playwright@1.42 install --with-deps
ENTRYPOINT ["/bin/sh", "-c"]
5 changes: 5 additions & 0 deletions boxes/vanilla-js/.gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -5,3 +5,8 @@ node_modules
dist
artifacts
src/contracts/target
/test-results/
/playwright-report/
/blob-report/
/playwright/.cache/
codegenCache.json
4 changes: 3 additions & 1 deletion boxes/vanilla-js/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,8 @@
"prep": "yarn clean && yarn compile && yarn codegen && tsc -b",
"dev": "yarn prep && webpack serve --mode development",
"build": "yarn prep && webpack",
"test": "echo \"Frontend test soon!\"",
"serve": "webpack serve --no-open --mode development",
"test": "npx playwright test",
"formatting": "prettier --check ./src && eslint ./src",
"formatting:fix": "prettier -w ./src"
},
Expand All @@ -19,6 +20,7 @@
"@aztec/aztec.js": "latest"
},
"devDependencies": {
"@playwright/test": "1.42.0",
"@types/node": "^20.11.17",
"copy-webpack-plugin": "^11.0.0",
"html-webpack-plugin": "^5.6.0",
Expand Down
37 changes: 37 additions & 0 deletions boxes/vanilla-js/playwright.config.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,37 @@
import { defineConfig, devices } from '@playwright/test';

export default defineConfig({
testDir: './tests',
fullyParallel: true,
retries: 3,
workers: process.env.CI ? 1 : 3,
reporter: 'list',
use: {
baseURL: 'http://127.0.0.1:5173',
trace: 'on-first-retry',
screenshot: 'only-on-failure',
video: 'on-first-retry',
},
expect: {
timeout: 30000,
},
projects: [
{
name: 'chromium',
use: { ...devices['Desktop Chrome'] },
},
{
name: 'firefox',
use: { ...devices['Desktop Firefox'] },
},

{
name: 'webkit',
use: { ...devices['Desktop Safari'] },
},
],
webServer: {
command: 'yarn serve',
port: 5173,
},
});
2 changes: 1 addition & 1 deletion boxes/vanilla-js/src/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Minimal Noir Contract Webpack</title>
<title>Aztec Vanilla JS Box</title>
<style></style>
</head>
<body>
Expand Down
1 change: 0 additions & 1 deletion boxes/vanilla-js/src/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -46,7 +46,6 @@ document.querySelector('#set').addEventListener('submit', async (e: Event) => {

const { value } = document.querySelector('#number') as HTMLInputElement;
const owner = wallet.getCompleteAddress().address;
console.log(owner);
await contract.methods.setNumber(parseInt(value), owner).send().wait();
alert('Number set!');

Expand Down
38 changes: 38 additions & 0 deletions boxes/vanilla-js/tests/browser.spec.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,38 @@
import { test, expect } from '@playwright/test';

test('Deploying, setting, and getting a number', async ({ page }) => {
test.slow();
await page.goto('/');

const handleDialog = (expectedMessage: string) => {
return new Promise<void>(resolve => {
page.once('dialog', async dialog => {
expect(dialog.message()).toContain(expectedMessage);
await dialog.accept();
resolve();
});
});
};

// Deploy contract
const deployDialogPromise = handleDialog('Contract deployed at');
await page.getByRole('button', { name: 'Deploy' }).click();
await deployDialogPromise;
await expect(page.locator('#number')).toHaveValue('0');

// Get number
const getNumberDialogPromise = handleDialog('Number is:');
await page.getByRole('button', { name: 'Get Number' }).click();
await getNumberDialogPromise;

// Set number
await page.locator('#number').fill('1');
const setNumberDialogPromise = handleDialog('Number set!');
await page.getByRole('button', { name: 'Set Number' }).click();
await setNumberDialogPromise;

// Verifying number
const verifyNumberDialogPromise = handleDialog('Number is: 1');
await page.getByRole('button', { name: 'Get Number' }).click();
await verifyNumberDialogPromise;
});
1 change: 1 addition & 0 deletions boxes/vanilla-js/webpack.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -25,6 +25,7 @@ export default (_, argv) => ({
new webpack.DefinePlugin({
'process.env': {
NODE_ENV: JSON.stringify(argv.mode || 'production'),
PXE_URL: JSON.stringify(process.env.PXE_URL || 'http://localhost:8080'),
},
}),
new webpack.ProvidePlugin({ Buffer: ['buffer', 'Buffer'] }),
Expand Down
77 changes: 66 additions & 11 deletions boxes/yarn.lock
Original file line number Diff line number Diff line change
Expand Up @@ -128,6 +128,7 @@ __metadata:
dependencies:
"@aztec/accounts": "npm:latest"
"@aztec/aztec.js": "npm:latest"
"@playwright/test": "npm:1.42.0"
"@types/node": "npm:^20.11.17"
copy-webpack-plugin: "npm:^11.0.0"
html-webpack-plugin: "npm:^5.6.0"
Expand Down Expand Up @@ -190,7 +191,7 @@ __metadata:
"@aztec/foundation": "workspace:^"
dotenv: "npm:^16.0.3"
tslib: "npm:^2.4.0"
viem: "npm:^1.2.5"
viem: "npm:^2.7.15"
languageName: node
linkType: soft

Expand Down Expand Up @@ -1271,6 +1272,17 @@ __metadata:
languageName: node
linkType: hard

"@playwright/test@npm:1.42.0":
version: 1.42.0
resolution: "@playwright/test@npm:1.42.0"
dependencies:
playwright: "npm:1.42.0"
bin:
playwright: cli.js
checksum: 10c0/1505544fd4962cc9463c2e0d21958507b4b23ecb835ef19d81a97ae01cda9030585dc321263486cce4d1eac53724615b7b3ec41a94b6c1a54a2b7ed01157de60
languageName: node
linkType: hard

"@scure/base@npm:~1.1.0, @scure/base@npm:~1.1.2":
version: 1.1.5
resolution: "@scure/base@npm:1.1.5"
Expand Down Expand Up @@ -2131,18 +2143,18 @@ __metadata:
languageName: node
linkType: hard

"abitype@npm:0.9.8":
version: 0.9.8
resolution: "abitype@npm:0.9.8"
"abitype@npm:1.0.0":
version: 1.0.0
resolution: "abitype@npm:1.0.0"
peerDependencies:
typescript: ">=5.0.4"
zod: ^3 >=3.19.1
zod: ^3 >=3.22.0
peerDependenciesMeta:
typescript:
optional: true
zod:
optional: true
checksum: 10c0/ec559461d901d456820faf307e21b2c129583d44f4c68257ed9d0d44eae461114a7049046e715e069bc6fa70c410f644e06bdd2c798ac30d0ada794cd2a6c51e
checksum: 10c0/d685351a725c49f81bdc588e2f3825c28ad96c59048d4f36bf5e4ef30935c31f7e60b5553c70177b77a9e4d8b04290eea43d3d9c1c2562cb130381c88b15d39f
languageName: node
linkType: hard

Expand Down Expand Up @@ -4930,6 +4942,16 @@ __metadata:
languageName: node
linkType: hard

"fsevents@npm:2.3.2":
version: 2.3.2
resolution: "fsevents@npm:2.3.2"
dependencies:
node-gyp: "npm:latest"
checksum: 10c0/be78a3efa3e181cda3cf7a4637cb527bcebb0bd0ea0440105a3bb45b86f9245b307dc10a2507e8f4498a7d4ec349d1910f4d73e4d4495b16103106e07eee735b
conditions: os=darwin
languageName: node
linkType: hard

"fsevents@npm:^2.3.2, fsevents@npm:~2.3.2":
version: 2.3.3
resolution: "fsevents@npm:2.3.3"
Expand All @@ -4940,6 +4962,15 @@ __metadata:
languageName: node
linkType: hard

"fsevents@patch:fsevents@npm%3A2.3.2#optional!builtin<compat/fsevents>":
version: 2.3.2
resolution: "fsevents@patch:fsevents@npm%3A2.3.2#optional!builtin<compat/fsevents>::version=2.3.2&hash=df0bf1"
dependencies:
node-gyp: "npm:latest"
conditions: os=darwin
languageName: node
linkType: hard

"fsevents@patch:fsevents@npm%3A^2.3.2#optional!builtin<compat/fsevents>, fsevents@patch:fsevents@npm%3A~2.3.2#optional!builtin<compat/fsevents>":
version: 2.3.3
resolution: "fsevents@patch:fsevents@npm%3A2.3.3#optional!builtin<compat/fsevents>::version=2.3.3&hash=df0bf1"
Expand Down Expand Up @@ -8285,6 +8316,30 @@ __metadata:
languageName: node
linkType: hard

"playwright-core@npm:1.42.0":
version: 1.42.0
resolution: "playwright-core@npm:1.42.0"
bin:
playwright-core: cli.js
checksum: 10c0/f08700ec743734247a0e025249ccaf1f58beb95b5c8ef6a4319f636db83ea668222967ae10299114e9f4725318f80185c7c7d97fe051ebd617acec5ae67af31a
languageName: node
linkType: hard

"playwright@npm:1.42.0":
version: 1.42.0
resolution: "playwright@npm:1.42.0"
dependencies:
fsevents: "npm:2.3.2"
playwright-core: "npm:1.42.0"
dependenciesMeta:
fsevents:
optional: true
bin:
playwright: cli.js
checksum: 10c0/4960431c89097d7a79a24d3d4e5896cd9e4253dacfdf2891ed8a32f31c6f665a3df9af636baa23a93382733667a4d997afadb6148e6ba71f42202eeafc8968b7
languageName: node
linkType: hard

"possible-typed-array-names@npm:^1.0.0":
version: 1.0.0
resolution: "possible-typed-array-names@npm:1.0.0"
Expand Down Expand Up @@ -10444,24 +10499,24 @@ __metadata:
languageName: node
linkType: hard

"viem@npm:^1.2.5":
version: 1.21.4
resolution: "viem@npm:1.21.4"
"viem@npm:^2.7.15":
version: 2.7.19
resolution: "viem@npm:2.7.19"
dependencies:
"@adraffy/ens-normalize": "npm:1.10.0"
"@noble/curves": "npm:1.2.0"
"@noble/hashes": "npm:1.3.2"
"@scure/bip32": "npm:1.3.2"
"@scure/bip39": "npm:1.2.1"
abitype: "npm:0.9.8"
abitype: "npm:1.0.0"
isows: "npm:1.0.3"
ws: "npm:8.13.0"
peerDependencies:
typescript: ">=5.0.4"
peerDependenciesMeta:
typescript:
optional: true
checksum: 10c0/8b29c790181e44c4c95b9ffed1a8c1b6c2396eb949b95697cc390ca8c49d88ef9e2cd56bd4800b90a9bbc93681ae8d63045fc6fa06e00d84f532bef77967e751
checksum: 10c0/aa7e8750eca7d02eab1819ec7d85ba2d3669c65b133c919dc34ea0052c236e75220e25d667a604dd76d36f92958d60a52d6772c58cf725435f728ca4c70ee9b7
languageName: node
linkType: hard

Expand Down

0 comments on commit cd1ca2e

Please sign in to comment.