Add Frontend Tests

.github/workflows/python_test.yml

@@ -0,0 +1,43 @@
+name: test
+
+on:
+ push:
+ branches: [main]
+ paths:
+ - "poetry.lock"
+ - "pyproject.toml"
+ - "src/backend/**"
+ pull_request:
+ branches: [dev]
+ paths:
+ - "poetry.lock"
+ - "pyproject.toml"
+ - "src/backend/**"
+
+env:
+ POETRY_VERSION: "1.8.2"
+
+jobs:
+ build:
+ runs-on: ubuntu-latest
+ strategy:
+ matrix:
+ python-version:
+ - "3.10"
+ - "3.11"
+ env:
+ OPENAI_API_KEY: ${{ secrets.OPENAI_API_KEY }}
+ steps:
+ - uses: actions/checkout@v4
+ - name: Install poetry
+ run: pipx install poetry==$POETRY_VERSION
+ - name: Set up Python ${{ matrix.python-version }}
+ uses: actions/setup-python@v5
+ with:
+ python-version: ${{ matrix.python-version }}
+ cache: "poetry"
+ - name: Install dependencies
+ run: poetry install
+ - name: Run unit tests
+ run: |
+ make tests

.github/workflows/test.yml

@@ -15,7 +15,7 @@ on:
  - "src/backend/**"
 
 env:
- POETRY_VERSION: "1.5.0"
+ POETRY_VERSION: "1.8.2"
 
 jobs:
  build:
@@ -37,7 +37,9 @@ jobs:
  python-version: ${{ matrix.python-version }}
  cache: "poetry"
  - name: Install dependencies
- run: poetry install
+ run: |
+ poetry env use ${{ matrix.python-version }}
+ poetry install
  - name: Run unit tests
  run: |
  make tests

.github/workflows/typescript_test.yml

@@ -0,0 +1,149 @@
+name: Run Frontend Tests
+
+on:
+ pull_request:
+ paths:
+ - "src/frontend/**"
+
+env:
+ POETRY_VERSION: "1.8.2"
+ NODE_VERSION: "21"
+ PYTHON_VERSION: "3.10"
+ # Define the directory where Playwright browsers will be installed.
+ # Adjust if your project uses a different path.
+ PLAYWRIGHT_BROWSERS_PATH: "ms-playwright"
+
+jobs:
+ setup-and-test:
+ runs-on: ubuntu-latest
+ strategy:
+ fail-fast: false
+ matrix:
+ shardIndex: [1, 2, 3, 4]
+ shardTotal: [4]
+ steps:
+ - name: Checkout code
+ uses: actions/checkout@v4
+
+ - name: Setup Node.js
+ uses: actions/setup-node@v3
+ id: setup-node
+ with:
+ node-version: ${{ env.NODE_VERSION }}
+ cache: "npm"
+
+ - name: Install Node.js dependencies
+ run: |
+ cd src/frontend
+ npm ci
+ if: ${{ steps.setup-node.outputs.cache-hit != 'true' }}
+
+ # Attempt to restore the correct Playwright browser binaries based on the
+ # currently installed version of Playwright (The browser binary versions
+ # may change with Playwright versions).
+ # Note: Playwright's cache directory is hard coded because that's what it
+ # says to do in the docs. There doesn't appear to be a command that prints
+ # it out for us.
+ # - uses: actions/cache@v4
+ # id: playwright-cache
+ # with:
+ # path: ${{ env.PLAYWRIGHT_BROWSERS_PATH }}
+ # key: "${{ runner.os }}-playwright-${{ hashFiles('src/frontend/package-lock.json') }}"
+ # # As a fallback, if the Playwright version has changed, try use the
+ # # most recently cached version. There's a good chance that at least one
+ # # of the browser binary versions haven't been updated, so Playwright can
+ # # skip installing that in the next step.
+ # # Note: When falling back to an old cache, `cache-hit` (used below)
+ # # will be `false`. This allows us to restore the potentially out of
+ # # date cache, but still let Playwright decide if it needs to download
+ # # new binaries or not.
+ # restore-keys: |
+ # ${{ runner.os }}-playwright-
+ - name: Cache playwright binaries
+ uses: actions/cache@v4
+ id: playwright-cache
+ with:
+ path: |
+ ~/.cache/ms-playwright
+ key: ${{ runner.os }}-playwright-${{ hashFiles('src/frontend/package-lock.json') }}
+ - name: Install Frontend dependencies
+ run: |
+ cd src/frontend
+ npm ci
+
+ - name: Install Playwright's browser binaries
+ run: |
+ cd src/frontend
+ npx playwright install --with-deps
+ if: steps.playwright-cache.outputs.cache-hit != 'true'
+ - name: Install Playwright's dependencies
+ run: |
+ cd src/frontend
+ npx playwright install-deps
+ if: steps.playwright-cache.outputs.cache-hit != 'true'
+
+ # If the Playwright browser binaries weren't able to be restored, we tell
+ # paywright to install everything for us.
+ # - name: Install Playwright's dependencies
+ # if: steps.playwright-cache.outputs.cache-hit != 'true'
+ # run: npx playwright install --with-deps
+
+ - name: Install Poetry
+ run: pipx install "poetry==${{ env.POETRY_VERSION }}"
+
+ - name: Set up Python
+ uses: actions/setup-python@v5
+ id: setup-python
+ with:
+ python-version: ${{ env.PYTHON_VERSION }}
+ cache: "poetry"
+
+ - name: Install Python dependencies
+ run: |
+ poetry env use ${{ env.PYTHON_VERSION }}
+ poetry install
+ if: ${{ steps.setup-python.outputs.cache-hit != 'true' }}
+
+ - name: Run Playwright Tests
+ run: |
+ cd src/frontend
+ npx playwright test --shard=${{ matrix.shardIndex }}/${{ matrix.shardTotal }}
+
+ - name: Upload blob report to GitHub Actions Artifacts
+ if: always()
+ uses: actions/upload-artifact@v4
+ with:
+ name: blob-report-${{ matrix.shardIndex }}
+ path: src/frontend/blob-report
+ retention-days: 1
+
+ merge-reports:
+ needs: setup-and-test
+ runs-on: ubuntu-latest
+ if: always()
+ steps:
+ - name: Checkout code
+ uses: actions/checkout@v4
+
+ - name: Setup Node.js
+ uses: actions/setup-node@v3
+ with:
+ node-version: ${{ env.NODE_VERSION }}
+
+ - name: Download blob reports from GitHub Actions Artifacts
+ uses: actions/download-artifact@v4
+ with:
+ path: all-blob-reports
+ pattern: blob-report-*
+ merge-multiple: true
+
+ - name: Merge into HTML Report
+ run: |
+ npx playwright merge-reports --reporter html ./all-blob-reports
+
+ - name: Upload HTML report
+ uses: actions/upload-artifact@v4
+ with:
+ name: html-report--attempt-${{ github.run_attempt }}
+ path: playwright-report
+ retention-days: 14

