E2E: QA - app basic flow

[phyllis-sy-wu]

WHY are these changes introduced?

This implements the Apps section of the CLI pre-release QA checklist as an automated E2E test. The test exercises the full app lifecycle from scratch — no pre-provisioned apps, no fixed SHOPIFY_FLAG_CLIENT_ID.

WHAT is this pull request doing?

New test: app-basic-flow.spec.ts

A single end-to-end test covering the core QA flow in 9 steps:

Step	CLI Command	What it verifies
1	createApp (reactRouter, typescript)	App scaffolding works
2	app dev via PTY	Dev server starts, shows "Ready"
3	app execute --query	GraphQL query returns shop data
4	Press q	Dev server exits cleanly
5	app dev clean	Dev preview stopped
6	app deploy --version	Deployment succeeds
7	app versions list --json	Deployed version appears in list
8	Create secondary app + app config link	Config linking to a different app works
9	app deploy --config secondary	Deploy to the linked secondary app

Key characteristics:

• Creates 2 fresh apps from scratch using --organization-id
• Uses existing helpers from setup/app.ts: createApp, deployApp, versionsList, extractClientId, configLink, teardownApp
• Uses cli.spawn for interactive app dev and cli.exec for non-interactive commands
• Cleans up both apps in finally (with E2E_SKIP_CLEANUP support)
• 15 min timeout

QA checklist coverage:

QA Step	Status
Create a new dev platform app	✅ Step 1
Run shopify app dev	✅ Step 2
GraphiQL / app execute	✅ Step 3
Press q to stop dev	✅ Step 4
Run shopify app dev clean	✅ Step 5
Run shopify app deploy	✅ Step 6
Run shopify app versions list	✅ Step 7
Run shopify app config link (new app)	✅ Step 8
Deploy to the new app	✅ Step 9
Add extensions	Separate PR (app-extensions-flow)
Dev Console / theme app extension	Out of scope (requires store browser automation)
Function build / run	Separate PR (app-extensions-flow)

How to test your changes?

# Run the basic flow test
DEBUG=1 pnpm --filter e2e exec playwright test app-basic-flow

# With headed browser (to watch teardown)
E2E_HEADED=1 DEBUG=1 pnpm --filter e2e exec playwright test app-basic-flow

# Skip cleanup to inspect apps on dashboard
E2E_SKIP_CLEANUP=1 DEBUG=1 pnpm --filter e2e exec playwright test app-basic-flow

Measuring impact

• n/a - this doesn't need measurement, e.g. a linting rule or a bug-fix

Checklist

• I've considered possible cross-platform impacts (Mac, Linux, Windows)
• I've considered possible documentation changes

[phyllis-sy-wu]

Warning

This pull request is not mergeable via GitHub because a downstack PR is open. Once all requirements are satisfied, merge this PR as a stack on Graphite.
Learn more

• E2E: QA - app basic flow #7211 👈 (View in Graphite)
• E2E: cleanup utility #7171
• E2E: migrate tests to use new infra #7162
• E2E: infra refactor + app tests update #7147
• main

This stack of pull requests is managed by Graphite. Learn more about stacking.

[github-actions]

Differences in type declarations

We detected differences in the type declarations generated by Typescript for this branch compared to the baseline ('main' branch). Please, review them to ensure they are backward-compatible. Here are some important things to keep in mind:

• Some seemingly private modules might be re-exported through public modules.
• If the branch is behind main you might see odd diffs, rebase main into this branch.

New type declarations

We found no new type declarations in this PR

Existing type declarations

packages/cli-kit/dist/private/node/ui.d.ts

 import { Logger, LogLevel } from '../../public/node/output.js';
-import React from 'react';
 import { Key, RenderOptions } from 'ink';
 import { EventEmitter } from 'events';
-/**
- * Signal that the current Ink tree is done. Must be called within an
- * InkLifecycleRoot — throws if the provider is missing so lifecycle
- * bugs surface immediately instead of silently hanging.
- */
-export declare function useComplete(): (error?: Error) => void;
-/**
- * Root wrapper for Ink trees. Owns the single `exit()` call site — children
- * signal completion via `useComplete()`, which sets state here. The `useEffect`
- * fires post-render, guaranteeing all batched state updates have been flushed
- * before the tree is torn down.
- */
-export declare function InkLifecycleRoot({ children }: {
-    children: React.ReactNode;
-}): React.JSX.Element;
 interface RenderOnceOptions {
     logLevel?: LogLevel;
     logger?: Logger;
     renderOptions?: RenderOptions;
 }
 export declare function renderOnce(element: JSX.Element, { logLevel, renderOptions }: RenderOnceOptions): string | undefined;
-export declare function render(element: JSX.Element, options?: RenderOptions): Promise<void>;
+export declare function render(element: JSX.Element, options?: RenderOptions): Promise<unknown>;
 export declare class Stdout extends EventEmitter {
     columns: number;
     rows: number;
     readonly frames: string[];
     private _lastFrame?;
     constructor(options: {
         columns?: number;
         rows?: number;
     });
     write: (frame: string) => void;
     lastFrame: () => string | undefined;
 }
 export declare function handleCtrlC(input: string, key: Key, exit?: () => void): void;
 export {};

packages/cli-kit/dist/public/node/ui.d.ts

@@ -34,7 +34,7 @@ export interface RenderConcurrentOptions extends PartialBy<ConcurrentOutputProps
  * 00:00:00 │ frontend │ third frontend message
  *
  */
-export declare function renderConcurrent({ renderOptions, ...props }: RenderConcurrentOptions): Promise<void>;
+export declare function renderConcurrent({ renderOptions, ...props }: RenderConcurrentOptions): Promise<unknown>;
 export type AlertCustomSection = CustomSection;
 export type RenderAlertOptions = Omit<AlertOptions, 'type'>;
 /**