feat: injected button e2e test

.eslintrc.js

@@ -24,5 +24,15 @@ module.exports = {
   },
   env: {
     browser: true,
+    node: true,
   },
+  overrides: [
+    {
+      files: ["*.cjs"],
+      rules: {
+        "@typescript-eslint/no-var-requires": "off",
+        "@typescript-eslint/no-unsafe-assignment": "off"
+      }
+    }
+  ]
 };

README.md

@@ -2,15 +2,16 @@
 
 [OneKey DApp Example](https://dapp-example.onekeytest.com/)
 
-
 # Init monorepo
+
 ```bash
 yarn
 yarn bootstrap
 yarn build
 ```
 
 # Develop monorepo
+
 ```bash
 # Clean cache
 yarn clean && yarn bootstrap
@@ -30,18 +31,55 @@ yarn gulp-watch
 ```
 
 # Run dapp example web
+
 ```bash
 yarn example
 ```
 
 # Update all versions before publish
+
 ```bash
 yarn update-version 1.0.1
 ```
 
 # Publish to npmjs.com
+
 ```bash
 yarn publish-packages
 ```
 
 
+# E2E Test
+
+```
+# start dev runtime build
+yarn && yarn bootstrap && yarn start
+
+# run e2e test headless
+yarn test:e2e
+
+# run e2e test headed
+yarn test:e2e:headed
+
+# check e2e reports & screenshots
+# packages/e2e/playwright-report
+# packages/e2e/test-results
+
+
+
+
+```
+
+packages/providers/inpage-providers-hub/src/connectButtonHack/universal/config.ts
+
+skip connectButton site test
+
+```
+skip: { mobile: true, desktop: true },
+```
+
+only connectButton site test
+
+```
+only: true,
+```

package.json

@@ -23,7 +23,9 @@
     "example": "cd ./packages/example && yarn dev",
     "example-build": "cd ./packages/example && yarn --registry 'https://registry.npmjs.org' && yarn build",
     "update-version": "lerna version --no-git-tag-version --exact",
-    "swap-lock-registry": "npx swap-lock-registry --yarn --parallel --url https://registry.yarnpkg.com yarn.lock"
+    "swap-lock-registry": "npx swap-lock-registry --yarn --parallel --url https://registry.yarnpkg.com yarn.lock",
+    "test:e2e:headed": "cd ./packages/e2e && yarn test:headed",
+    "test:e2e": "cd ./packages/e2e && yarn test"
   },
   "devDependencies": {
     "@testing-library/react-hooks": "^7.0.2",
@@ -32,7 +34,7 @@
     "@types/jest": "^27.0.2",
     "@types/lodash": "^4.14.178",
     "@types/lodash-es": "^4.17.12",
-    "@types/node": "^16.9.0",
+    "@types/node": "^20.12.7",
     "@types/react": "^17.0.21",
     "@types/react-native": "^0.67.6",
     "@typescript-eslint/eslint-plugin": "^5.7.0",
@@ -48,6 +50,7 @@
     "jest": "^27.2.4",
     "lerna": "^5.6.2",
     "lodash": "^4.17.21",
+    "lodash-es": "^4.17.21",
     "patch-package": "^8.0.0",
     "postinstall-postinstall": "^2.1.0",
     "prettier": "2.3.2",
@@ -56,10 +59,5 @@
     "ts-jest": "^27.0.5",
     "typescript": "^5"
   },
-  "dependencies": {
-    "@benfen/bfc.js": "^0.2.7",
-    "@solana/spl-token": "^0.4.9",
-    "lodash-es": "^4.17.21"
-  },
   "packageManager": "[email protected]+sha1.1959a18351b811cdeedbd484a8f86c3cc3bbaf72"
 }

packages/core/src/versionInfo.ts

@@ -1,5 +1,5 @@
 
