diff --git a/src/Explorer/Panes/AddDatabasePanel/AddDatabasePanel.test.tsx b/src/Explorer/Panes/AddDatabasePanel/AddDatabasePanel.test.tsx
index 4206eb723..658b32de9 100644
--- a/src/Explorer/Panes/AddDatabasePanel/AddDatabasePanel.test.tsx
+++ b/src/Explorer/Panes/AddDatabasePanel/AddDatabasePanel.test.tsx
@@ -1,17 +1,34 @@
-import { shallow } from "enzyme";
+jest.mock("../../../Common/dataAccess/createDatabase");
+jest.mock("../../../Shared/Telemetry/TelemetryProcessor");
+import "@testing-library/jest-dom";
+import { render, screen } from "@testing-library/react";
 import React from "react";
+import { updateUserContext } from "../../../UserContext";
 import Explorer from "../../Explorer";
 import { AddDatabasePanel } from "./AddDatabasePanel";
 
-const props = {
-  explorer: new Explorer(),
-  closePanel: (): void => undefined,
-  openNotificationConsole: (): void => undefined,
-};
+describe("AddDatabasePanel", () => {
+  const props = {
+    explorer: new Explorer(),
+  };
 
-describe("AddDatabasePane Pane", () => {
-  it("should render Default properly", () => {
-    const wrapper = shallow(<AddDatabasePanel {...props} />);
-    expect(wrapper).toMatchSnapshot();
+  afterEach(() => {
+    updateUserContext({ apiType: "SQL" });
+  });
+
+  it("programmatically associates the visible 'Database id' label with the input", () => {
+    updateUserContext({ apiType: "SQL" });
+    render(<AddDatabasePanel {...props} />);
+
+    // getByRole resolves the accessible name via aria-labelledby, which must
+    // point at the visible "Database id" label (regression guard for bug 4768133).
+    expect(screen.getByRole("textbox", { name: "Database id" })).toBeInTheDocument();
+  });
+
+  it("uses 'Keyspace id' as the accessible name for Cassandra accounts", () => {
+    updateUserContext({ apiType: "Cassandra" });
+    render(<AddDatabasePanel {...props} />);
+
+    expect(screen.getByRole("textbox", { name: "Keyspace id" })).toBeInTheDocument();
   });
 });
diff --git a/src/Explorer/Panes/AddDatabasePanel/AddDatabasePanel.tsx b/src/Explorer/Panes/AddDatabasePanel/AddDatabasePanel.tsx
index d2ba746dc..f4e0a16e2 100644
--- a/src/Explorer/Panes/AddDatabasePanel/AddDatabasePanel.tsx
+++ b/src/Explorer/Panes/AddDatabasePanel/AddDatabasePanel.tsx
@@ -148,7 +148,7 @@ export const AddDatabasePanel: FunctionComponent<AddDatabasePaneProps> = ({
         <Stack>
           <Stack horizontal>
             <span className="mandatoryStar">*&nbsp;</span>
-            <Text className="panelTextBold" variant="small">
+            <Text id="database-id-label" className="panelTextBold" variant="small">
               {databaseIdLabel}
             </Text>
             <InfoTooltip>{databaseIdTooltipText}</InfoTooltip>
@@ -162,7 +162,7 @@ export const AddDatabasePanel: FunctionComponent<AddDatabasePaneProps> = ({
             pattern={ValidCosmosDbIdInputPattern.source}
             title={ValidCosmosDbIdDescription}
             size={40}
-            aria-label={databaseIdLabel}
+            aria-labelledby="database-id-label"
             placeholder={databaseIdPlaceHolder}
             value={databaseId}
             onChange={handleonChangeDBId}
diff --git a/src/Explorer/Panes/AddDatabasePanel/__snapshots__/AddDatabasePanel.test.tsx.snap b/src/Explorer/Panes/AddDatabasePanel/__snapshots__/AddDatabasePanel.test.tsx.snap
deleted file mode 100644
index c9ab614a6..000000000
--- a/src/Explorer/Panes/AddDatabasePanel/__snapshots__/AddDatabasePanel.test.tsx.snap
+++ /dev/null
@@ -1,66 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`AddDatabasePane Pane should render Default properly 1`] = `
-<RightPaneForm
-  formError=""
-  isExecuting={false}
-  onSubmit={[Function]}
-  submitButtonText="OK"
->
-  <div
-    className="panelMainContent"
-  >
-    <Stack>
-      <Stack
-        horizontal={true}
-      >
-        <span
-          className="mandatoryStar"
-        >
-          * 
-        </span>
-        <Text
-          className="panelTextBold"
-          variant="small"
-        >
-          Database id
-        </Text>
-        <InfoTooltip>
-          A database is a logical container of one or more collections
-        </InfoTooltip>
-      </Stack>
-      <StyledTextFieldBase
-        aria-label="Database id"
-        aria-required="true"
-        autoComplete="off"
-        autoFocus={true}
-        data-1p-ignore={true}
-        data-lpignore={true}
-        id="database-id"
-        onChange={[Function]}
-        pattern="[^\\/?#\\\\]*[^\\/?# \\\\]"
-        placeholder="Type a new database id"
-        size={40}
-        styles={
-          {
-            "field": {
-              "fontSize": 12,
-              "selectors": {
-                "::placeholder": {
-                  "fontSize": 12,
-                },
-              },
-            },
-            "root": {
-              "width": 300,
-            },
-          }
-        }
-        title="May not end with space nor contain characters '\\' '/' '#' '?'"
-        type="text"
-        value=""
-      />
-    </Stack>
-  </div>
-</RightPaneForm>
-`;
diff --git a/test/sql/scaleAndSettings/sharedThroughput.spec.ts b/test/sql/scaleAndSettings/sharedThroughput.spec.ts
index cd754b0cc..f4f658590 100644
--- a/test/sql/scaleAndSettings/sharedThroughput.spec.ts
+++ b/test/sql/scaleAndSettings/sharedThroughput.spec.ts
@@ -36,6 +36,23 @@ test.describe("Shared Throughput Option Removed from Creation Dialogs", () => {
     await panel.waitFor({ state: "detached" });
   });
 
+  test("New Database panel 'Database id' field has an accessible name", async () => {
+    // Regression guard for bug 4768133: the "Database id" label must be
+    // programmatically associated with the edit field, so the input's accessible
+    // name is "Database id" rather than falling back to its title attribute.
+    const newDatabaseButton = await explorer.globalCommandButton("New Database");
+    await newDatabaseButton.click();
+
+    const panel = explorer.panel("New Database");
+    await panel.waitFor();
+
+    await expect(panel.getByRole("textbox", { name: "Database id" })).toBeVisible();
+
+    const closeButton = explorer.frame.getByLabel("Close New Database");
+    await closeButton.click();
+    await panel.waitFor({ state: "detached" });
+  });
+
   test("New Container panel should not show shared throughput checkbox when creating new database", async () => {
     // Open the "New Container" panel
     const newContainerButton = await explorer.globalCommandButton("New Container");