From 7092cac4a4eaf96ce7ba139894c44b4cc7473309 Mon Sep 17 00:00:00 2001
From: Vaibhav <117663341+7ttp@users.noreply.github.com>
Date: Tue, 12 May 2026 01:23:56 +0530
Subject: [PATCH] e2e: fk save shortcut  (#45804)

adds coverage for:
- #45761 which solved
 #45759



<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->

## Summary by CodeRabbit

* **Tests**
* Added test coverage for keyboard shortcut save workflow in the column
editor with foreign-key relationships.

[![Review Change
Stack](https://storage.googleapis.com/coderabbit_public_assets/review-stack-in-coderabbit-ui.svg)](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/45804)

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
---
 e2e/studio/features/table-editor.spec.ts | 79 ++++++++++++++++++++++++
 1 file changed, 79 insertions(+)

diff --git a/e2e/studio/features/table-editor.spec.ts b/e2e/studio/features/table-editor.spec.ts
index 6e049ad08ec..47eb18424bb 100644
--- a/e2e/studio/features/table-editor.spec.ts
+++ b/e2e/studio/features/table-editor.spec.ts
@@ -1195,6 +1195,85 @@ testRunner('table editor', () => {
     await expect(page.getByTestId('table-editor-side-panel')).not.toBeVisible()
   })
 
+  test('shortcut saves fk before column update', async ({ page, ref }) => {
+    const runId = `${test.info().parallelIndex}_${test.info().repeatEachIndex}`
+    const sourceTableName = `pw_column_fk_shortcut_source_${runId}`
+    const targetTableName = `pw_column_fk_shortcut_target_${runId}`
+    const columnEditor = page.getByRole('dialog', {
+      name: `Update column ref_id from ${sourceTableName}`,
+      exact: true,
+    })
+    const foreignKeySchemaSelect = page.getByRole('combobox', { name: 'Select a schema' })
+    const foreignKeyLink = columnEditor.getByRole('link', {
+      name: `public.${targetTableName}`,
+      exact: true,
+    })
+    const openColumnEditor = async () => {
+      await page
+        .getByRole('columnheader', { name: 'ref_id' })
+        .getByRole('button', { name: 'Column ref_id actions' })
+        .click()
+      await page.getByRole('menuitem', { name: 'Edit column' }).click()
+      await expect(columnEditor).toBeVisible()
+    }
+
+    await using _ = await withSetupCleanup(
+      () =>
+        query(`
+          drop table if exists public.${sourceTableName} cascade;
+          drop table if exists public.${targetTableName} cascade;
+
+          create table public.${targetTableName} (
+            id text primary key
+          );
+
+          create table public.${sourceTableName} (
+            id bigint generated by default as identity primary key,
+            ref_id text
+          );
+        `),
+      async () => {
+        await dropTable(sourceTableName)
+        await dropTable(targetTableName)
+      }
+    )
+
+    await page.goto(toUrl(`/project/${ref}/editor?schema=public`))
+    await page.getByRole('button', { name: `View ${sourceTableName}`, exact: true }).click()
+    await page.waitForURL(/\/editor\/\d+\?schema=public$/)
+
+    await openColumnEditor()
+
+    await columnEditor.getByRole('button', { name: 'Add foreign key' }).click()
+    await expect(foreignKeySchemaSelect).toContainText('public')
+
+    const tableQueryPromise = waitForApiResponseWithTimeout(page, (response) =>
+      response.url().includes(`table-public-${targetTableName}`)
+    )
+
+    await page.getByRole('combobox', { name: 'Select a table to reference to' }).click()
+    await page.getByRole('option', { name: `public ${targetTableName}` }).click()
+    await tableQueryPromise
+
+    await page.getByRole('combobox', { name: `Column from public.${targetTableName}` }).click()
+    await page.getByRole('option', { name: 'id text' }).click()
+
+    await page.keyboard.press('ControlOrMeta+Enter')
+
+    await expect(foreignKeySchemaSelect).not.toBeVisible()
+    await expect(foreignKeyLink).toBeVisible()
+
+    const updateColumnPromise = waitForApiResponse(page, 'pg-meta', ref, 'query?key=column-update', {
+      method: 'POST',
+    })
+    await columnEditor.getByRole('button', { name: 'Save' }).click()
+    await updateColumnPromise
+    await expect(columnEditor).not.toBeVisible()
+
+    await openColumnEditor()
+    await expect(foreignKeyLink).toBeVisible()
+  })
+
   test('CSV drag and drop imports data on empty table', async ({ page, ref }) => {
     const tableName = 'pw_table_csv_drag_drop'