@camunda/e2e-test-suite 0.0.1009 → 0.0.1011

package/dist/pages/8.10/ProcessApplicationPage.js

@@ -0,0 +1,237 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ProcessApplicationPage = void 0;
+const test_1 = require("@playwright/test");
+const submitModalWithRetry_1 = require("../../utils/assertionHelpers/submitModalWithRetry");
+// Which process application holds the current test's resources, and which
+// cluster its development stage currently points at. Keyed by the Playwright
+// Page because the object that creates the container (ModelerHomePage) and the
+// objects that later need a specific cluster inside it (ModelerCreatePage,
+// FormJsPage) hold separate ProcessApplicationPage instances but share one page.
+const resourceContainers = new WeakMap();
+// Since camunda/camunda-hub#25831 a process application is a first-class
+// container rather than a folder, and a workspace root ("project" in today's
+// UI) holds nothing but process applications and IDP applications. Every file
+// and folder this suite creates therefore has to live inside a process
+// application. This page object owns that container's surface only; entering
+// and leaving it is driven from ModelerHomePage so the ~150 existing spec call
+// sites keep working unchanged.
+class ProcessApplicationPage {
+    page;
+    // Empty workspace root: a plain primary button rendered next to the "Create
+    // new" menu (hub's EmptyStateActionButtons).
+    createProcessApplicationButton;
+    // Non-empty root: the item inside the "Create new" menu. Hub passes
+    // hideProcessApplication at workspace level, so this is the fallback rather
+    // than the primary path -- its own unit test asserts the item is absent
+    // there. Kept because the Hub PR is still moving this surface.
+    createProcessApplicationOption;
+    creationDialog;
+    nameInput;
+    submitButton;
+    cancelButton;
+    breadcrumb;
+    folderExplorer;
+    createNewDropdown;
+    inlineNameInput;
+    // "Define stages" dialog, reached from the process application's "Connected
+    // clusters" card (or its /connected-clusters deep link). Assigning a cluster
+    // to a stage here is what makes it deployable: DeployModal renders
+    // ProcessAppClusterSelection for a process application, and that filters the
+    // cluster list through getProcessAppClustersByStage -- so a process
+    // application with no stage assigned offers no cluster at all.
+    defineStagesDialog;
+    developmentClusterSelect;
+    defineStagesSaveButton;
+    constructor(page) {
+        this.page = page;
+        // .first() defensively only: hub renders exactly one of these today, in the
+        // workspace-root empty state. A future second placement should not turn
+        // every PA-creating test into a strict-mode violation.
+        this.createProcessApplicationButton = page
+            .getByRole('button', { name: 'Create process application' })
+            .first();
+        this.createProcessApplicationOption = page.locator('[data-test="create-process-application"]');
+        this.creationDialog = page.getByRole('dialog', {
+            name: 'Create a process application',
+        });
+        // Deliberately scoped to the dialog: ModelerCreatePage owns an unscoped
+        // getByLabel('Name', {exact: true}) for the properties panel, which would
+        // resolve to two elements while the creation modal is open.
+        this.nameInput = this.creationDialog.getByLabel('Name', { exact: true });
+        this.submitButton = this.creationDialog.getByRole('button', {
+            name: 'Create',
+            exact: true,
+        });
+        this.cancelButton = this.creationDialog.getByRole('button', {
+            name: 'Cancel',
+            exact: true,
+        });
+        this.breadcrumb = page.locator('[data-test="breadcrumb-process-application-menu"]');
+        this.folderExplorer = page.getByRole('region', { name: 'Folder explorer' });
+        // The process application page renders more than one diagram-dropdown
+        // (hub's own unit tests reach for it with getAllByTestId), so the dropdown
+        // has to be resolved inside the folder explorer rather than page-wide.
+        this.createNewDropdown = this.folderExplorer
+            .locator('[data-test="diagram-dropdown"]')
+            .first();
+        this.inlineNameInput = page.locator('[data-test="editable-input"]');
+        this.defineStagesDialog = page
+            .getByRole('dialog')
+            .filter({ hasText: 'Define stages' });
+        // Carbon Dropdown / design-system Select both keep this id.
+        this.developmentClusterSelect = this.defineStagesDialog.locator('#dropdown-development-cluster');
+        this.defineStagesSaveButton = this.defineStagesDialog.getByRole('button', {
+            name: 'Save',
+            exact: true,
+        });
+    }
+    // Either the folder explorer or the breadcrumb proves we are on the process
+    // application page; .first() because both are present once it has rendered.
+    pageReady() {
+        return this.folderExplorer.or(this.breadcrumb).first();
+    }
+    async waitForProcessApplication(timeout = 90000) {
+        await (0, test_1.expect)(this.pageReady()).toBeVisible({ timeout });
+    }
+    async clickCreateProcessApplicationButton() {
+        await (0, test_1.expect)(this.createProcessApplicationButton).toBeVisible({
+            timeout: 60000,
+        });
+        await this.createProcessApplicationButton.click({ timeout: 60000 });
+    }
+    async clickCreateProcessApplicationOption() {
+        await (0, test_1.expect)(this.createProcessApplicationOption).toBeVisible({
+            timeout: 60000,
+        });
+        await this.createProcessApplicationOption.click({ timeout: 60000 });
+    }
+    // Hub creates a process application through a modal today. It used an inline
+    // editable title before, and #27593 is still moving this surface, so the
+    // inline path is kept as a fallback — this is the one method that has to
+    // change if naming moves back inline.
+    async nameNewProcessApplication(name) {
+        const isModal = await this.creationDialog
+            .waitFor({ state: 'visible', timeout: 15000 })
+            .then(() => true)
+            .catch(() => false);
+        if (isModal) {
+            await this.nameInput.click({ timeout: 30000 });
+            await this.nameInput.fill(name);
+            await (0, test_1.expect)(this.nameInput).toHaveValue(name, { timeout: 10000 });
+            await (0, submitModalWithRetry_1.submitModalWithRetry)(this.submitButton, this.creationDialog);
+            await this.waitForProcessApplication();
+            return;
+        }
+        await (0, test_1.expect)(this.inlineNameInput).toBeVisible({ timeout: 30000 });
+        await this.inlineNameInput.click({ timeout: 60000 });
+        await this.inlineNameInput.fill(name);
+        await this.inlineNameInput.press('Enter');
+        await this.waitForProcessApplication();
+    }
+    // Assigns a cluster to this process application's development stage.
+    //
+    // Deploying from inside a process application goes through
+    // ProcessAppClusterSelection, which only lists clusters the application has
+    // assigned to a stage, and does not auto-select anything when that list is
+    // empty. A freshly created process application has no stages, so the deploy
+    // dialog shows "Clusters not configured for stages" and offers nothing to
+    // pick -- which is why the old per-deploy cluster toggle was nowhere to be
+    // found. Assign the stage once, at creation, and the deploy dialog then
+    // auto-selects it.
+    //
+    // clusterName is matched as a prefix because the dropdown renders each
+    // cluster as "<name> <generation>". Without it, the first real cluster is
+    // taken -- callers that care assert the name in the deploy dialog anyway.
+    async defineDevelopmentStage(clusterName) {
+        await (0, test_1.expect)(this.defineStagesDialog).toBeVisible({ timeout: 60000 });
+        await this.developmentClusterSelect.click({ timeout: 30000 });
+        // Escape before interpolating: a cluster name can carry regex
+        // metacharacters -- "Test Cluster (v2)" is the common case -- which would
+        // otherwise mis-match or throw. Same treatment as
+        // utils/modelerCluster.selectModelerCluster.
+        const escapedClusterName = clusterName?.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
+        const option = clusterName
+            ? this.defineStagesDialog
+                .getByRole('option', { name: new RegExp(`^${escapedClusterName}`) })
+                .first()
+            : this.defineStagesDialog
+                .getByRole('option')
+                .filter({ hasNotText: 'Select a development cluster' })
+                .first();
+        await option.click({ timeout: 30000 });
+        await this.defineStagesSaveButton.click({ timeout: 30000 });
+        await (0, test_1.expect)(this.defineStagesDialog).toBeHidden({ timeout: 60000 });
+    }
+    rememberResourceContainer(url) {
+        resourceContainers.set(this.page, { url });
+    }
+    // A process application deploys to the clusters bound to its stages, and
+    // nothing else: inside a container DeployModal renders
+    // ProcessAppClusterSelection, which lists only those and auto-selects the
+    // first. Which cluster a test wants is known only once a deploy flow names
+    // it, so the binding happens here, on demand -- leave the diagram, bind the
+    // cluster to the development stage, come back. Repeat calls for the same
+    // cluster cost nothing, and a test deploying to a second cluster rebinds.
+    // Returns whether it navigated: the caller may have been on a view that a
+    // reload does not restore -- Play is a tab click, not a URL -- and has to
+    // re-enter it.
+    async ensureStageCluster(clusterName) {
+        const container = resourceContainers.get(this.page);
+        if (!container || container.developmentCluster === clusterName) {
+            return false;
+        }
+        const returnTo = this.page.url();
+        const paUrl = container.url.replace(/[?#].*$/, '').replace(/\/$/, '');
+        await this.page.goto(`${paUrl}/connected-clusters`, {
+            waitUntil: 'domcontentloaded',
+        });
+        await this.openStageDefinition();
+        await this.defineDevelopmentStage(clusterName);
+        container.developmentCluster = clusterName;
+        await this.page.goto(returnTo, { waitUntil: 'domcontentloaded' });
+        return true;
+    }
+    // The /connected-clusters deep link opens the Define stages dialog by itself
+    // while the application has no stage bound. Once one is bound -- a test that
+    // deploys to a second cluster -- it has to be reopened from the page, so try
+    // the affordances hub offers before failing with exactly what was looked for.
+    // Worth the noise: an unbound cluster otherwise surfaces as a deploy dialog
+    // that silently offers nothing, which says nothing about its own cause.
+    async openStageDefinition() {
+        const opened = await this.defineStagesDialog
+            .waitFor({ state: 'visible', timeout: 15000 })
+            .then(() => true)
+            .catch(() => false);
+        if (opened) {
+            return;
+        }
+        // Page-scoped .first(): hub renders one such control on this page, and a
+        // second placement must not turn every rebinding test into a strict-mode
+        // violation.
+        const reopen = this.page
+            .getByRole('button', { name: /define stages|edit stages|configure/i })
+            .first();
+        const canReopen = await reopen
+            .waitFor({ state: 'visible', timeout: 10000 })
+            .then(() => true)
+            .catch(() => false);
+        if (!canReopen) {
+            throw new Error('Could not open the "Define stages" dialog on /connected-clusters: it ' +
+                'did not open by itself and no "Define stages" / "Edit stages" / ' +
+                '"Configure" control was found.');
+        }
+        await reopen.click({ timeout: 30000 });
+    }
+    async openByName(name) {
+        const processApplication = this.page
+            .getByRole('row')
+            .filter({ hasText: name })
+            .getByTitle(name)
+            .first();
+        await (0, test_1.expect)(processApplication).toBeVisible({ timeout: 90000 });
+        await processApplication.click({ timeout: 60000 });
+        await this.waitForProcessApplication();
+    }
+}
+exports.ProcessApplicationPage = ProcessApplicationPage;

package/dist/pages/8.10/UtilitiesPage.js

@@ -653,6 +653,14 @@ async function modelAndRunConnectorsTimerEventDiagram(modelerCreatePage, modeler
         timeout: 60000,
     });
     await connectorMarketplacePage.downloadConnectorToProject();
+    // Both lookups are container-relative: clickProjectBreadcrumb() returns to
+    // this test's process application, which is where the uploaded diagram
+    // lives. The downloaded element template is the open question -- hub
+    // publishes element templates to the workspace, but the marketplace download
+    // is initiated from inside the container, so it should land there. If a
+    // trace shows the template at workspace root instead, the first of these two
+    // calls becomes clickWorkspaceBreadcrumb() followed by
+    // returnToResourceContainer() before the diagram is reopened.
     await modelerHomePage.clickProjectBreadcrumb();
     await modelerHomePage.clickProcessDiagram('REST Outbound Connector');
     await connectorTemplatePage.publishConnector();

package/dist/pages/SM-8.10/FormJsPage.d.ts

@@ -27,6 +27,7 @@ declare class FormJsPage {
     filldocumentReferenceInput(key: string): Promise<void>;
     clickDeployFormButton(): Promise<void>;
     clickDeployModalSubmitButton(): Promise<void>;
+    selectOnlyThisResource(): Promise<void>;
     deployForm(): Promise<void>;
 }
 export { FormJsPage };

package/dist/pages/SM-8.10/FormJsPage.js

@@ -85,10 +85,41 @@ class FormJsPage {
     async clickDeployModalSubmitButton() {
         await this.deployModalSubmitButton.click({ timeout: 60000 });
     }
+    // Since camunda/camunda-hub#25831 a form lives inside a process application,
+    // and Hub then scopes Deploy to the WHOLE application by default -- it calls
+    // deployProcessApplication, not deployFile, so the "Form deployed!" toast
+    // never fires (hub's own form-deploy-action.spec.sm.tsx asserts exactly that
+    // default). Narrowing the scope keeps this a form-deploy test instead of
+    // silently turning it into a process-application deploy. The combobox only
+    // exists inside a container, hence the boolean probe.
+    async selectOnlyThisResource() {
+        const scopeSelect = this.deployDialog.getByRole('combobox', {
+            name: 'Resources to deploy',
+        });
+        const hasScopeSelect = await scopeSelect
+            .waitFor({ state: 'visible', timeout: 10000 })
+            .then(() => true)
+            .catch(() => false);
+        if (!hasScopeSelect) {
+            return;
+        }
+        await scopeSelect.click();
+        // The scope select is a Radix UI Select: its listbox is portalled to
+        // document.body, OUTSIDE the dialog element, so a dialog-scoped option
+        // query never resolves even while the option is visible on screen. Query
+        // the portalled option at page scope instead; the trigger above stays
+        // dialog-scoped because it renders inside the dialog.
+        await this.page
+            .getByRole('option', { name: 'Only this resource' })
+            .or(this.page.getByText('Only this resource', { exact: true }))
+            .first()
+            .click({ timeout: 30000 });
+    }
     async deployForm() {
         await this.clickDeployFormButton();
         await (0, test_1.expect)(this.deployDialog).toBeVisible({ timeout: 30000 });
         await (0, modelerCluster_1.selectModelerCluster)(this.deployDialog);
+        await this.selectOnlyThisResource();
         await this.clickDeployModalSubmitButton();
         await (0, test_1.expect)(this.deploySuccessNotification).toBeVisible({ timeout: 30000 });
     }

package/dist/pages/SM-8.10/ModelerCreatePage.js

@@ -1020,19 +1020,37 @@ class ModelerCreatePage {
             name: /^Configure (test case|scenario)$/,
         }))
             .first();
