diff --git a/packages/core/src/studio-api/routes/files.ts b/packages/core/src/studio-api/routes/files.ts
index fddd4321d..8cc7996a9 100644
--- a/packages/core/src/studio-api/routes/files.ts
+++ b/packages/core/src/studio-api/routes/files.ts
@@ -84,7 +84,12 @@ function resolveFileMutationContext(c: RouteContext, adapter: StudioApiAdapter,
   return resolveProjectPath(c, adapter, (id) => `/projects/${id}/file-mutations/${operation}/`);
 }
 
-type MutationTarget = { id?: string | null; selector?: string; selectorIndex?: number };
+type MutationTarget = {
+  id?: string | null;
+  hfId?: string;
+  selector?: string;
+  selectorIndex?: number;
+};
 
 /** Write `next` to `absPath` only if it differs from `original`, returning a standardized change response. */
 function writeIfChanged(
diff --git a/packages/studio/src/components/editor/domEditingLayers.test.ts b/packages/studio/src/components/editor/domEditingLayers.test.ts
new file mode 100644
index 000000000..8a39e5441
--- /dev/null
+++ b/packages/studio/src/components/editor/domEditingLayers.test.ts
@@ -0,0 +1,30 @@
+// @vitest-environment jsdom
+import { describe, expect, it } from "vitest";
+import { resolveDomEditSelection } from "./domEditingLayers";
+
+const opts = { activeCompositionPath: "index.html", isMasterView: true, skipSourceProbe: true };
+
+describe("resolveDomEditSelection — hfId from data-hf-id", () => {
+  it("populates hfId from the element data-hf-id attribute", async () => {
+    const el = document.createElement("div");
+    el.id = "hero";
+    el.setAttribute("data-hf-id", "hf-x7k2");
+    document.body.appendChild(el);
+
+    const selection = await resolveDomEditSelection(el, opts);
+    document.body.removeChild(el);
+
+    expect(selection?.hfId).toBe("hf-x7k2");
+  });
+
+  it("leaves hfId undefined when element has no data-hf-id", async () => {
+    const el = document.createElement("div");
+    el.id = "no-hfid-el";
+    document.body.appendChild(el);
+
+    const selection = await resolveDomEditSelection(el, opts);
+    document.body.removeChild(el);
+
+    expect(selection?.hfId).toBeUndefined();
+  });
+});
diff --git a/packages/studio/src/components/editor/domEditingLayers.ts b/packages/studio/src/components/editor/domEditingLayers.ts
index bb2570b58..e53e3360d 100644
--- a/packages/studio/src/components/editor/domEditingLayers.ts
+++ b/packages/studio/src/components/editor/domEditingLayers.ts
@@ -369,6 +369,7 @@ export async function resolveDomEditSelection(
     return {
       element: current,
       id: current.id || undefined,
+      hfId: current.getAttribute("data-hf-id") ?? undefined,
       selector,
       selectorIndex,
       sourceFile,