Skip to main content

Command Palette

Search for a command to run...

SpriteDX - Gray Screen - Oops

Updated
โ€ข2 min read
SpriteDX - Gray Screen - Oops

Got a blank screen today due to a faulty deployment yesterday. Just reverted it but kinda embarrassing for an tech lead guy with more than a decade of experience. And, its been out for probably for a whole day. ๐Ÿ™ˆ

To reduce of chance of such embarrassment, Iโ€™m adding some daily screenshot testing. We will use

name: Daily Screenshot Monitoring

on:
  schedule:
    # Run every day at 8 AM UTC (adjust timezone as needed)
    - cron: '0 8 * * *'
  workflow_dispatch: # Allow manual trigger for testing

jobs:
  screenshot:
    runs-on: ubuntu-latest

    steps:
      - name: Checkout code
        uses: actions/checkout@v4

      - name: Setup Node.js
        uses: actions/setup-node@v4
        with:
          node-version: '20'
          cache: 'npm'
          cache-dependency-path: ui/package-lock.json

      - name: Install dependencies
        working-directory: ui
        run: npm ci

      - name: Install Playwright browsers
        working-directory: ui
        run: npx playwright install --with-deps chromium

      - name: Run screenshot tests
        working-directory: ui
        run: npx playwright test tests/screenshots.spec.ts
        continue-on-error: true

      - name: Upload screenshots
        if: always()
        uses: actions/upload-artifact@v4
        with:
          name: screenshots-${{ github.run_number }}
          path: ui/screenshots/
          retention-days: 90

      - name: Send email notification
        if: always()
        uses: dawidd6/action-send-mail@v3
        with:
          server_address: smtp.resend.com
          server_port: 465
          username: resend
          password: ${{ secrets.RESEND_API_KEY }}
          subject: "Sprite DX Daily Screenshots - ${{ github.run_number }}"
          to: ${{ secrets.NOTIFICATION_EMAIL }}
          from: screenshots@spritedx.com
          body: |
            Daily screenshot monitoring completed.

            Run: ${{ github.run_number }}
            Date: ${{ github.event.repository.updated_at }}

            View full report and screenshots:
            ${{ github.server_url }}/${{ github.repository }}/actions/runs/${{ github.run_id }}
          attachments: ui/screenshots/*.png

Resulting Email:

โ€” Sprited Dev ๐Ÿ›