use our new watchBulkOperation rendering when --watch is provided

jordanverasamy · jordanverasamy · commit 4d5faaf00621 · 2025-11-21T15:10:55.000-08:00
diff --git a/packages/app/src/cli/commands/app/execute.ts b/packages/app/src/cli/commands/app/execute.ts
@@ -39,6 +39,7 @@ export default class Execute extends AppLinkedCommand {
       storeFqdn: store.shopDomain,
       query: flags.query,
       variables: flags.variables,
+      watch: flags.watch,
     })
 
     return {app: appContextResult.app}
diff --git a/packages/app/src/cli/flags.ts b/packages/app/src/cli/flags.ts
@@ -55,4 +55,9 @@ export const bulkOperationFlags = {
     env: 'SHOPIFY_FLAG_STORE',
     parse: async (input) => normalizeStoreFqdn(input),
   }),
+  watch: Flags.boolean({
+    description: 'Wait for bulk operation results before exiting.',
+    env: 'SHOPIFY_FLAG_WATCH',
+    default: false,
+  }),
 }
diff --git a/packages/app/src/cli/services/bulk-operations/execute-bulk-operation.test.ts b/packages/app/src/cli/services/bulk-operations/execute-bulk-operation.test.ts
@@ -1,13 +1,17 @@
 import {executeBulkOperation} from './execute-bulk-operation.js'
 import {runBulkOperationQuery} from './run-query.js'
 import {runBulkOperationMutation} from './run-mutation.js'
+import {watchBulkOperation} from './watch-bulk-operation.js'
 import {AppLinkedInterface} from '../../models/app/app.js'
-import {renderSuccess, renderWarning} from '@shopify/cli-kit/node/ui'
+import {BulkOperationRunQueryMutation} from '../../api/graphql/bulk-operations/generated/bulk-operation-run-query.js'
+import {BulkOperationRunMutationMutation} from '../../api/graphql/bulk-operations/generated/bulk-operation-run-mutation.js'
+import {renderSuccess, renderWarning, renderError} from '@shopify/cli-kit/node/ui'
 import {ensureAuthenticatedAdmin} from '@shopify/cli-kit/node/session'
 import {describe, test, expect, vi, beforeEach} from 'vitest'
 
 vi.mock('./run-query.js')
 vi.mock('./run-mutation.js')
+vi.mock('./watch-bulk-operation.js')
 vi.mock('@shopify/cli-kit/node/ui')
 vi.mock('@shopify/cli-kit/node/session')
 
