feat: add e2e test

.github/workflows/ci.yaml

@@ -7,3 +7,45 @@ on:
 jobs:
   call-rust-build:
     uses: ./.github/workflows/plugin-build.yaml
+  examples-test:
+    name: Examples Test
+    runs-on: ${{ matrix.settings.os }}
+    needs: [call-rust-build]
+    strategy:
+      fail-fast: false
+      matrix:
+        settings:
+          - os: ubuntu-latest
+            abi: linux-x64-gnu
+          - os: macos-latest
+            abi: darwin-arm64
+          - os: macos-13
+            abi: darwin-x64
+          - os: windows-latest
+            abi: win32-x64-msvc
+    steps:
+      - name: Checkout Repo
+        uses: actions/checkout@v3
+      - name: Setup Node.js 18.x
+        uses: actions/setup-node@v3
+        with:
+          node-version: 18.x
+      - uses: actions/download-artifact@v3
+        with:
+          path: /tmp/artifacts
+      - name: Move Artifacts
+        run: |
+          for abi in linux-x64-gnu linux-x64-musl darwin-x64 win32-x64-msvc linux-arm64-musl linux-arm64-gnu darwin-arm64 win32-ia32-msvc win32-arm64-msvc
+          do
+               for package in dsv react-components virtual yaml strip image url icons
+                do
+                  folder_path="/tmp/artifacts/${{github.sha}}-${abi}-${package}"
+                  if [ -d "${folder_path}"] && [ -n "$(ls -A $folder_path)"]; then
+                    mv /tmp/artifacts/${{ github.sha }}-${abi}-${package}/* ./packages/${package}/npm/${abi}
+                  fi
+                done
+          done
+      - name: Install Dependencies
+        run: npm install -g pnpm@9.1.0 && pnpm i --frozen-lockfile
+      - name: E2E Test Examples - ${{ matrix.settings.abi }}
+        run: npm run test-e2e

.github/workflows/plugin-build.yaml

@@ -98,3 +98,45 @@ jobs:
         if: ${{ !matrix.settings.docker && matrix.settings.build }}
         run: ${{ matrix.settings.build }}
         shell: bash
+      - name: Upload Plugin react-components
+        uses: actions/upload-artifact@v3
+        with:
+          name: ${{ github.sha }}-${{ matrix.settings.abi }}-react-components
+          path: ./packages/react-components/npm/${{ matrix.settings.abi }}/index.farm
+          if-no-files-found: ignore
+      - name: Upload Plugin virtual
+        uses: actions/upload-artifact@v3
+        with:
+          name: ${{ github.sha }}-${{ matrix.settings.abi }}-virtual
+          path: ./packages/virtual/npm/${{ matrix.settings.abi }}/index.farm
+          if-no-files-found: ignore
+      - name: Upload Plugin yaml
+        uses: actions/upload-artifact@v3
+        with:
+          name: ${{ github.sha }}-${{ matrix.settings.abi }}-yaml
+          path: ./packages/yaml/npm/${{ matrix.settings.abi }}/index.farm
+          if-no-files-found: ignore
+      - name: Upload Plugin strip
+        uses: actions/upload-artifact@v3
+        with:
+          name: ${{ github.sha }}-${{ matrix.settings.abi }}-strip
+          path: ./packages/strip/npm/${{ matrix.settings.abi }}/index.farm
+          if-no-files-found: ignore
+      - name: Upload Plugin image
+        uses: actions/upload-artifact@v3
+        with:
+          name: ${{ github.sha }}-${{ matrix.settings.abi }}-image
+          path: ./packages/image/npm/${{ matrix.settings.abi }}/index.farm
+          if-no-files-found: ignore
+      - name: Upload Plugin url
+        uses: actions/upload-artifact@v3
+        with:
+          name: ${{ github.sha }}-${{ matrix.settings.abi }}-url
+          path: ./packages/url/npm/${{ matrix.settings.abi }}/index.farm
+          if-no-files-found: ignore
+      - name: Upload Plugin icons
+        uses: actions/upload-artifact@v3
+        with:
+          name: ${{ github.sha }}-${{ matrix.settings.abi }}-icons
+          path: ./packages/icons/npm/${{ matrix.settings.abi }}/index.farm
+          if-no-files-found: ignore

e2e/utils.ts

@@ -0,0 +1,94 @@
+export type SimpleUnwrapArray<T> = T extends ReadonlyArray<infer P> ? P : T;
+
+export function logger(msg: any, { title = 'FARM INFO', color = 'green' } = {}) {
+  const COLOR_CODE = [
+    'black',
+    'red',
+    'green',
+    'yellow',
+    'blue',
+    'magenta',
+    'cyan',
+    'white',
+  ].indexOf(color);
+  if (COLOR_CODE >= 0) {
+    const TITLE_STR = title ? `\x1b[4${COLOR_CODE};30m ${title} \x1b[0m ` : '';
+    console.log(`${TITLE_STR}\x1b[3${COLOR_CODE}m${msg}\x1b[;0m`);
+  } else {
+    console.log(title ? `${title} ${msg}` : msg);
+  }
+}
+
+export interface Deferred<T = any> {
+  resolve: (result: T) => void;
+  reject: (reason: any) => void;
+  promise: Promise<T>;
+}
+
+export const createDeferred = <T = any>(silent?: boolean) => {
+  const deferred = {} as Deferred<T>;
+
+  deferred.promise = new Promise<T>((resolve, reject) => {
+    deferred.resolve = resolve;
+    deferred.reject = reject;
+  });
+
+  if (silent) {
+    deferred.promise.catch(() => { });
+  }
+
+  return deferred;
+};
+
+
+export const concurrentify = <F extends (...args: any) => Promise<any>>(maxConcurrent: number, fn: F) => {
+  const queue = [] as {
+    deferred: Deferred;
+    args: any;
+    ctx: any;
+  }[];
+
+  let concurrent = 0;
+
+  function next() {
+    concurrent -= 1;
+    if (queue.length > 0) {
+      const { ctx, deferred, args } = queue.shift()!;
+      try {
+        // eslint-disable-next-line no-use-before-define
+        newFn.apply(ctx, args).then(deferred.resolve, deferred.reject);
+      } catch (e) {
+        deferred.reject(e);
+      }
+    }
+  }
+
+  function newFn(this: any) {
+    // eslint-disable-next-line @typescript-eslint/no-this-alias
+    const ctx = this;
+    const args = arguments as any;
+
+    if (concurrent >= maxConcurrent) {
+      const deferred = createDeferred();
+      queue.push({
+        deferred,
+        ctx,
+        args,
+      });
+      return deferred.promise;
+    }
+
+    concurrent += 1;
+
+    return fn.apply(ctx, args).finally(next);
+  }
+
+  return newFn as F;
+};
+
+export const concurrentMap = <
+  Arr extends readonly unknown[],
+  F extends (item: SimpleUnwrapArray<Arr>, index: number, arr: Arr) => Promise<any>,
+>(arr: Arr, maxConcurrent: number, cb: F) => arr.map(
+  concurrentify(maxConcurrent, cb) as any,
+) as ReturnType<F>[];

e2e/vitestGlobalSetup.ts

@@ -0,0 +1,55 @@
+import type { GlobalSetupContext } from 'vitest/node';
+import { chromium } from 'playwright-chromium';
+import type { BrowserServer } from 'playwright-chromium';
+import { createServer, Server } from 'http';
+
+let browserServer: BrowserServer | undefined;
+let client: Server | undefined;
+
+const buffer = new SharedArrayBuffer(2);
+const u16 = new Uint16Array(buffer);
+
+function addPort() {
+  return Atomics.add(u16, 0, 10);
+}
+
+function setPort(port: number) {
+  return Atomics.store(u16, 0, port);
+}
+
+setPort(9100);
+
+export async function setup({ provide }: GlobalSetupContext): Promise<void> {
+  browserServer = await chromium.launchServer({
+    headless: true
+  });
+
+  client = createServer((req, res) => {
+    if (req.url!.startsWith('/port')) {
+      res.end(addPort().toString());
+      return;
+    }
+    // not found path
+    res.statusCode = 404;
+    res.end();
+  });
+
+  client.listen(12306);
+
+  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+  // @ts-ignore
+  provide('wsEndpoint', browserServer.wsEndpoint());
+}
+
+export async function teardown(): Promise<void> {
+  await browserServer?.close();
+  await new Promise((resolve, reject) => {
+    client!.close((err) => {
+      if (err) {
+        reject(err);
+      } else {
+        resolve(undefined);
+      }
+    });
+  });
+}