chore: merge unstable into master

.eslintrc.js

@@ -1,79 +1,5 @@
+require("@rushstack/eslint-patch/modern-module-resolution");
+
 module.exports = {
-  root: true,
-  env: {
-    mocha: true,
-    node: true,
-    es6: true,
-  },
-  parser: '@typescript-eslint/parser',
-  plugins: ['@typescript-eslint', 'eslint-plugin-import', 'prettier'],
-  extends: [
-    'eslint:recommended',
-    'plugin:@typescript-eslint/recommended',
-    'prettier/@typescript-eslint',
-    'plugin:prettier/recommended',
-  ],
-  rules: {
-    'prettier/prettier': ['error', {}, { usePrettierrc: true }],
-    '@typescript-eslint/no-require-imports': 'error',
-    '@typescript-eslint/no-unused-vars': [
-      'error',
-      {
-        varsIgnorePattern: '^_',
-      },
-    ],
-    '@typescript-eslint/explicit-function-return-type': [
-      'error',
-      {
-        allowExpressions: true,
-      },
-    ],
-    '@typescript-eslint/ban-ts-comment': 'error',
-    '@typescript-eslint/no-explicit-any': 'error',
-    '@typescript-eslint/explicit-module-boundary-types': 'error',
-    '@typescript-eslint/no-use-before-define': 'off',
-    'prefer-const': 'error',
-    'no-consecutive-blank-lines': 0,
-    'no-console': 'error',
-    '@typescript-eslint/naming-convention': [
-      'error',
-      { selector: 'default', format: ['camelCase'] },
-      {
-        selector: ['classProperty', 'parameterProperty', 'objectLiteralProperty', 'classMethod', 'parameter'],
-        format: ['camelCase'],
-        leadingUnderscore: 'allow',
-      },
-      //variable must be in camel or upper case
-      { selector: 'variable', format: ['camelCase', 'UPPER_CASE'], leadingUnderscore: 'allow' },
-      // {selector: "variable", modifiers: ["global"], format: ["PascalCase", "UPPER_CASE"]},
-      //classes and types must be in PascalCase
-      { selector: ['typeLike', 'enum'], format: ['PascalCase'] },
-      { selector: 'enumMember', format: null },
-      { selector: 'typeProperty', format: ['PascalCase', 'camelCase'] },
-      //ignore rules on destructured params
-      {
-        selector: 'variable',
-        modifiers: ['destructured'],
-        format: null,
-      },
-    ],
-    'import/order': [
-      'error',
-      {
-        groups: ['builtin', 'external', 'parent', 'internal', 'sibling'],
-        'newlines-between': 'always',
-        alphabetize: {
-          order: 'asc',
-        },
-      },
-    ],
-  },
-  overrides: [
-    {
-      files: ['**/test/**/*.ts'],
-      rules: {
-        'no-console': 'off',
-      },
-    },
-  ],
-};
+  extends: "@chainsafe",
+}

.github/workflows/cron.yml

@@ -1,4 +1,4 @@
-name: "Validate compatiblity with metamask"
+name: "Validate compatiblity with MetaMask"
 
 on:
   schedule:

.github/workflows/main.yml

@@ -4,33 +4,66 @@ on:
   push:
     branches:
       - master
+      - unstable
   pull_request:
     branches:
       - '**'
 
 jobs:
-  checks:
-    name: Checks
+  tests:
+    name: Tests
     runs-on: ubuntu-latest
+    strategy:
+      fail-fast: false
+      matrix:
+        mm-version: [mm, flask]
+        automation: [playwright, puppeteer]
     steps:
       - uses: actions/checkout@v3
       - uses: actions/setup-node@v3
         with:
-          cache: yarn
           node-version: "16"
+          cache: 'yarn'
       - name: Install