.gitignore

@@ -262,3 +262,5 @@ src/backend/base/langflow/frontend/
 .docker
 scratchpad*
 chroma*/*
+stuff/*
+src/frontend/playwright-report/index.html

Makefile

@@ -47,9 +47,9 @@ run_frontend:
 
 tests_frontend:
 ifeq ($(UI), true)
- cd src/frontend && ./run-tests.sh --ui
+ cd src/frontend && npx playwright test --ui --project=chromium
 else
- cd src/frontend && ./run-tests.sh
+ cd src/frontend && npx playwright test --project=chromium
 endif
 
 run_cli:

src/frontend/playwright.config.ts

@@ -12,26 +12,30 @@ import { defineConfig, devices } from "@playwright/test";
 export default defineConfig({
  testDir: "./tests",
  /* Run tests in files in parallel */
- fullyParallel: false,
+ fullyParallel: true,
  /* Fail the build on CI if you accidentally left test.only in the source code. */
  forbidOnly: !!process.env.CI,
  /* Retry on CI only */
  retries: process.env.CI ? 2 : 0,
  /* Opt out of parallel tests on CI. */
  workers: process.env.CI ? 2 : undefined,
  /* Reporter to use. See https://playwright.dev/docs/test-reporters */
- reporter: [
- ["html", { open: "never", outputFolder: "playwright-report/test-results" }],
- ],
+ timeout: 120 * 1000,
+ // reporter: [
+ // ["html", { open: "never", outputFolder: "playwright-report/test-results" }],
+ // ],
+ reporter: process.env.CI ? "blob" : "html",
  /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
  use: {
  /* Base URL to use in actions like `await page.goto('/')`. */
- // baseURL: "http://127.0.0.1:3000",
+ baseURL: "http://localhost:3000/",
 
  /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
  trace: "on-first-retry",
  },
 
+ globalTeardown: require.resolve("./tests/globalTeardown.ts"),
+
  /* Configure projects for major browsers */
  projects: [
  {
@@ -48,39 +52,28 @@ export default defineConfig({
  // name: "webkit",
  // use: { ...devices["Desktop Safari"] },
  // },
-
- /* Test against mobile viewports. */
- // {
- // name: 'Mobile Chrome',
- // use: { ...devices['Pixel 5'] },
- // },
- // {
- // name: 'Mobile Safari',
- // use: { ...devices['iPhone 12'] },
- // },
-
- /* Test against branded browsers. */
- // {
- // name: 'Microsoft Edge',
- // use: { ...devices['Desktop Edge'], channel: 'msedge' },
- // },
- // {
- // name: 'Google Chrome',
- // use: { ...devices['Desktop Chrome'], channel: 'chrome' },
- // },
  ],
-
  /* Run your local dev server before starting the tests */
- // webServer: [
- // {
- // command: "npm run backend",
- // reuseExistingServer: !process.env.CI,
- // timeout: 120 * 1000,
- // },
- // {
- // command: "npm run start",
- // url: "http://127.0.0.1:3000",
- // reuseExistingServer: !process.env.CI,
- // },
- // ],
+ webServer: [
+ {
+ command:
+ "poetry run uvicorn --factory langflow.main:create_app --host 127.0.0.1 --port 7860",
+ port: 7860,
+ env: {
+ LANGFLOW_DATABASE_URL: "sqlite:///./temp",
+ LANGFLOW_AUTO_LOGIN: "true",
+ },
+ stdout: "ignore",
+
+ reuseExistingServer: !process.env.CI,
+ timeout: 120 * 1000,
+ },
+ {
+ command: "npm start",
+ port: 3000,
+ env: {
+ VITE_PROXY_TARGET: "http://127.0.0.1:7860",
+ },
+ },
+ ],
 });