@@ -19,14 +23,21 @@ describe('executeBulkOperation', () => {
   const storeFqdn = 'test-store.myshopify.com'
   const mockAdminSession = {token: 'test-token', storeFqdn}
 
-  const successfulBulkOperation = {
+  const createdBulkOperation: NonNullable<
+    NonNullable<BulkOperationRunQueryMutation['bulkOperationRunQuery']>['bulkOperation']
+  > = {
     id: 'gid://shopify/BulkOperation/123',
     status: 'CREATED',
     errorCode: null,
     createdAt: '2024-01-01T00:00:00Z',
     objectCount: '0',
     fileSize: '0',
     url: null,
+    query: '{ products { edges { node { id } } } }',
+    rootObjectCount: '0',
+    type: 'QUERY',
+    completedAt: null,
+    partialDataUrl: null,
   }
 
   beforeEach(() => {
@@ -35,11 +46,11 @@ describe('executeBulkOperation', () => {
 
   test('runs query operation when GraphQL document starts with query', async () => {
     const query = 'query { products { edges { node { id } } } }'
-    const mockResponse = {
-      bulkOperation: successfulBulkOperation,
+    const mockResponse: BulkOperationRunQueryMutation['bulkOperationRunQuery'] = {
+      bulkOperation: createdBulkOperation,
       userErrors: [],
     }
-    vi.mocked(runBulkOperationQuery).mockResolvedValue(mockResponse as any)
+    vi.mocked(runBulkOperationQuery).mockResolvedValue(mockResponse)
 
     await executeBulkOperation({
       app: mockApp,
@@ -57,11 +68,11 @@ describe('executeBulkOperation', () => {
 
   test('runs query operation when GraphQL document starts with curly brace', async () => {
     const query = '{ products { edges { node { id } } } }'
-    const mockResponse = {
-      bulkOperation: successfulBulkOperation,
+    const mockResponse: BulkOperationRunQueryMutation['bulkOperationRunQuery'] = {
+      bulkOperation: createdBulkOperation,
       userErrors: [],
     }
-    vi.mocked(runBulkOperationQuery).mockResolvedValue(mockResponse as any)
+    vi.mocked(runBulkOperationQuery).mockResolvedValue(mockResponse)
 
     await executeBulkOperation({
       app: mockApp,
@@ -79,11 +90,11 @@ describe('executeBulkOperation', () => {
 
   test('runs mutation operation when GraphQL document starts with mutation', async () => {
     const mutation = 'mutation productUpdate($input: ProductInput!) { productUpdate(input: $input) { product { id } } }'
-    const mockResponse = {
-      bulkOperation: successfulBulkOperation,
+    const mockResponse: BulkOperationRunMutationMutation['bulkOperationRunMutation'] = {
+      bulkOperation: createdBulkOperation,
       userErrors: [],
     }
-    vi.mocked(runBulkOperationMutation).mockResolvedValue(mockResponse as any)
+    vi.mocked(runBulkOperationMutation).mockResolvedValue(mockResponse)
 
     await executeBulkOperation({
       app: mockApp,
@@ -102,11 +113,11 @@ describe('executeBulkOperation', () => {
   test('passes variables to mutation when provided with `--variables` flag', async () => {
     const mutation = 'mutation productUpdate($input: ProductInput!) { productUpdate(input: $input) { product { id } } }'
     const variables = ['{"input":{"id":"gid://shopify/Product/123","tags":["test"]}}']
-    const mockResponse = {
-      bulkOperation: successfulBulkOperation,
+    const mockResponse: BulkOperationRunMutationMutation['bulkOperationRunMutation'] = {
+      bulkOperation: createdBulkOperation,
       userErrors: [],
     }
-    vi.mocked(runBulkOperationMutation).mockResolvedValue(mockResponse as any)
+    vi.mocked(runBulkOperationMutation).mockResolvedValue(mockResponse)
 
     await executeBulkOperation({
       app: mockApp,
@@ -124,33 +135,34 @@ describe('executeBulkOperation', () => {
 
   test('renders success message when bulk operation is created', async () => {
     const query = '{ products { edges { node { id } } } }'
-    const mockResponse = {
-      bulkOperation: successfulBulkOperation,
+    const mockResponse: BulkOperationRunQueryMutation['bulkOperationRunQuery'] = {
+      bulkOperation: createdBulkOperation,
       userErrors: [],
     }
-    vi.mocked(runBulkOperationQuery).mockResolvedValue(mockResponse as any)
+    vi.mocked(runBulkOperationQuery).mockResolvedValue(mockResponse)
     await executeBulkOperation({
       app: mockApp,
       storeFqdn,
       query,
     })
 
-    expect(renderSuccess).toHaveBeenCalledWith({
-      headline: 'Bulk operation started successfully!',
-      body: 'Congrats!',
-    })
+    expect(renderSuccess).toHaveBeenCalledWith(
+      expect.objectContaining({
+        headline: 'Bulk operation started.',
+      }),
+    )
   })
 
   test('renders warning when user errors are present', async () => {
     const query = '{ products { edges { node { id } } } }'
-    const mockResponse = {
+    const mockResponse: BulkOperationRunQueryMutation['bulkOperationRunQuery'] = {
       bulkOperation: null,
       userErrors: [
-        {field: ['query'], message: 'Invalid query syntax'},
-        {field: null, message: 'Another error'},
+        {field: ['query'], message: 'Invalid query syntax', code: null},
+        {field: null, message: 'Another error', code: null},
       ],
     }
-    vi.mocked(runBulkOperationQuery).mockResolvedValue(mockResponse as any)
+    vi.mocked(runBulkOperationQuery).mockResolvedValue(mockResponse)
 
     await executeBulkOperation({
       app: mockApp,
@@ -165,4 +177,70 @@ describe('executeBulkOperation', () => {
 
     expect(renderSuccess).not.toHaveBeenCalled()
   })
+
+  test('waits for operation to finish and renders success when watch is provided and operation finishes with COMPLETED status', async () => {
+    const query = '{ products { edges { node { id } } } }'
+    const initialResponse: BulkOperationRunQueryMutation['bulkOperationRunQuery'] = {
+      bulkOperation: createdBulkOperation,
+      userErrors: [],
+    }
+    const completedOperation = {
+      ...createdBulkOperation,
+      status: 'COMPLETED' as const,
+      url: 'https://example.com/download',
+      objectCount: '650',
+    }
+
+    vi.mocked(runBulkOperationQuery).mockResolvedValue(initialResponse)
+    vi.mocked(watchBulkOperation).mockResolvedValue(completedOperation)
+
+    await executeBulkOperation({
+      app: mockApp,
+      storeFqdn,
+      query,
+      watch: true,
+    })
+
+    expect(watchBulkOperation).toHaveBeenCalledWith(mockAdminSession, createdBulkOperation.id)
+    expect(renderSuccess).toHaveBeenCalledWith(
+      expect.objectContaining({
+        headline: expect.stringContaining('Bulk operation succeeded.'),
+        body: expect.arrayContaining([expect.stringContaining('https://example.com/download')]),
+      }),
+    )
+  })
+
+  test.each(['FAILED', 'CANCELED', 'EXPIRED'] as const)(
+    'waits for operation to finish and renders error when watch is provided and operation finishes with %s status',
+    async (status) => {
+      const query = '{ products { edges { node { id } } } }'
+      const initialResponse: BulkOperationRunQueryMutation['bulkOperationRunQuery'] = {
+        bulkOperation: createdBulkOperation,
+        userErrors: [],
+      }
+      const finishedOperation = {
+        ...createdBulkOperation,
+        status,
+        objectCount: '100',
+      }
+
+      vi.mocked(runBulkOperationQuery).mockResolvedValue(initialResponse)
+      vi.mocked(watchBulkOperation).mockResolvedValue(finishedOperation)
+
+      await executeBulkOperation({
+        app: mockApp,
+        storeFqdn,
+        query,
+        watch: true,
+      })
+
+      expect(watchBulkOperation).toHaveBeenCalledWith(mockAdminSession, createdBulkOperation.id)
+      expect(renderError).toHaveBeenCalledWith(
+        expect.objectContaining({
+          headline: expect.any(String),
+          customSections: expect.any(Array),
+        }),
+      )
+    },
+  )
 })
diff --git a/packages/app/src/cli/services/bulk-operations/execute-bulk-operation.ts b/packages/app/src/cli/services/bulk-operations/execute-bulk-operation.ts
@@ -1,7 +1,9 @@
 import {runBulkOperationQuery} from './run-query.js'
 import {runBulkOperationMutation} from './run-mutation.js'
+import {watchBulkOperation, type BulkOperation} from './watch-bulk-operation.js'
+import {formatBulkOperationStatus} from './format-bulk-operation-status.js'
 import {AppLinkedInterface} from '../../models/app/app.js'
-import {renderSuccess, renderInfo, renderWarning} from '@shopify/cli-kit/node/ui'
+import {renderSuccess, renderInfo, renderError, renderWarning} from '@shopify/cli-kit/node/ui'
 import {outputContent, outputToken} from '@shopify/cli-kit/node/output'
 import {ensureAuthenticatedAdmin} from '@shopify/cli-kit/node/session'
 import {AbortError} from '@shopify/cli-kit/node/error'
@@ -12,10 +14,11 @@ interface ExecuteBulkOperationInput {
   storeFqdn: string
   query: string
   variables?: string[]
+  watch?: boolean
 }
 
 export async function executeBulkOperation(input: ExecuteBulkOperationInput): Promise<void> {
-  const {app, storeFqdn, query, variables} = input
+  const {app, storeFqdn, query, variables, watch = false} = input
 
   renderInfo({
     headline: 'Starting bulk operation.',
@@ -49,31 +52,45 @@ export async function executeBulkOperation(input: ExecuteBulkOperationInput): Pr
     return
   }
 
-  const result = bulkOperationResponse?.bulkOperation
-  if (result) {
-    const infoSections = [
-      {
-        title: 'Bulk Operation Created',
-        body: [
-          {
-            list: {
-              items: [
-                outputContent`ID: ${outputToken.cyan(result.id)}`.value,
-                outputContent`Status: ${outputToken.yellow(result.status)}`.value,
-                outputContent`Created: ${outputToken.gray(String(result.createdAt))}`.value,
-              ],
-            },
-          },
-        ],
-      },
-    ]
+  const createdOperation = bulkOperationResponse?.bulkOperation
+  if (createdOperation) {
+    if (watch) {
+      const finishedOperation = await watchBulkOperation(adminSession, createdOperation.id)
+      renderBulkOperationResult(finishedOperation)
+    } else {
+      renderBulkOperationResult(createdOperation)
+    }
+  }
+}
 
-    renderInfo({customSections: infoSections})
+function renderBulkOperationResult(operation: BulkOperation): void {
+  const headline = formatBulkOperationStatus(operation).value
+  const items = [
+    outputContent`ID: ${outputToken.cyan(operation.id)}`.value,
+    outputContent`Status: ${outputToken.yellow(operation.status)}`.value,
+    outputContent`Created at: ${outputToken.gray(String(operation.createdAt))}`.value,
+    ...(operation.completedAt
+      ? [outputContent`Completed at: ${outputToken.gray(String(operation.completedAt))}`.value]
+      : []),
+  ]
 
-    renderSuccess({
-      headline: 'Bulk operation started successfully!',
-      body: 'Congrats!',
-    })
+  const customSections = [{body: [{list: {items}}]}]
+
+  switch (operation.status) {
+    case 'CREATED':
+      renderSuccess({headline: 'Bulk operation started.', customSections})
+      break
+    case 'COMPLETED':
+      if (operation.url) {
+        const downloadMessage = outputContent`Download results ${outputToken.link('here.', operation.url)}`.value
+        renderSuccess({headline, body: [downloadMessage], customSections})
+      } else {
+        renderSuccess({headline, customSections})
+      }
+      break
+    default:
+      renderError({headline, customSections})
+      break
   }
 }
 
diff --git a/packages/cli/oclif.manifest.json b/packages/cli/oclif.manifest.json
@@ -901,6 +901,13 @@
           "hidden": false,
           "name": "verbose",
           "type": "boolean"
+        },
+        "watch": {
+          "allowNo": false,
+          "description": "Wait for bulk operation results before exiting.",
+          "env": "SHOPIFY_FLAG_WATCH",
+          "name": "watch",
+          "type": "boolean"
         }
       },
       "hasDynamicHelp": false,
