Configure Multiple Projects per repo

SmartUI allows you to manage and test UI components effectively within a single repository. By organizing multiple projects in a single repository, you can centralize your workflows and streamline collaboration. This guide will walk you through setting up multiple projects in a repository for SmartUI and how you can trigger the same via GitHub Actions pipeline.

Setting Up Multiple Projects in a Repository

Prerequisites

• Your LambdaTest Username and Access key.
• Your SmartUI Project Token

Step 1: Organize Your Repository

Create a repository where you can organize your projects into various directories. You can use your own project to configure and test it. For demo purposes, we are using the sample repository.

Sample repo

Download or Clone the code sample from the LambdaTest GitHub repository to run the tests on the SmartUI. View on GitHub

Step 2: Create your Secrets

• Click on the Settings of your repository.
• Go to the Security option > Secrets and Variables > Actions.
• Create your secrets with variable name LT_USERNAME and LT_ACCESS_KEY. You can fetch your credentials from the Accounts and Settings dashboard.

Step 3: Create your GitHub Actions Workflow

• Navigate to the main page of the repository.
• Under your repository name, click Actions.
• In the left sidebar, click the New workflow button.

.github/workflows/main.yml

name: SmartUI Monorepo GitHub Actions

on:
  workflow_dispatch:
    inputs:
      project_token_1:
        description: Project Token - SDK
        required: true
      project_token_2:
        description: Project Token - Storybook
        required: true

env:
  LT_USERNAME: ${{ secrets.LT_USERNAME }}
  LT_ACCESS_KEY: ${{ secrets.LT_ACCESS_KEY }}

jobs:
  smartui_tests:
    name: Execute SmartUI Tests - Monorepo
    runs-on: ubuntu-latest
    steps:
      # Checkout repository
      - name: Checkout Repository
        uses: actions/checkout@v2
        with:
          fetch-depth: 0

      # SmartUI SDK Tests
      - name: Execute SmartUI SDK Tests
        run: echo "Starting SDK tests"

      - name: Install SDK Dependencies
        run: |
          cd sdk
          npm install @lambdatest/smartui-cli

      - name: Run SDK Test Commands
        env:
          PROJECT_TOKEN: ${{ github.event.inputs.project_token_1 }}
        run: |
          npx smartui --version
          npx smartui config:create smartui-web.json
          npx smartui --config smartui-web.json exec -- mvn --quiet test -D suite=sdk-cloud.xml
        working-directory: sdk

      # SmartUI Storybook Tests
      - name: Execute SmartUI Storybook Tests
        run: echo "Starting Storybook tests"

      - name: Install Storybook Dependencies and create storybook static build
        run: |
          cd storybook
          pwd
          npm install --legacy-peer-deps
          npm install @lambdatest/smartui-storybook -g
          npm run build-storybook 

      - name: Run Storybook Test Commands
        env:
          PROJECT_TOKEN: ${{ github.event.inputs.project_token_2 }}
        run: |
          npx smartui --version
          npx smartui config create .smartui.json
          npx smartui storybook ./storybook-static --config .smartui.json
        working-directory: storybook

View on GitHub

Step 4: Execute your projects

• Click on the Actions button of your repository to trigger the pipeline.
• Provide the PROJECT TOKEN to trigger your code projects.
• Go to the SmartUI Dashboard to check the results.