-const version = '2.2.2';
+const version = '2.2.6';
 const versionBuild = '2020-0101-1';
 
 export default {

packages/e2e/.gitignore

@@ -0,0 +1,5 @@
+node_modules/
+test-results/
+playwright-report/
+reports/
+playwright/.cache/ 

packages/e2e/dotEnvInit.js

@@ -0,0 +1,20 @@
+import dotenv from 'dotenv';
+import path from 'path';
+import { fileURLToPath } from 'url';
+
+function setupDotEnv() {
+  const __filename = fileURLToPath(import.meta.url);
+  const __dirname = path.dirname(__filename);
+
+  const results = [
+    dotenv.config({
+      path: path.resolve(__dirname, '../../.env'),
+    }),
+  ];
+  const errorResult = results.find((result) => result.error);
+
+  if (errorResult) {
+    throw errorResult.error;
+  }
+}
+setupDotEnv();

packages/e2e/package.json

@@ -0,0 +1,45 @@
+{
+  "private": true,
+  "name": "@onekeyfe/e2e",
+  "version": "2.2.6",
+  "keywords": [
+    "cross-inpage-provider"
+  ],
+  "author": "[email protected]",
+  "repository": "https://github.com/OneKeyHQ/cross-inpage-provider",
+  "license": "Apache-2.0",
+  "publishConfig": {
+    "access": "public"
+  },
+  "type": "module",
+  "files": [
+    "dist/*"
+  ],
+  "exports": {
+    "types": "./dist/index.d.ts",
+    "import": "./dist/index.js",
+    "require": "./dist/cjs/index.js"
+  },
+  "types": "./dist/index.d.ts",
+  "module": "./dist/index.js",
+  "main": "./dist/cjs/index.js",
+  "scripts": {
+    "env": "node dotEnvInit.js",
+    "report": "yarn env && npx playwright show-report",
+    "test": "yarn env && npx playwright test ",
+    "test:headed": "yarn env && npx playwright test --headed ",
+    "test:ui": "yarn env && npx playwright test --ui "
+  },
+  "dependencies": {
+    "@onekeyfe/cross-inpage-provider-injected": "2.2.6",
+    "@onekeyfe/cross-inpage-provider-types": "2.2.6",
+    "@onekeyfe/inpage-providers-hub": "2.2.6",
+    "lodash-es": "^4.17.21"
+  },
+  "devDependencies": {
+    "@playwright/test": "^1.49.1",
+    "@types/lodash-es": "^4.17.12",
+    "@types/node": "^20.12.7",
+    "playwright": "^1.49.1"
+  }
+}

packages/e2e/playwright.config.ts

@@ -0,0 +1,33 @@
+import { defineConfig, devices } from '@playwright/test';
+
+export default defineConfig({
+  testDir: './tests',
+  testMatch: ['**/*.e2e.ts', '**/*.e2e.js'],
+  fullyParallel: true,
+  forbidOnly: !!process.env.CI,
+  retries: process.env.CI ? 2 : 0,
+  workers: process.env.CI ? 1 : undefined,
+  reporter: [
+    [
+      'html',
+      {
+        outputFolder: 'playwright-report',
+      },
+    ],
+  ],
+  outputDir: 'test-results',
+  use: {
+    baseURL: 'http://localhost:3000',
+    trace: 'on-first-retry',
+  },
+  projects: [
+    {
+      name: 'chromium',
+      use: { ...devices['Desktop Chrome'], viewport: { width: 1440, height: 800 } },
+    },
+    {
+      name: 'Mobile Chrome',
+      use: { ...devices['iPhone 6'] },
+    },
+  ],
+});

packages/e2e/tests/bing.e2e.ts

@@ -0,0 +1,64 @@
+// 在文件顶部添加这个声明
+declare global {
+  interface Window {
+    $1key: {
+      hello: () => string;
+    };
+  }
+}
+
+import { expect, test } from '@playwright/test';
+
+test('Bing search test', async ({ page }) => {
+  // 打开 Bing
+  await page.goto('https://www.baidu.com');
+
+  // 等待搜索输入框出现并输入内容
+  const searchInput = page.locator('#kw');
+  await searchInput.fill('hemoglobin consists of click to select chainsmokers songs');
+  await searchInput.press('Enter');
+
+  // 等待搜索结果出现
+  await page.waitForSelector('.result.c-container.xpath-log.new-pmd');
+
+  // 获取第二个搜索结果
+  const secondResult = page.locator('.result.c-container.xpath-log.new-pmd').nth(1);
+
+  // 使用 evaluate 来高亮元素
+  await secondResult.evaluate((element) => {
+    element.style.backgroundColor = 'yellow';
+    element.style.border = '2px solid red';
+  });
+
+  const init1key = () => {
+    window.$1key = {
+      hello: () => 'world',
+    };
+  };
+
+  // 注入全局变量
+  await page.evaluate(init1key);
+
+  // 验证 $1key 全局变量存在
+  const hasOneKey = await page.evaluate(() => {
+    return window.$1key !== undefined;
+  });
+  expect(hasOneKey).toBe(true);
+
+  // 验证 $1key.hello 方法存在且可调用
+  const hasHelloMethod = await page.evaluate<string>(() => {
+    // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-call
+    const result = window.$1key ? window.$1key.hello() : '';
+    return result;
+  });
+  expect(hasHelloMethod).toBe('world');
+
+  // 截个图（可选）
+  await page.screenshot({ path: 'test-results/screenshots/bing-search.png' });
+
+  // 验证搜索结果存在
+  await expect(secondResult).toBeVisible();
+
+  // 设置浏览器在测试完成后保持打开状态
+  // await page.pause();
+});

packages/providers/inpage-providers-hub/src/connectButtonHack/universal/__tests__/fixtures/index.ts → packages/e2e/tests/connectButton/fixtures/withChromeExtension.ts

@@ -1,6 +1,6 @@
 import { test as base, chromium, type BrowserContext } from '@playwright/test';
-import path from 'path';
 import env from 'dotenv';
+import path from 'path';
 const __dirname = path.dirname(new URL(import.meta.url).pathname);
 env.config({ path: path.resolve(`${__dirname}/../../../../../../../../.env`) });