Improved Tiled API Client with new Graph API

.github/workflows/test-summary.yml

@@ -11,7 +11,7 @@ permissions:
 
 jobs:
   comment:
-    runs-on: ubuntu-latest
+    runs-on: ubuntu-24.04
     if: github.event.workflow_run.event == 'pull_request'
 
     steps:
@@ -30,7 +30,7 @@ jobs:
 
       - name: Download test artifacts
         if: steps.pr.outputs.number != ''
-        uses: actions/download-artifact@v4
+        uses: actions/download-artifact@v8
         with:
           name: test-results-node-20.x
           run-id: ${{ github.event.workflow_run.id }}
@@ -39,7 +39,7 @@ jobs:
 
       - name: Comment PR with test summary
         if: steps.pr.outputs.number != ''
-        uses: actions/github-script@v6
+        uses: actions/github-script@v9
         with:
           script: |
             const fs = require('fs');
@@ -62,15 +62,20 @@ jobs:
             const emoji = testStatus === 'success' ? '✅' : '❌';
             const message = testStatus === 'success' ? 'All tests passed!' : 'Some tests failed.';
 
-            // Get the job outputs to determine individual step results
-            const jobs = await github.rest.actions.listJobsForWorkflowRun({
-              owner: context.repo.owner,
-              repo: context.repo.repo,
-              run_id: ${{ github.event.workflow_run.id }},
-            });
-
-            const testJob = jobs.data.jobs.find(job => job.name.includes('test'));
-            const steps = testJob ? testJob.steps : [];
+            // Prefer step outcomes recorded by the test workflow; the jobs API
+            // sometimes returns an empty steps array.
+            let steps = [];
+            try {
+              steps = JSON.parse(fs.readFileSync('step-outcomes.json', 'utf8'));
+            } catch (e) {
+              const jobs = await github.rest.actions.listJobsForWorkflowRun({
+                owner: context.repo.owner,
+                repo: context.repo.repo,
+                run_id: ${{ github.event.workflow_run.id }},
+              });
+              const testJob = jobs.data.jobs.find(job => job.name.includes('test'));
+              steps = testJob ? testJob.steps : [];
+            }
 
             const lintStep = steps.find(step => step.name === 'Run linting');
             const formatStep = steps.find(step => step.name === 'Run formatting check');

.github/workflows/test.yml

@@ -8,133 +8,151 @@
 
 jobs:
   test:
-    runs-on: ubuntu-latest
+    runs-on: ubuntu-24.04
 
     strategy:
       matrix:
         node-version: [20.x]
 
     steps:
       - name: Checkout code
-        uses: actions/checkout@v4
+        uses: actions/checkout@v7
 
       - name: Setup Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v4
+        uses: actions/setup-node@v7
         with:
           node-version: ${{ matrix.node-version }}
           cache: 'npm'
 
       - name: Install dependencies
         run: npm ci
 
       - name: Run linting
+        id: lint
         run: |
           npm run lint 2>&1 | tee lint-output.txt
           exit ${PIPESTATUS[0]}
         continue-on-error: true
 
       - name: Run formatting check
+        id: format
         run: |
           npm run format 2>&1 | tee format-output.txt
           exit ${PIPESTATUS[0]}
         continue-on-error: true
 
       - name: Run type checking and build
+        id: build
         run: npm run build
         continue-on-error: false
 
       - name: Run specific test suites