-        // Wait up to 15s for EITHER the new-flow setup panel OR the legacy Continue
-        // button to appear. Using .or() avoids separate sequential timeouts that would
-        // both expire before the page finishes loading on a slow cluster.
-        const setupOrContinue = setupDeployButton.or(this.continueToPlayButton);
-        const panelAppeared = await setupOrContinue
-            .first()
-            .isVisible({ timeout: 15000 })
-            .catch(() => false);
-        if (!panelAppeared) {
-            // Neither appeared — Play is already configured and ready.
+        // Play settles into exactly ONE of three states, and which one is not
+        // knowable up front, so race them instead of timing out on each in turn:
+        // the setup overlay, the legacy Continue button, or the configure-test
+        // panel (meaning setup is already done for this diagram).
+        //
+        // Waiting only for the first two and reading "neither" as "already ready"
+        // was wrong once the diagram moved inside a process application.
+        // ConfigurationOverlay renders null until isDeploymentStateValidated, and
+        // it sets that flag synchronously ONLY when processApplicationId is
+        // undefined -- exactly what a project-root diagram used to give it. With
+        // the diagram in a process application the id is defined, so the overlay
+        // must first await checkExistingDeployment(). The old 15s probe raced that
+        // async call, concluded "already ready" and returned while the overlay was
+        // still about to appear. ConfigureTestPanel returns null for as long as the
+        // overlay is up, so the Start button never existed and
+        // clickStartInstanceButton burned its entire retry budget looking for it.
+        const configurationOverlay = this.page.locator('[data-test="play-configuration-overlay"]');
+        const configureTestPanel = this.page.getByTestId('configure-test-panel');
+        await (0, test_1.expect)(configurationOverlay
+            .or(this.continueToPlayButton)
+            .or(configureTestPanel)
+            .first()).toBeVisible({ timeout: 90000 });
+        if (await configureTestPanel.isVisible()) {
+            // Already past setup for this diagram -- nothing to drive.
             return;
         }
-        const isNewFlow = await setupDeployButton.isVisible().catch(() => false);
+        // Keyed on the overlay itself, not on its Deploy button: when
+        // checkExistingDeployment finds a deployment the overlay opens with the
+        // deploy step already complete, so there is no Deploy button to see and
+        // keying on it would fall through to the legacy Continue flow.
+        const isNewFlow = await configurationOverlay.isVisible();
         if (isNewFlow) {
             // Step 1: connect cluster if not yet connected (modal with cluster dropdown)
             const connectClusterButton = this.page.getByRole('button', {
@@ -1052,11 +1070,31 @@ class ModelerCreatePage {
                     .getByRole('button', { name: 'Save' })
                     .click({ timeout });
             }
-            // Step 2: deploy
-            await setupDeployButton.click({ timeout });
-            await (0, test_1.expect)(this.page.getByText('Process has been successfully deployed')).toBeVisible({ timeout: 90000 });
-            // Step 3: configure scenario
-            await configureScenarioButton.click({ timeout });
+            // Step 2: deploy, unless the overlay already opened with the
+            // deploy step complete. checkExistingDeployment only runs when
+            // processApplicationId is defined, which it now is, so re-entering
+            // Play on an already-deployed process application legitimately
+            // has nothing to deploy and renders no Deploy button at all.
+            const alreadyDeployed = await configureScenarioButton
+                .isVisible({ timeout: 3000 })
+                .catch(() => false);
+            if (!alreadyDeployed) {
+                // Step 2: deploy
+                await setupDeployButton.click({ timeout });
+                await (0, test_1.expect)(this.page.getByText('Process has been successfully deployed')).toBeVisible({ timeout: 90000 });
+            }
+            // Step 3: leave the overlay, and confirm we actually left it. The
+            // button only calls hideConfigurationOverlay(); the overlay's own
+            // cluster-change effect can then fire resetDeployment and bring it
+            // straight back, and ConfigureTestPanel stays null while it is up.
+            // Assert the panel really rendered, and re-drive the click if the
+            // overlay returned.
+            await (0, test_1.expect)(async () => {
+                if (await configurationOverlay.isVisible()) {
+                    await configureScenarioButton.click({ timeout });
+                }
+                await (0, test_1.expect)(configureTestPanel).toBeVisible({ timeout: 15000 });
+            }).toPass({ timeout: 90000 });
             return;
         }
         // Legacy flow: "Continue" button → "Play environment is ready" confirmation.

package/dist/pages/SM-8.10/ModelerHomePage.d.ts

@@ -2,6 +2,9 @@ import { Page, Locator } from '@playwright/test';
 declare class ModelerHomePage {
     private page;
     private defaultFolderName;
+    private processApplicationPage;
+    private processApplicationUrl?;
+    private processApplicationName?;
     readonly modelerPageBanner: Locator;
     readonly createNewProjectButton: Locator;
     readonly projectNameInput: Locator;
@@ -14,6 +17,7 @@ declare class ModelerHomePage {
     readonly bpmnTemplateOption: Locator;
     readonly formTemplateOption: Locator;
     readonly projectBreadcrumb: Locator;
+    readonly workspaceBreadcrumb: Locator;
     readonly openOrganizationsButton: Locator;
     readonly manageButton: Locator;
     readonly crossComponentProjectFolder: Locator;
@@ -43,10 +47,17 @@ declare class ModelerHomePage {
     enterFormName(name: string): Promise<void>;
     private renameViaMoreActions;
     clickProjectBreadcrumb(): Promise<void>;
+    clickWorkspaceBreadcrumb(): Promise<void>;
+    enterResourceContainer(name?: string): Promise<void>;
+    private clickCreateProcessApplication;
+    private ensureInResourceContainer;
+    returnToResourceContainer(): Promise<void>;
+    startBlankBpmnDiagram(): Promise<void>;
     clickOpenOrganizationsButton(): Promise<void>;
     clickManageButton(): Promise<void>;
     clickUploadFilesButton(): Promise<void>;
     clickMessageBanner(): Promise<void>;
+    private becameVisible;
     private overlayBecameVisible;
 }
 export { ModelerHomePage };

package/dist/pages/SM-8.10/ModelerHomePage.js

@@ -3,10 +3,24 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.ModelerHomePage = void 0;
 const test_1 = require("@playwright/test");
 const expectLocatorWithRetry_1 = require("../../utils/assertionHelpers/expectLocatorWithRetry");
+const randomName_1 = require("../../utils/randomName");
 const NavigationPage_1 = require("./NavigationPage");
+const ProcessApplicationPage_1 = require("./ProcessApplicationPage");
 class ModelerHomePage {
     page;
     defaultFolderName = 'Cross Component Test Project';
+    // Since camunda/camunda-hub#25831 files and folders cannot sit at a
+    // workspace ("project" in today's UI) root -- only process applications and
+    // IDP applications can. The container is therefore entered lazily, at the
+    // point a resource is created, and remembered for the lifetime of this page
+    // object (one instance per test, see fixtures/SM-8.10.ts). Specs that only
+    // need the workspace itself never trigger the hop.
+    processApplicationPage;
+    // Load-bearing: hub renders no process-application breadcrumb on a diagram
+    // page at container root, so the remembered URL -- not a breadcrumb click --
+    // is how we get back. Hub's own Playwright suite does the same.
+    processApplicationUrl;
+    processApplicationName;
     modelerPageBanner;
     createNewProjectButton;
     projectNameInput;
@@ -19,6 +33,7 @@ class ModelerHomePage {
     bpmnTemplateOption;
     formTemplateOption;
     projectBreadcrumb;
+    workspaceBreadcrumb;
     openOrganizationsButton;
     manageButton;
     crossComponentProjectFolder;
@@ -35,6 +50,7 @@ class ModelerHomePage {
     modalCloseButton;
     constructor(page) {
         this.page = page;
+        this.processApplicationPage = new ProcessApplicationPage_1.ProcessApplicationPage(page);
         // Matches both Modeler shells -- see NavigationPage.modelerPageBanner for
         // why the Design System branch excludes the /login href.
         this.modelerPageBanner = page
@@ -58,12 +74,11 @@ class ModelerHomePage {
             name: 'Choose BPMN template',
         });
         this.diagramTypeDropdown = page.locator('[data-test="diagram-dropdown"]');
-        this.bpmnTemplateOption = page
-            .locator('[data-test="create-bpmn-diagram"]')
-            .getByText('BPMN Diagram');
-        this.formTemplateOption = page
-            .locator('[data-test="create-form"]')
-            .getByText('Form');
+        // Matched on the test id alone: hub's design-system variant of the create
+        // menu renders "BPMN diagram" (lowercase d), so a text filter breaks the
+        // day that variant ships.
+        this.bpmnTemplateOption = page.locator('[data-test="create-bpmn-diagram"]');
+        this.formTemplateOption = page.locator('[data-test="create-form"]');
         // The Design System shell drops the breadcrumb-project hook. Its context
         // breadcrumb is org / project / entity, so the project crumb is the second
         // item -- scoped to the breadcrumb nav, never a bare nth() on the page.
@@ -75,6 +90,21 @@ class ModelerHomePage {
             .getByRole('button')
             .first())
             .first();
+        // Kept separate from projectBreadcrumb, which now means "the container my
+        // resources live in". When hub's workspaces terminology flag flips,
+        // breadcrumb-project comes to denote the process application, so the
+        // workspace level needs its own name from the start. Carries the same
+        // Design System fallback as projectBreadcrumb: under that shell neither
+        // test-id hook exists, and the workspace level is the project crumb.
+        this.workspaceBreadcrumb = page
+            .locator('[data-test="breadcrumb-project"]')
+            .or(page.locator('[data-test="breadcrumb-workspace"]'))
+            .or(page
+            .locator('nav[aria-label="Context navigation"] [data-slot="nav-breadcrumb-item"]')
+            .nth(1)
+            .getByRole('button')
+            .first())
+            .first();
         this.openOrganizationsButton = page.getByLabel('Open Organizations');
         this.manageButton = page.getByRole('button', { name: 'Manage' });
         this.crossComponentProjectFolder = page
@@ -248,7 +278,12 @@ class ModelerHomePage {
             }
         }
     }
+    // Opens a resource where this test put it. Several specs leave Modeler
+    // entirely (to Optimize, to Operate) and come back via
+    // clickCrossComponentProjectFolder(), which lands at workspace root -- the
+    // resource is one level down, so re-enter the container first.
     async clickProcessDiagram(name) {
+        await this.ensureInResourceContainer();
         const process = this.rows.filter({ hasText: name }).getByTitle(name).first();
         await (0, test_1.expect)(process).toBeVisible({ timeout: 90000 });
         await process.click();
@@ -267,13 +302,19 @@ class ModelerHomePage {
     async clickChooseBpmnTemplateButton() {
         await this.chooseBpmnTemplateButton.click();
     }
+    // Opens the create menu inside this test's process application. The menu at
+    // workspace root no longer offers BPMN, Form or Upload -- those resources
+    // cannot live there -- so the container is entered first. Callers are
+    // unchanged, which is why the ~150 existing spec call sites need no edit.
     async clickDiagramTypeDropdown() {
-        await (0, expectLocatorWithRetry_1.expectLocatorWithRetry)(this.page, this.diagramTypeDropdown, {
+        await this.enterResourceContainer();
+        const dropdown = this.processApplicationPage.createNewDropdown;
+        await (0, expectLocatorWithRetry_1.expectLocatorWithRetry)(this.page, dropdown, {
             postAction: async () => {
                 await this.page.reload();
             },
         });
-        await this.diagramTypeDropdown.click();
+        await dropdown.click();
     }
     async clickBpmnTemplateOption() {
         await (0, test_1.expect)(this.bpmnTemplateOption).toBeVisible({ timeout: 60000 });
@@ -316,8 +357,97 @@ class ModelerHomePage {
         await this.renameSubmitButton.click();
         await (0, test_1.expect)(this.renameInput).toBeHidden({ timeout: 10000 });
     }
+    // Kept under its original name because it is what ~10 call sites already
+    // mean: "go back to where my resources live". That is now the process
+    // application, not the workspace root.
     async clickProjectBreadcrumb() {
-        await this.projectBreadcrumb.click({ timeout: 60000 });
+        await this.returnToResourceContainer();
+    }
+    // The workspace ("project") level itself, for the surfaces that genuinely
+    // live there -- collaborators, IDP applications, published element
+    // templates.
+    async clickWorkspaceBreadcrumb() {
+        await this.workspaceBreadcrumb.click({ timeout: 60000 });
+    }
+    // Creates, once per test, the process application that holds this test's
+    // resources, and leaves the browser inside it. Idempotent: called again while
+    // already in the container it is a no-op, so a spec that creates several
+    // resources in a row pays for the container once.
+    //
+    // One container per test rather than one shared with the seeded workspace:
+    // deploying is process-application-wide, so a shared container would let one
+    // spec's deploy pick up every other spec's half-modelled diagram.
+    async enterResourceContainer(name) {
+        if (this.processApplicationUrl) {
+            const stillInside = await this.becameVisible(this.processApplicationPage.breadcrumb, 5000);
+            if (!stillInside) {
+                await this.returnToResourceContainer();
+            }
+            return;
+        }
+        this.processApplicationName =
+            name ??
+                (await (0, randomName_1.randomNameAgregator)('Cross Component Process Application'));
+        console.log(`Creating process application ${this.processApplicationName} inside ${this.defaultFolderName}`);
+        await this.clickCreateProcessApplication();
+        await this.processApplicationPage.nameNewProcessApplication(this.processApplicationName);
+        this.processApplicationUrl = this.page.url();
+    }
+    // Which control creates a process application depends on the hub version
+    // under test. Since camunda/camunda-hub#25831 it is a plain primary button on
+    // the workspace root, and the "Create new" menu explicitly hides the item
+    // (hideProcessApplication) because a process application is no longer just
+    // another resource. Before that change the menu item was the only way in.
+    // Race both entry points so neither version pays a full timeout, then use
+    // whichever one rendered.
+    async clickCreateProcessApplication() {
+        const button = this.processApplicationPage.createProcessApplicationButton;
+        const rootLoaded = await this.becameVisible(button.or(this.diagramTypeDropdown).first(), 60000);
+        if (!rootLoaded) {
+            await this.page.reload();
+        }
+        // Short: the joint probe above already settled which branch rendered, and
+        // hub renders exactly one of them (EntityTable renders the toolbar's create
+        // menu OR the empty state, never both), so this only confirms which.
+        if (await this.becameVisible(button, 5000)) {
+            await this.processApplicationPage.clickCreateProcessApplicationButton();
+            return;
+        }
+        await this.diagramTypeDropdown.click({ timeout: 60000 });
+        await this.processApplicationPage.clickCreateProcessApplicationOption();
+    }
+    // Re-enters this test's container if it already has one, without creating
+    // one: opening an existing resource must not have the side effect of
+    // creating a container for a spec that never asked for it.
+    async ensureInResourceContainer() {
+        if (!this.processApplicationUrl) {
+            return;
+        }
+        await this.enterResourceContainer();
+    }
+    // Navigates back to this test's process application by the remembered URL
+    // rather than by a breadcrumb click: hub renders no process-application
+    // breadcrumb on a diagram page at container root, and the breadcrumb that
+    // does exist on the container page doubles as its rename control. Hub's own
+    // Playwright suite navigates back the same way.
+    async returnToResourceContainer() {
+        if (!this.processApplicationUrl) {
+            await this.clickWorkspaceBreadcrumb();
+            return;
+        }
+        await this.page.goto(this.processApplicationUrl, {
+            waitUntil: 'domcontentloaded',
+        });
+        await this.processApplicationPage.waitForProcessApplication();
+        await this.clickMessageBanner();
+    }
+    // Single seam for "give me an empty BPMN diagram in this test's container".
+    // A process application always ships an auto-created main process; this adds
+    // a new diagram rather than adopting that one, so every existing modelling
+    // assertion keeps its current subject.
+    async startBlankBpmnDiagram() {
+        await this.clickDiagramTypeDropdown();
+        await this.clickBpmnTemplateOption();
     }
     async clickOpenOrganizationsButton() {
         await this.openOrganizationsButton.click({ timeout: 30000 });
@@ -351,6 +481,14 @@ class ModelerHomePage {
             }
         }
     }
+    // Boolean visibility probe. waitFor rather than isVisible, which resolves
+    // immediately and would report a false negative on a still-rendering page.
+    async becameVisible(locator, timeout) {
+        return locator
+            .waitFor({ state: 'visible', timeout })
+            .then(() => true)
+            .catch(() => false);
+    }
     // Probe with waitFor, not isVisible: the "New features" modal renders lazily
     // after page load, and isVisible resolves immediately — Playwright ignores
     // its timeout option — so it misses an overlay that has yet to paint.