-        run: yarn install --frozen-lockfile
-      - name: Build
-        run: yarn run build
+        run: yarn --prefer-offline --frozen-lockfile
+      - name: Tests
+        run: 'xvfb-run --auto-servernum --server-args="-screen 0, 1920x1080x24" yarn run test:${{matrix.automation}}:${{ matrix.mm-version }} --timeout 50000'
+      - uses: actions/upload-artifact@v3
+        if: always()
+        with:
+          name: debug_screenshots
+          path: ./*.png
+  lint:
+    name: Lint
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v3
+      - uses: actions/setup-node@v3
+        with:
+          node-version: "16"
+          cache: 'yarn'
+      - name: Install deps
+        run: yarn --prefer-offline --frozen-lockfile
       - name: Lint
         run: yarn run lint
-      - name: Tests
-        run: xvfb-run --auto-servernum yarn run test
+  build:
+    name: Build
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v3
+      - uses: actions/setup-node@v3
+        with:
+          node-version: "16"
+          cache: 'yarn'
+      - name: Install deps
+        run: yarn --prefer-offline --frozen-lockfile
+      - name: Build
+        run: yarn build
 
   maybe-release:
     name: release
     runs-on: ubuntu-latest
-    needs: [checks]
+    needs: [tests, lint, build]
     if: github.event_name == 'push' && github.ref == 'refs/heads/master'
     steps:
       - uses: google-github-actions/release-please-action@v3 # it will analyze commits and create PR with new version and updated CHANGELOG:md file. On merging it will create github release page with changelog
@@ -50,7 +83,7 @@ jobs:
           registry-url: 'https://registry.npmjs.org'
         if: ${{ steps.release.outputs.release_created }}
 
-      - run: yarn install --frozen-lockfile
+      - run: yarn --prefer-offline --frozen-lockfile
         if: ${{ steps.release.outputs.release_created }}
 
       - run: yarn build

.gitignore

@@ -1,10 +1,10 @@
 *DS_Store
 node_modules
-test/server/data.js
 build
 dist
 .vscode/
 /metamask
+/.metamask
 .idea
 *.log
-test/dapp/data.js
+*.png

.mocharc.yml

@@ -0,0 +1,7 @@
+parallel: false
+recursive: true
+color: true
+timeout: 20000
+exit: true
+spec:
+  - 'test/**/*.spec.ts'

README.md

@@ -12,28 +12,87 @@ $ yarn add @chainsafe/dappeteer
 ## Usage
 
 ```js
-import puppeteer from 'puppeteer';
 import dappeteer from '@chainsafe/dappeteer';
 
 async function main() {
-  const [metamask, page] = await dappeteer.bootstrap(puppeteer, { metamaskVersion: 'v10.15.0' });
+  const { metaMask, browser } = await dappeteer.bootstrap();
+
+  // create a new page and visit your dapp
+  const dappPage = browser.newPage();
+  await dappPage.goto('http://my-dapp.com');
 
   // you can change the network if you want
-  await metamask.switchNetwork('ropsten');
+  await metaMask.switchNetwork('goerli');
 
-  // you can import a token
-  await metamask.addToken({
-    tokenAddress: '0x4f96fe3b7a6cf9725f59d353f723c1bdb64ca6aa',
-    symbol: 'KAKI',
-  });
+  // do something in your dapp that prompts MetaMask to add a Token
+  const addTokenButton = await dappPage.$('#add-token');
+  await addTokenButton.click();
+  // instruct MetaMask to accept this request
+  await metaMask.acceptAddToken();
 
-  // go to a dapp and do something that prompts MetaMask to confirm a transaction
-  await page.goto('http://my-dapp.com');
-  const payButton = await page.$('#pay-with-eth');
+  // do something that prompts MetaMask to confirm a transaction
+  const payButton = await dappPage.$('#pay-with-eth');
   await payButton.click();
 
   // 🏌
-  await metamask.confirmTransaction();
+  await metaMask.confirmTransaction();
+}
+
+main();
+```
+
+## Usage with Snaps
+
+```js
+import dappeteer from '@chainsafe/dappeteer';
+import { exec } from "child_process";
+
+async function buildSnap(): Promise<string> {
+  console.log(`Building my-snap...`);
+  await new Promise((resolve, reject) => {
+    exec(`cd ./my-snap && npx mm-snap build`, (error, stdout) => {
+      if (error) {
+        reject(error);
+        return;
+      }
+      resolve(stdout);
+    });
+  });
+
+  return "./my-snap";
+}
+
+async function main() {
+  // you need to have a webpage open to interact with MetaMask, you can also visit a dApp page
+  const dappPage = browser.newPage();
+  await dappPage.goto('http://example.org/');
+
+  // build your local snap
+  const builtSnapDir = await buildSnap()
+
+  // setup dappateer and install your snap
+  const { snapId, metaMask, dappPage } = await dappeteer.initSnapEnv({
+    snapIdOrLocation: builtSnapDir
+  });
+
+  // invoke a method from your snap that promps users with approve/reject dialog
+  metaMask.snaps.invokeSnap(dappPage, snapId, "my-method")
+
+  // instruct MetaMask to accept this request
+  await metaMask.snaps.acceptDialog();
+
+  // get the notification emitter and the promise that will receive the notifications
+  const emitter = await metaMask.snaps.getNotificationEmitter();
+  const notificationPromise = emitter.waitForNotification();
+
+  // do something that prompts you snap to emit notifications
+  await metaMask.snaps.invokeSnap(dappPage, snapId, "notify");
+
+  // Make sure the notification promise has resolved
+  await notificationPromise;
+
+  // You can now read the snap notifications and run tests against them
+  const notifications = await metaMask.snaps.getAllNotifications();
 }
 
 main();