+        id: tests
         run: |
           echo "Running individual test suites for better visibility..."
           npm run test:run -- src/testing/tests/BeamEnergy.test.tsx
           npm run test:run -- src/testing/tests/Bento.test.tsx
           npm run test:run -- src/testing/tests/Button.test.tsx
           npm run test:run -- src/testing/tests/ButtonCopyToClipboard.test.tsx
           npm run test:run -- src/testing/tests/ButtonIconOnly.test.tsx
           npm run test:run -- src/testing/tests/ButtonWithIcon.test.tsx
           npm run test:run -- src/testing/tests/Camera.test.tsx
           npm run test:run -- src/testing/tests/ColormapPicker.test.tsx
           npm run test:run -- src/testing/tests/ComponentViewer.test.tsx
           npm run test:run -- src/testing/tests/ComponentViewerUtils.test.tsx
           npm run test:run -- src/testing/tests/ControllerAbsoluteMove.test.tsx
           npm run test:run -- src/testing/tests/ControllerRelativeMove.test.tsx
           npm run test:run -- src/testing/tests/DeviceControllerBox.test.tsx
           npm run test:run -- src/testing/tests/DeviceControllerBoxSimple.test.tsx
           npm run test:run -- src/testing/tests/Experiment.test.tsx
           npm run test:run -- src/testing/tests/FinchAppLayout.test.tsx
           npm run test:run -- src/testing/tests/FinchHeader.test.tsx
           npm run test:run -- src/testing/tests/FinchMainContent.test.tsx
           npm run test:run -- src/testing/tests/FinchPageTabs.test.tsx
           npm run test:run -- src/testing/tests/FinchSidebar.test.tsx
           npm run test:run -- src/testing/tests/GoogleDoc.test.tsx
           npm run test:run -- src/testing/tests/Header.test.tsx
           npm run test:run -- src/testing/tests/Hexapod.test.tsx
           npm run test:run -- src/testing/tests/Histogram.test.tsx
           npm run test:run -- src/testing/tests/IFrame.test.tsx
           npm run test:run -- src/testing/tests/InputCheckBox.test.tsx
           npm run test:run -- src/testing/tests/InputEnumBoxRounded.test.tsx
           npm run test:run -- src/testing/tests/InputNumber.test.tsx
           npm run test:run -- src/testing/tests/InputStringBoxRounded.test.tsx
           npm run test:run -- src/testing/tests/Main.test.tsx
           npm run test:run -- src/testing/tests/Paper.test.tsx
           npm run test:run -- src/testing/tests/PlotlyHeatmap.test.tsx
           npm run test:run -- src/testing/tests/PlotlyHeatmapTiled.test.tsx
           npm run test:run -- src/testing/tests/PlotlyScatter.test.tsx
           npm run test:run -- src/testing/tests/QSConsoleFormatting.test.tsx
           npm run test:run -- src/testing/tests/QueueServer.test.tsx
           npm run test:run -- src/testing/tests/SelectDropdown.test.tsx
           npm run test:run -- src/testing/tests/Shutter.test.tsx
           npm run test:run -- src/testing/tests/Sidebar.test.tsx
           npm run test:run -- src/testing/tests/SidebarItem.test.tsx
           npm run test:run -- src/testing/tests/SignalMonitorPlots.test.tsx
           npm run test:run -- src/testing/tests/TableDeviceController.test.tsx
           npm run test:run -- src/testing/tests/TiledComponents.test.tsx
           npm run test:run -- src/testing/tests/TiledLinePlotMaker.test.tsx
           npm run test:run -- src/testing/tests/Widget.test.tsx
           npm run test:run -- src/testing/tests/useActiveRoute.test.tsx
           echo "Running queue server client test suites..."
           npm run test:run -- src/testing/tests/QServerRegistry.test.tsx
           npm run test:run -- src/testing/tests/QServerClient.test.tsx
           npm run test:run -- src/testing/tests/QServerSockets.test.tsx
           npm run test:run -- src/testing/tests/QServerHooks.test.tsx
           echo "Running tiled query hook test suite..."
           npm run test:run -- src/testing/tests/TiledHooks.test.tsx
           echo "Running qserver sim test suites..."
           npm run test:run -- src/testing/tests/qserver-sim/status.test.ts
           npm run test:run -- src/testing/tests/qserver-sim/uids.test.ts
           npm run test:run -- src/testing/tests/qserver-sim/lifecycle.test.ts
           npm run test:run -- src/testing/tests/qserver-sim/scenarios.test.ts
           npm run test:run -- src/testing/tests/qserver-sim/consoleMessages.test.ts
           npm run test:run -- src/testing/tests/qserver-sim/clientSeams.test.ts
           npm run test:run -- src/testing/tests/qserver-sim/sockets.test.ts
           npm run test:run -- src/testing/tests/qserver-sim/QServerSimDemo.test.tsx
           npm run test:run -- src/testing/tests/qserver-sim/hooks.test.tsx
           npm run test:run -- src/testing/tests/qserver-sim/QSConsole.test.tsx
           npm run test:run -- src/testing/tests/qserver-sim/Experiment.test.tsx
           echo "Running ophyd sim test suites..."
           npm run test:run -- src/testing/tests/BeamstopModel.test.tsx
           npm run test:run -- src/testing/tests/createFallbackTransport.test.ts
           npm run test:run -- src/testing/tests/simCameraSocket.test.ts
           npm run test:run -- src/testing/tests/ophyd-sim/dependencyGraph.test.ts
           npm run test:run -- src/testing/tests/ophyd-sim/detector.test.ts
           npm run test:run -- src/testing/tests/ophyd-sim/hexapod.test.ts
           npm run test:run -- src/testing/tests/ophyd-sim/motor.test.ts
           npm run test:run -- src/testing/tests/ophyd-sim/shutter.test.ts
           npm run test:run -- src/testing/tests/ophyd-sim/signal.test.ts
           npm run test:run -- src/testing/tests/ophyd-sim/state.test.ts
           npm run test:run -- src/testing/tests/ophyd-sim/transport.test.ts
           npm run test:run -- src/testing/tests/ophyd-sim/useOphydPVSocket.integration.test.tsx
         env:
           CI: true
 
+      # Record step outcomes ourselves; the jobs API sometimes returns no step data.
+      - name: Record step outcomes
+        if: always()
+        run: |
+          cat > step-outcomes.json <<EOF
+          [
+            { "name": "Run linting", "conclusion": "${{ steps.lint.outcome }}" },
+            { "name": "Run formatting check", "conclusion": "${{ steps.format.outcome }}" },
+            { "name": "Run type checking and build", "conclusion": "${{ steps.build.outcome }}" },
+            { "name": "Run specific test suites", "conclusion": "${{ steps.tests.outcome }}" }
+          ]
+          EOF
+
       - name: Upload test results
-        uses: actions/upload-artifact@v4
+        uses: actions/upload-artifact@v7
         if: always()
         with:
           name: test-results-node-${{ matrix.node-version }}
           path: |
             coverage/
             test-results/
             lint-output.txt
             format-output.txt
+            step-outcomes.json
           retention-days: 30

package.json

@@ -93,6 +93,7 @@
     "eslint-plugin-storybook": "^0.11.2",
     "gh-pages": "^6.3.0",
     "globals": "^15.13.0",
+    "graphql": "^16.14.2",
     "happy-dom": "^20.8.3",
     "husky": "^9.1.7",
     "jsdom": "^28.1.0",

src/api/qServer/README.md

@@ -395,7 +395,8 @@ RE Manager v0.0.19.
 
 `src/components/QServerTest/TestQserver.tsx` renders every registry entry with an editable
 payload, runs the three sockets in both auth modes, and exercises the interceptor utilities.
-It is wired into `src/app/pages/TestPage.tsx`.
+It is **not currently mounted** anywhere: the Test route's tabs (`src/app/App.tsx`) are
+Experiment, Tiled API and Tiled Queries. Adding it back is one more entry in that `tabs` array.
 
 ## Differences from `src/api/qServer`