Merge pull request #572 from dev-five-git/improve-dev

Improve dev

Author: owjs3901

.changepacks/changepack_log_BXwPLkY765Ki1-2KuPckk.json

@@ -0,0 +1 @@
+{"changes":{"packages/eslint-plugin/package.json":"Patch","packages/next-plugin/package.json":"Patch","bindings/devup-ui-wasm/package.json":"Patch"},"note":"Refactor build and dev process","date":"2026-02-11T17:09:50.999761800Z"}

.changepacks/changepack_log_tuDvuARnGW9uutvLp5v-a.json

@@ -0,0 +1 @@
+{"changes":{"bindings/devup-ui-wasm/package.json":"Patch"},"note":"Optimize","date":"2026-02-11T17:10:04.282365Z"}

.github/workflows/publish.yml

@@ -91,15 +91,43 @@ jobs:
           bun run --filter landing build
       - name: Install Playwright Browsers
         run: bunx playwright install chromium --with-deps
+      - name: Check for Existing E2E Snapshots
+        id: check-snapshots
+        run: |
+          SNAPSHOT_COUNT=$(find e2e -name '*.png' -path '*-snapshots/*' 2>/dev/null | wc -l)
+          echo "count=$SNAPSHOT_COUNT" >> $GITHUB_OUTPUT
+          echo "Found $SNAPSHOT_COUNT existing snapshot(s)"
+      - name: Generate E2E Snapshots
+        if: steps.check-snapshots.outputs.count == '0'
+        run: bunx playwright test --update-snapshots
+      - name: Commit E2E Snapshots
+        if: steps.check-snapshots.outputs.count == '0' && github.event_name == 'pull_request'
+        uses: stefanzweifel/git-auto-commit-action@v5
+        with:
+          commit_message: "chore: generate e2e visual snapshots from CI"
+          file_pattern: "e2e/**/*-snapshots/*.png"
       - name: Run E2E Tests
         run: bun run test:e2e
       - name: Upload artifact
-        uses: actions/upload-pages-artifact@v3
-        with:
-          path: ./apps/landing/out
-        if: github.event_name == 'push' && github.ref == 'refs/heads/main'
-      - uses: actions/deploy-pages@v4
-        if: github.event_name == 'push' && github.ref == 'refs/heads/main'
+        uses: actions/upload-pages-artifact@v3
+        with:
+          path: ./apps/landing/out
+        if: github.event_name == 'push' && github.ref == 'refs/heads/main'
+      - uses: actions/deploy-pages@v4
+        if: github.event_name == 'push' && github.ref == 'refs/heads/main'
+      - name: Build Landing (singleCss)
+        run: |
+          rm -rf apps/landing/out apps/landing/.next apps/landing/df
+          DEVUP_SINGLE_CSS=1 bun run --filter landing build
+      - name: Run E2E Tests (singleCss)
+        run: bun run test:e2e
+      - name: Upload singleCss Playwright Report
+        uses: actions/upload-artifact@v4
+        if: ${{ !cancelled() }}
+        with:
+          name: playwright-report-singlecss
+          path: playwright-report/
+          retention-days: 30
       - name: Upload to codecov.io
         uses: codecov/codecov-action@v5
         with:

apps/landing/next.config.ts

@@ -6,9 +6,14 @@ const withMDX = createMDX({
 })
 
 export default withMDX(
-  DevupUI({
-    pageExtensions: ['js', 'jsx', 'md', 'mdx', 'ts', 'tsx'],
-    output: 'export',
-    reactCompiler: true,
-  }),
+  DevupUI(
+    {
+      pageExtensions: ['js', 'jsx', 'md', 'mdx', 'ts', 'tsx'],
+      output: 'export',
+      reactCompiler: true,
+    },
+    {
+      singleCss: process.env.DEVUP_SINGLE_CSS === '1',
+    },
+  ),
 )

bun.lock

@@ -185,18 +185,17 @@ test.describe('Documentation Pages', () => {
       await context.close()
     })
 
-    // Dark mode screenshot requires JS for ThemeScript to set data-theme attribute.
-    // With javaScriptEnabled: false, the theme cannot switch to dark mode.
-    // Using colorScheme: 'dark' in context only sets prefers-color-scheme media,
-    // which is insufficient if the app relies on a JS-driven theme class/attribute.
-    test.skip('dark mode features section screenshot', async ({ browser }) => {
+    test('dark mode features section screenshot', async ({ browser }) => {
       const context = await browser.newContext({
-        javaScriptEnabled: false,
         viewport: { width: 1440, height: 900 },
         colorScheme: 'dark',
       })
       const page = await context.newPage()
       await page.goto('/')
+      await page.waitForLoadState('networkidle')
+      await page.evaluate(() =>
+        document.documentElement.setAttribute('data-theme', 'dark'),
+      )
       await page.waitForTimeout(500)
 
       const features = page.getByText('Features').first()

e2e/docs-pages.spec.ts

@@ -55,8 +55,7 @@
     "@devup-ui/plugin-utils": "workspace:^",
     "@devup-ui/webpack-plugin": "workspace:^",
     "next": "^16.1",
-    "@devup-ui/wasm": "workspace:^",
-    "tinyglobby": "^0.2"
+    "@devup-ui/wasm": "workspace:^"
   },
   "devDependencies": {
     "typescript": "^5.9",