@cardstack/boxel-cli 0.9.0 → 0.10.0-unstable.0

package/bundled-test-harness/assets/operator-mode-links-test-DN16SuIx.js

@@ -0,0 +1,793 @@
+import { s as __toESM } from "./chunk-Rp0pCe6z.js";
+import { Ar as testRealmURL } from "./runtime-common-ClpqhbwG.js";
+import { wt as setComponentTemplate } from "./cache-DtDz7X5V-Wn8jRDfL.js";
+import { H as templateFactory } from "./index-DaCZcoCY-CgzbilMy.js";
+import "./component-BJO47HTh.js";
+import { t as Component } from "./dist-CkA1rgqO.js";
+import "./template-factory-ds9s0u8l.js";
+import { t as OperatorModeContainer } from "./container-Dj-5prh9.js";
+import { M as waitUntil, c as triggerKeyEvent, d as click, l as triggerEvent, o as waitFor, s as fillIn, u as doubleClick } from "./dist-BOAdzfkP.js";
+import { t as require_qunit } from "./qunit-C-Foo4Nd.js";
+import "./mock-matrix-DPQ0j2MD.js";
+import { n as renderComponent } from "./render-component-B15Z0e2v.js";
+import { t as setupOperatorModeTests } from "./setup-Dgn0s6Zk.js";
+//#region tests/integration/components/operator-mode-links-test.gts
+var import_qunit = /* @__PURE__ */ __toESM(require_qunit());
+(0, import_qunit.module)("Integration | operator-mode | links", function(hooks) {
+	let ctx = setupOperatorModeTests(hooks);
+	let noop = () => {};
+	(0, import_qunit.test)("can choose a card for a linksTo field that has an existing value", async function(assert) {
+		ctx.setCardInOperatorModeState(`${testRealmURL}BlogPost/1`);
+		await renderComponent(class TestDriver extends Component {
+			static {
+				setComponentTemplate(templateFactory({
+					"id": "JG8d9+H0",
+					"block": "[[[8,[32,0],null,[[\"@onClose\"],[[32,1]]],null]],[],[]]",
+					"moduleName": "/home/runner/work/boxel/boxel/packages/host/tests/integration/components/operator-mode-links-test.gts",
+					"scope": () => [OperatorModeContainer, noop],
+					"isStrictMode": true
+				}), this);
+			}
+		});
+		await waitFor(`[data-test-stack-card="${testRealmURL}BlogPost/1"]`);
+		await click("[data-test-edit-button]");
+		assert.dom("[data-test-field=\"authorBio\"]").containsText("Alien Bob");
+		assert.dom("[data-test-add-new=\"authorBio\"]").doesNotExist();
+		await click("[data-test-remove-card]");
+		assert.dom("[data-test-add-new=\"authorBio\"]").exists();
+		await click("[data-test-add-new=\"authorBio\"]");
+		await waitFor(`[data-test-card-chooser-modal]`);
+		await waitFor(`[data-test-item-button="${testRealmURL}Author/2"]`);
+		await click(`[data-test-item-button="${testRealmURL}Author/2"]`);
+		assert.dom(`[data-test-item-button="${testRealmURL}Author/2"][data-test-item-button-selected]`).exists();
+		await waitUntil(() => document.querySelector(`[data-test-card-chooser-go-button]`)?.disabled === false);
+		await click("[data-test-card-chooser-go-button]");
+		await waitFor(`.operator-mode [data-test-author="R2-D2"]`);
+		assert.dom("[data-test-field=\"authorBio\"]").containsText("R2-D2");
+	});
+	(0, import_qunit.test)("can choose a card for a linksTo field that has no existing value", async function(assert) {
+		ctx.setCardInOperatorModeState(`${testRealmURL}BlogPost/2`);
+		await renderComponent(class TestDriver extends Component {
+			static {
+				setComponentTemplate(templateFactory({
+					"id": "JG8d9+H0",
+					"block": "[[[8,[32,0],null,[[\"@onClose\"],[[32,1]]],null]],[],[]]",
+					"moduleName": "/home/runner/work/boxel/boxel/packages/host/tests/integration/components/operator-mode-links-test.gts",
+					"scope": () => [OperatorModeContainer, noop],
+					"isStrictMode": true
+				}), this);
+			}
+		});
+		await waitFor(`[data-test-stack-card="${testRealmURL}BlogPost/2"]`);
+		await click("[data-test-edit-button]");
+		assert.dom("[data-test-add-new=\"authorBio\"]").exists();
+		await click("[data-test-add-new=\"authorBio\"]");
+		await waitFor(`[data-test-item-button="${testRealmURL}Author/2"]`);
+		await click(`[data-test-item-button="${testRealmURL}Author/2"]`);
+		await click("[data-test-card-chooser-go-button]");
+		await waitUntil(() => !document.querySelector("[card-chooser-modal]"));
+		assert.dom("[data-test-field=\"authorBio\"]").containsText("R2-D2");
+		await click("[data-test-edit-button]");
+		await waitFor(".operator-mode [data-test-blog-post-isolated]");
+		assert.dom(".operator-mode [data-test-blog-post-isolated]").hasText("Beginnings by R2-D2");
+	});
+	(0, import_qunit.test)("can create a new card to populate a linksTo field", async function(assert) {
+		ctx.setCardInOperatorModeState(`${testRealmURL}BlogPost/2`);
+		await renderComponent(class TestDriver extends Component {
+			static {
+				setComponentTemplate(templateFactory({
+					"id": "JG8d9+H0",
+					"block": "[[[8,[32,0],null,[[\"@onClose\"],[[32,1]]],null]],[],[]]",
+					"moduleName": "/home/runner/work/boxel/boxel/packages/host/tests/integration/components/operator-mode-links-test.gts",
+					"scope": () => [OperatorModeContainer, noop],
+					"isStrictMode": true
+				}), this);
+			}
+		});
+		let savedCards = /* @__PURE__ */ new Set();
+		this.onSave((url) => savedCards.add(url.href));
+		await waitFor(`[data-test-stack-card="${testRealmURL}BlogPost/2"]`);
+		await click("[data-test-edit-button]");
+		assert.dom("[data-test-add-new=\"authorBio\"]").exists();
+		await click("[data-test-add-new=\"authorBio\"]");
+		await waitFor(`[data-test-card-chooser-modal]`);
+		await click(`[data-test-item-button-create-new]`);
+		await waitFor("[data-test-stack-card-index=\"1\"]");
+		assert.dom("[data-test-stack-card-index=\"1\"] [data-test-field=\"firstName\"]").exists();
+		await fillIn("[data-test-stack-card-index=\"1\"] [data-test-field=\"firstName\"] [data-test-boxel-input]", "Alice");
+		await waitFor(`[data-test-stack-card-index="1"] [data-test-card="${[...savedCards].find((k) => k.includes("Author"))}"]`);
+		await click("[data-test-stack-card-index=\"1\"] [data-test-close-button]");
+		await waitFor("[data-test-stack-card-index=\"1\"]", { count: 0 });
+		assert.dom("[data-test-add-new=\"authorBio\"]").doesNotExist();
+		assert.dom("[data-test-field=\"authorBio\"]").containsText("Alice");
+		await click("[data-test-stack-card-index=\"0\"] [data-test-edit-button]");
+		assert.dom("[data-test-blog-post-isolated]").hasText("Beginnings by Alice");
+	});
+	(0, import_qunit.test)("can choose a card from a publicly readable realm to link to a card in the current realm", async function(assert) {
+		ctx.setCardInOperatorModeState(`${testRealmURL}SpecCardLinker/spec-card-linker`);
+		await renderComponent(class TestDriver extends Component {
+			static {
+				setComponentTemplate(templateFactory({
+					"id": "JG8d9+H0",
+					"block": "[[[8,[32,0],null,[[\"@onClose\"],[[32,1]]],null]],[],[]]",
+					"moduleName": "/home/runner/work/boxel/boxel/packages/host/tests/integration/components/operator-mode-links-test.gts",
+					"scope": () => [OperatorModeContainer, noop],
+					"isStrictMode": true
+				}), this);
+			}
+		});
+		await waitFor(`[data-test-stack-card="${testRealmURL}SpecCardLinker/spec-card-linker"]`);
+		await click("[data-test-edit-button]");
+		assert.dom("[data-test-add-new=\"spec\"]").exists();
+		await click("[data-test-add-new=\"spec\"]");
+		await waitFor(`[data-test-item-button="${testRealmURL}fields/biginteger-field"]`);
+		await click(`[data-test-item-button="${testRealmURL}fields/biginteger-field"]`);
+		await click("[data-test-card-chooser-go-button]");
+		await waitUntil(() => !document.querySelector("[card-chooser-modal]"));
+		await click("[data-test-edit-button]");
+		await waitFor(".operator-mode [data-test-spec-card-linker-isolated]");
+		assert.dom(".operator-mode [data-test-spec-card-linker-isolated]").hasText("The card is: Spec Card Linker Linked to: Bigint Field");
+	});
+	(0, import_qunit.test)("can remove the link for a linksTo field", async function(assert) {
+		ctx.setCardInOperatorModeState(`${testRealmURL}BlogPost/1`);
+		await renderComponent(class TestDriver extends Component {
+			static {
+				setComponentTemplate(templateFactory({
+					"id": "JG8d9+H0",
+					"block": "[[[8,[32,0],null,[[\"@onClose\"],[[32,1]]],null]],[],[]]",
+					"moduleName": "/home/runner/work/boxel/boxel/packages/host/tests/integration/components/operator-mode-links-test.gts",
+					"scope": () => [OperatorModeContainer, noop],
+					"isStrictMode": true
+				}), this);
+			}
+		});
+		await waitFor(`[data-test-stack-card="${testRealmURL}BlogPost/1"]`);
+		await click("[data-test-edit-button]");
+		assert.dom("[data-test-field=\"authorBio\"]").containsText("Alien Bob");
+		await click("[data-test-field=\"authorBio\"] [data-test-remove-card]");
+		await click("[data-test-edit-button]");
+		await waitFor(".operator-mode [data-test-blog-post-isolated]");
+		assert.dom(".operator-mode [data-test-blog-post-isolated]").hasText("Outer Space Journey by");
+	});
+	(0, import_qunit.test)("can add a card to a linksToMany field with existing values", async function(assert) {
+		ctx.setCardInOperatorModeState(`${testRealmURL}Person/burcu`);
+		await renderComponent(class TestDriver extends Component {
+			static {
+				setComponentTemplate(templateFactory({
+					"id": "JG8d9+H0",
+					"block": "[[[8,[32,0],null,[[\"@onClose\"],[[32,1]]],null]],[],[]]",
+					"moduleName": "/home/runner/work/boxel/boxel/packages/host/tests/integration/components/operator-mode-links-test.gts",
+					"scope": () => [OperatorModeContainer, noop],
+					"isStrictMode": true
+				}), this);
+			}
+		});
+		await waitFor(`[data-test-stack-card="${testRealmURL}Person/burcu"]`);
+		await click("[data-test-edit-button]");
+		assert.dom("[data-test-field=\"friends\"]").containsText("Jackie Woody");
+		assert.dom("[data-test-field=\"friends\"] [data-test-add-new]").exists();
+		await click("[data-test-links-to-many=\"friends\"] [data-test-add-new]");
+		await waitFor(`[data-test-item-button="${testRealmURL}Pet/mango"]`);
+		await click(`[data-test-item-button="${testRealmURL}Pet/mango"]`);
+		await click("[data-test-card-chooser-go-button]");
+		await waitUntil(() => !document.querySelector("[card-chooser-modal]"));
+		assert.dom("[data-test-field=\"friends\"]").containsText("Jackie Woody Buzz Mango");
+		assert.dom("[data-test-links-to-many=\"friends\"] [data-test-card-format=\"fitted\"]").exists({ count: 4 });
+	});
+	(0, import_qunit.test)("can add a card to a linksTo field creating a loop", async function(assert) {
+		ctx.setCardInOperatorModeState(`${testRealmURL}Friend/friend-b`);
+		await renderComponent(class TestDriver extends Component {
+			static {
+				setComponentTemplate(templateFactory({
+					"id": "JG8d9+H0",
+					"block": "[[[8,[32,0],null,[[\"@onClose\"],[[32,1]]],null]],[],[]]",
+					"moduleName": "/home/runner/work/boxel/boxel/packages/host/tests/integration/components/operator-mode-links-test.gts",
+					"scope": () => [OperatorModeContainer, noop],
+					"isStrictMode": true
+				}), this);
+			}
+		});
+		await waitFor(`[data-test-stack-card="${testRealmURL}Friend/friend-b"]`);
+		await click("[data-test-edit-button]");
+		assert.dom("[data-test-field=\"friend\"] [data-test-add-new]").exists();
+		await click("[data-test-field=\"friend\"] [data-test-add-new]");
+		await waitFor(`[data-test-item-button="${testRealmURL}Friend/friend-a"]`);
+		await click(`[data-test-item-button="${testRealmURL}Friend/friend-a"]`);
+		await click("[data-test-card-chooser-go-button]");
+		await waitUntil(() => !document.querySelector("[card-chooser-modal]"));
+		assert.dom("[data-test-stack-card] [data-test-field=\"friend\"]").containsText("Friend A");
+		await waitFor("[data-test-submode-switcher]");
+		assert.dom("[data-test-submode-switcher]").exists();
+		assert.dom("[data-test-submode-switcher]").hasText("Interact");
+		await click("[data-test-submode-switcher] .submode-switcher-dropdown-trigger");
+		await click("[data-test-boxel-menu-item-text=\"Code\"]");
+		await waitFor("[data-test-submode-switcher]");
+		assert.dom("[data-test-submode-switcher]").hasText("Code");
+	});
+	(0, import_qunit.test)("can add a card to linksToMany field that has no existing values", async function(assert) {
+		ctx.setCardInOperatorModeState(`${testRealmURL}Person/fadhlan`);
+		await renderComponent(class TestDriver extends Component {
+			static {
+				setComponentTemplate(templateFactory({
+					"id": "JG8d9+H0",
+					"block": "[[[8,[32,0],null,[[\"@onClose\"],[[32,1]]],null]],[],[]]",
+					"moduleName": "/home/runner/work/boxel/boxel/packages/host/tests/integration/components/operator-mode-links-test.gts",
+					"scope": () => [OperatorModeContainer, noop],
+					"isStrictMode": true
+				}), this);
+			}
+		});
+		await waitFor(`[data-test-stack-card="${testRealmURL}Person/fadhlan"]`);
+		await click("[data-test-edit-button]");
+		assert.dom("[data-test-field=\"friends\"] [data-test-pet]").doesNotExist();
+		assert.dom("[data-test-add-new=\"friends\"]").hasText("Add Pets");
+		await click("[data-test-add-new=\"friends\"]");
+		await waitFor(`[data-test-item-button="${testRealmURL}Pet/mango"]`);
+		await click(`[data-test-item-button="${testRealmURL}Pet/jackie"]`);
+		await click("[data-test-card-chooser-go-button]");
+		await waitUntil(() => !document.querySelector("[card-chooser-modal]"));
+		assert.dom("[data-test-field=\"friends\"]").containsText("Jackie");
+	});
+	(0, import_qunit.test)("can add a card to linksToMany field that has a null value for relationship", async function(assert) {
+		ctx.setCardInOperatorModeState(`${testRealmURL}Person/hassan`);
+		await renderComponent(class TestDriver extends Component {
+			static {
+				setComponentTemplate(templateFactory({
+					"id": "JG8d9+H0",
+					"block": "[[[8,[32,0],null,[[\"@onClose\"],[[32,1]]],null]],[],[]]",
+					"moduleName": "/home/runner/work/boxel/boxel/packages/host/tests/integration/components/operator-mode-links-test.gts",
+					"scope": () => [OperatorModeContainer, noop],
+					"isStrictMode": true
+				}), this);
+			}
+		});
+		await waitFor(`[data-test-stack-card="${testRealmURL}Person/hassan"]`);
+		await click("[data-test-edit-button]");
+		assert.dom("[data-test-field=\"friends\"] [data-test-pet]").doesNotExist();
+		assert.dom("[data-test-field=\"friends\"] [data-test-add-new]").hasText("Add Pets");
+		await click("[data-test-field=\"friends\"] [data-test-add-new]");
+		await waitFor(`[data-test-item-button="${testRealmURL}Pet/mango"]`);
+		await click(`[data-test-item-button="${testRealmURL}Pet/jackie"]`);
+		await click("[data-test-card-chooser-go-button]");
+		await waitUntil(() => !document.querySelector("[card-chooser-modal]"));
+		assert.dom("[data-test-field=\"friends\"]").containsText("Jackie");
+	});
+	(0, import_qunit.test)("can change the item selection in a linksToMany field", async function(assert) {
+		ctx.setCardInOperatorModeState(`${testRealmURL}Person/burcu`);
+		await renderComponent(class TestDriver extends Component {
+			static {
+				setComponentTemplate(templateFactory({
+					"id": "JG8d9+H0",
+					"block": "[[[8,[32,0],null,[[\"@onClose\"],[[32,1]]],null]],[],[]]",
+					"moduleName": "/home/runner/work/boxel/boxel/packages/host/tests/integration/components/operator-mode-links-test.gts",
+					"scope": () => [OperatorModeContainer, noop],
+					"isStrictMode": true
+				}), this);
+			}
+		});
+		await waitFor(`[data-test-stack-card="${testRealmURL}Person/burcu"]`);
+		await click("[data-test-edit-button]");
+		assert.dom("[data-test-field=\"friends\"]").containsText("Jackie Woody");
+		await click("[data-test-links-to-many=\"friends\"] [data-test-item=\"1\"] [data-test-remove-card]");
+		assert.dom("[data-test-field=\"friends\"]").containsText("Jackie");
+		await click("[data-test-links-to-many=\"friends\"] [data-test-add-new]");
+		await waitFor(`[data-test-item-button="${testRealmURL}Pet/mango"]`);
+		await click(`[data-test-item-button="${testRealmURL}Pet/mango"]`);
+		await click("[data-test-card-chooser-go-button]");
+		await waitUntil(() => !document.querySelector("[card-chooser-modal]"));
+		assert.dom("[data-test-field=\"friends\"]").containsText("Mango");
+	});
+	(0, import_qunit.test)("can create a new card to add to a linksToMany field from card chooser", async function(assert) {
+		ctx.setCardInOperatorModeState(`${testRealmURL}Person/fadhlan`);
+		await renderComponent(class TestDriver extends Component {
+			static {
+				setComponentTemplate(templateFactory({
+					"id": "JG8d9+H0",
+					"block": "[[[8,[32,0],null,[[\"@onClose\"],[[32,1]]],null]],[],[]]",
+					"moduleName": "/home/runner/work/boxel/boxel/packages/host/tests/integration/components/operator-mode-links-test.gts",
+					"scope": () => [OperatorModeContainer, noop],
+					"isStrictMode": true
+				}), this);
+			}
+		});
+		let savedCards = /* @__PURE__ */ new Set();
+		this.onSave((url) => savedCards.add(url.href));
+		await waitFor(`[data-test-stack-card="${testRealmURL}Person/fadhlan"]`);
+		await click("[data-test-edit-button]");
+		assert.dom("[data-test-field=\"friends\"] [data-test-pet]").doesNotExist();
+		await click("[data-test-links-to-many=\"friends\"] [data-test-add-new]");
+		await waitFor(`[data-test-card-chooser-modal]`);
+		assert.dom("[data-test-item-button-create-new]").hasText("Create New Pet");
+		await click("[data-test-item-button-create-new]");
+		await waitFor(`[data-test-stack-card-index="1"]`);
+		await fillIn("[data-test-stack-card-index=\"1\"] [data-test-field=\"name\"] [data-test-boxel-input]", "Woodster");
+		await waitFor(`[data-test-stack-card-index="1"] [data-test-card="${[...savedCards].find((k) => k.includes("Pet"))}"]`);
+		await click("[data-test-stack-card-index=\"1\"] [data-test-close-button]");
+		await waitUntil(() => !document.querySelector("[data-test-stack-card-index=\"1\"]"));
+		assert.dom("[data-test-field=\"friends\"]").containsText("Woodster");
+	});
+	(0, import_qunit.test)("does not create a new card to add to a linksToMany field from card chooser, if user cancel the edit view", async function(assert) {
+		ctx.setCardInOperatorModeState(`${testRealmURL}Person/burcu`);
+		await renderComponent(class TestDriver extends Component {
+			static {
+				setComponentTemplate(templateFactory({
+					"id": "JG8d9+H0",
+					"block": "[[[8,[32,0],null,[[\"@onClose\"],[[32,1]]],null]],[],[]]",
+					"moduleName": "/home/runner/work/boxel/boxel/packages/host/tests/integration/components/operator-mode-links-test.gts",
+					"scope": () => [OperatorModeContainer, noop],
+					"isStrictMode": true
+				}), this);
+			}
+		});
+		let savedCards = /* @__PURE__ */ new Set();
+		this.onSave((url) => savedCards.add(url.href));
+		await waitFor(`[data-test-stack-card="${testRealmURL}Person/burcu"]`);
+		await click("[data-test-edit-button]");
+		assert.dom("[data-test-field=\"friends\"]").containsText("Jackie Woody");
+		await click("[data-test-links-to-many=\"friends\"] [data-test-add-new]");
+		await waitFor(`[data-test-card-chooser-modal]`);
+		assert.dom("[data-test-item-button-create-new]").hasText("Create New Pet");
+		await click("[data-test-item-button-create-new]");
+		await waitFor(`[data-test-stack-card-index="1"]`);
+		await fillIn("[data-test-stack-card-index=\"1\"] [data-test-field=\"name\"] [data-test-boxel-input]", "Woodster");
+		await waitFor(`[data-test-stack-card-index="1"] [data-test-card="${[...savedCards].find((k) => k.includes("Pet"))}"]`);
+		await click("[data-test-stack-card-index=\"1\"] [data-test-close-button]");
+		await waitUntil(() => !document.querySelector("[data-test-stack-card-index=\"1\"]"));
+		assert.dom("[data-test-field=\"friends\"]").containsText("Jackie Woody");
+		await click("[data-test-links-to-many=\"friends\"] [data-test-add-new]");
+		await waitFor(`[data-test-card-chooser-modal]`);
+		assert.dom("[data-test-item-button-create-new]").hasText("Create New Pet");
+	});
+	(0, import_qunit.test)("can remove all items of a linksToMany field", async function(assert) {
+		ctx.setCardInOperatorModeState(`${testRealmURL}Person/burcu`);
+		await renderComponent(class TestDriver extends Component {
+			static {
+				setComponentTemplate(templateFactory({
+					"id": "JG8d9+H0",
+					"block": "[[[8,[32,0],null,[[\"@onClose\"],[[32,1]]],null]],[],[]]",
+					"moduleName": "/home/runner/work/boxel/boxel/packages/host/tests/integration/components/operator-mode-links-test.gts",
+					"scope": () => [OperatorModeContainer, noop],
+					"isStrictMode": true
+				}), this);
+			}
+		});
+		await waitFor(`[data-test-stack-card="${testRealmURL}Person/burcu"]`);
+		assert.dom(`[data-test-plural-view-field="friends"] [data-test-plural-view-item]`).exists({ count: 3 });
+		await click("[data-test-edit-button]");
+		assert.dom("[data-test-field=\"friends\"]").containsText("Jackie Woody");
+		await click("[data-test-links-to-many=\"friends\"] [data-test-item=\"1\"] [data-test-remove-card]");
+		await click("[data-test-links-to-many=\"friends\"] [data-test-item=\"0\"] [data-test-remove-card]");
+		await click("[data-test-links-to-many=\"friends\"] [data-test-item=\"0\"] [data-test-remove-card]");
+		await click("[data-test-edit-button]");
+		await waitFor(`[data-test-person="Burcu"]`);
+		assert.dom(`[data-test-stack-card="${testRealmURL}Person/burcu"]`).doesNotContainText("Jackie");
+		assert.dom(`[data-test-plural-view-field="friends"] [data-test-plural-view-item]`).doesNotExist();
+	});
+	(0, import_qunit.test)("New cards are optimistically created for a linksTo field", async function(assert) {
+		ctx.setCardInOperatorModeState(`${testRealmURL}Person/1`, "edit");
+		await renderComponent(class TestDriver extends Component {
+			static {
+				setComponentTemplate(templateFactory({
+					"id": "JG8d9+H0",
+					"block": "[[[8,[32,0],null,[[\"@onClose\"],[[32,1]]],null]],[],[]]",
+					"moduleName": "/home/runner/work/boxel/boxel/packages/host/tests/integration/components/operator-mode-links-test.gts",
+					"scope": () => [OperatorModeContainer, noop],
+					"isStrictMode": true
+				}), this);
+			}
+		});
+		let savedCards = /* @__PURE__ */ new Set();
+		this.onSave((url) => {
+			savedCards.add(url.href);
+		});
+		await waitFor(`[data-test-stack-card="${testRealmURL}Person/1"]`);
+		await waitFor("[data-test-links-to-editor=\"pet\"] [data-test-remove-card]");
+		await click("[data-test-links-to-editor=\"pet\"] [data-test-remove-card]");
+		await waitFor("[data-test-add-new=\"pet\"]");
+		assert.dom("[data-test-add-new=\"pet\"]").exists();
+		assert.dom("[data-test-links-to-editor=\"pet\"] [data-test-boxel-card-container]").doesNotExist();
+		await click("[data-test-add-new=\"pet\"]");
+		await waitFor(`[data-test-card-chooser-modal]`);
+		await waitFor(`[data-test-item-button-create-new]`);
+		await click(`[data-test-item-button-create-new]`);
+		await waitFor("[data-test-stack-card-index=\"1\"]");
+		assert.strictEqual(savedCards.size, 2, "Person and Pet cards have been saved");
+		assert.ok(savedCards.has(`${testRealmURL}Person/1`), "Person card was saved");
+		let petCardUrl = [...savedCards].find((url) => url.includes("Pet/"));
+		assert.ok(petCardUrl, "Pet card was saved");
+		await fillIn(`[data-test-stack-card-index="1"] [data-test-field="name"] input`, "Mango");
+		await click(`[data-test-stack-card-index="1"] [data-test-close-button]`);
+		assert.dom(`[data-test-stack-card="${testRealmURL}Person/1"] [data-test-links-to-editor="pet"]`).containsText("Mango", "the embedded link of new card is rendered correctly");
+		let path = Array.from(savedCards).map((url) => url.substring(testRealmURL.length) + ".json").find((p) => p.includes("Pet/"));
+		let fileRef = await ctx.testRealmAdapter.openFile(path);
+		assert.deepEqual(JSON.parse(fileRef.content), { data: {
+			attributes: {
+				name: "Mango",
+				cardInfo: {
+					name: null,
+					summary: null,
+					cardThumbnailURL: null,
+					notes: null
+				}
+			},
+			meta: { adoptsFrom: {
+				module: "../pet",
+				name: "Pet"
+			} },
+			type: "card"
+		} }, "file contents were saved correctly");
+	});
+	(0, import_qunit.test)("Clicking on \"Finish Editing\" after creating a card from linksTo field will switch the card into isolated mode", async function(assert) {
+		ctx.setCardInOperatorModeState(`${testRealmURL}BlogPost/2`);
+		await renderComponent(class TestDriver extends Component {
+			static {
+				setComponentTemplate(templateFactory({
+					"id": "JG8d9+H0",
+					"block": "[[[8,[32,0],null,[[\"@onClose\"],[[32,1]]],null]],[],[]]",
+					"moduleName": "/home/runner/work/boxel/boxel/packages/host/tests/integration/components/operator-mode-links-test.gts",
+					"scope": () => [OperatorModeContainer, noop],
+					"isStrictMode": true
+				}), this);
+			}
+		});
+		await waitFor(`[data-test-stack-card="${testRealmURL}BlogPost/2"]`);
+		await click("[data-test-edit-button]");
+		assert.dom("[data-test-add-new=\"authorBio\"]").exists();
+		await click("[data-test-add-new=\"authorBio\"]");
+		await waitFor(`[data-test-card-chooser-modal]`);
+		await click(`[data-test-item-button-create-new]`);
+		await waitFor("[data-test-stack-card-index=\"1\"]");
+		await click("[data-test-stack-card-index=\"1\"] [data-test-edit-button]");
+		await waitFor("[data-test-isolated-author]");
+		assert.dom("[data-test-isolated-author]").exists();
+	});
+	(0, import_qunit.test)("can reorder linksToMany cards in edit view without affecting other linksToMany cards", async function(assert) {
+		ctx.setCardInOperatorModeState(`${testRealmURL}grid`);
+		await renderComponent(class TestDriver extends Component {
+			static {
+				setComponentTemplate(templateFactory({
+					"id": "JG8d9+H0",
+					"block": "[[[8,[32,0],null,[[\"@onClose\"],[[32,1]]],null]],[],[]]",
+					"moduleName": "/home/runner/work/boxel/boxel/packages/host/tests/integration/components/operator-mode-links-test.gts",
+					"scope": () => [OperatorModeContainer, noop],
+					"isStrictMode": true
+				}), this);
+			}
+		});
+		await click(`[data-test-boxel-filter-list-button="All Cards"]`);
+		await waitFor(`[data-test-cards-grid-item]`);
+		await click(`[data-test-cards-grid-item="${testRealmURL}Person/burcu"] .field-component-card`);
+		await waitFor(`[data-test-stack-card="${testRealmURL}Person/burcu"]`);
+		assert.dom(`[data-test-plural-view-field="friends"] [data-test-plural-view-item]`).exists({ count: 3 });
+		assert.dom(`[data-test-plural-view-field="cars"] [data-test-plural-view-item]`).exists({ count: 2 });
+		assert.dom(`[data-test-plural-view-field="friends"] [data-test-plural-view-item="0"]`).hasText("Jackie");
+		assert.dom(`[data-test-plural-view-field="friends"] [data-test-plural-view-item="1"]`).hasText("Woody");
+		assert.dom(`[data-test-plural-view-field="friends"] [data-test-plural-view-item="2"]`).hasText("Buzz");
+		await click(`[data-test-stack-card="${testRealmURL}Person/burcu"] [data-test-edit-button]`);
+		assert.dom("[data-test-list=\"friends\"] [data-test-item]").exists({ count: 3 });
+		assert.dom(`[data-test-list="friends"] [data-test-item="0"] [data-test-card="${testRealmURL}Pet/jackie"]`).exists();
+		assert.dom(`[data-test-list="friends"] [data-test-item="0"]`).hasText("Jackie");
+		assert.dom(`[data-test-list="friends"] [data-test-item="1"] [data-test-card="${testRealmURL}Pet/woody"]`).exists();
+		assert.dom(`[data-test-list="friends"] [data-test-item="1"]`).hasText("Woody");
+		assert.dom(`[data-test-list="friends"] [data-test-item="2"] [data-test-card="${testRealmURL}Pet/buzz"]`).exists();
+		assert.dom(`[data-test-list="friends"] [data-test-item="2"]`).hasText("Buzz");
+		assert.dom("[data-test-list=\"cars\"] [data-test-item]").exists({ count: 2 });
+		assert.dom(`[data-test-list="cars"] [data-test-item="0"]`).hasText("Myvi");
+		assert.dom(`[data-test-list="cars"] [data-test-item="1"]`).hasText("Proton");
+		let dragAndDrop = async (itemSelector, targetSelector) => {
+			let itemElement = document.querySelector(itemSelector);
+			let targetElement = document.querySelector(targetSelector);
+			if (!itemElement || !targetElement) throw new Error("Item or target element not found");
+			let itemRect = itemElement.getBoundingClientRect();
+			let targetRect = targetElement.getBoundingClientRect();
+			await triggerEvent(itemElement, "mousedown", {
+				clientX: itemRect.left + itemRect.width / 2,
+				clientY: itemRect.top + itemRect.height / 2
+			});
+			await triggerEvent(document, "mousemove", {
+				clientX: itemRect.left + 1,
+				clientY: itemRect.top + 1
+			});
+			let firstStackItemHeaderRect = document.querySelector("[data-test-operator-mode-stack=\"0\"] header").getBoundingClientRect();
+			let firstStackItemPaddingTop = getComputedStyle(document.querySelector("[data-test-operator-mode-stack=\"0\"]")).getPropertyValue("padding-top").replace("px", "");
+			let marginTop = firstStackItemHeaderRect.height + Number(firstStackItemPaddingTop);
+			await triggerEvent(document, "mousemove", {
+				clientX: targetRect.left + targetRect.width / 2,
+				clientY: targetRect.top - marginTop
+			});
+			await triggerEvent(itemElement, "mouseup", {
+				clientX: targetRect.left + targetRect.width / 2,
+				clientY: targetRect.top - marginTop
+			});
+		};
+		await dragAndDrop("[data-test-sort=\"1\"]", "[data-test-sort=\"0\"]");
+		await dragAndDrop("[data-test-sort=\"2\"]", "[data-test-sort=\"1\"]");
+		assert.dom("[data-test-list=\"friends\"] [data-test-item]").exists({ count: 3 });
+		assert.dom(`[data-test-list="friends"] [data-test-item="0"] [data-test-card="${testRealmURL}Pet/woody"]`).exists();
+		assert.dom(`[data-test-list="friends"] [data-test-item="0"]`).hasText("Woody");
+		assert.dom(`[data-test-list="friends"] [data-test-item="1"] [data-test-card="${testRealmURL}Pet/buzz"]`).exists();
+		assert.dom(`[data-test-list="friends"] [data-test-item="1"]`).hasText("Buzz");
+		assert.dom(`[data-test-list="friends"] [data-test-item="2"] [data-test-card="${testRealmURL}Pet/jackie"]`).exists();
+		assert.dom(`[data-test-list="friends"] [data-test-item="2"]`).hasText("Jackie");
+		await triggerEvent(`[data-test-item="0"]`, "mouseenter");
+		let itemElement = document.querySelector(`[data-test-list="friends"] [data-test-item="0"]`);
+		let overlayButtonElements = document.querySelectorAll(`[data-test-card="${testRealmURL}Pet/woody"]`);
+		if (!itemElement || !overlayButtonElements || overlayButtonElements.length === 0) throw new Error("Item or overlay button element not found");
+		let itemRect = itemElement.getBoundingClientRect();
+		let overlayButtonRect = overlayButtonElements[overlayButtonElements.length - 1].getBoundingClientRect();
+		let verticalDiff = Math.abs(Math.round(itemRect.top) - Math.round(overlayButtonRect.top));
+		assert.ok(verticalDiff <= 1, `overlay button aligns vertically within 1px (diff=${verticalDiff}px)`);
+		let expectedLeft = Math.floor(itemRect.left + 39 / 2);
+		let horizontalDiff = Math.abs(expectedLeft - Math.floor(overlayButtonRect.left));
+		assert.ok(horizontalDiff <= 1, `overlay button aligns horizontally within 1px (diff=${horizontalDiff}px)`);
+		await click(`[data-test-stack-card="${testRealmURL}Person/burcu"] [data-test-edit-button]`);
+		assert.dom(`[data-test-plural-view-field="friends"] [data-test-plural-view-item="0"]`).hasText("Woody");
+		assert.dom(`[data-test-plural-view-field="friends"] [data-test-plural-view-item="1"]`).hasText("Buzz");
+		assert.dom(`[data-test-plural-view-field="friends"] [data-test-plural-view-item="2"]`).hasText("Jackie");
+		assert.dom(`[data-test-plural-view-field="cars"] [data-test-plural-view-item="0"]`).hasText("Myvi");
+		assert.dom(`[data-test-plural-view-field="cars"] [data-test-plural-view-item="1"]`).hasText("Proton");
+	});
+	(0, import_qunit.test)("can reorder containsMany cards in edit view without affecting other containsMany cards", async function(assert) {
+		ctx.setCardInOperatorModeState(`${testRealmURL}grid`);
+		await renderComponent(class TestDriver extends Component {
+			static {
+				setComponentTemplate(templateFactory({
+					"id": "JG8d9+H0",
+					"block": "[[[8,[32,0],null,[[\"@onClose\"],[[32,1]]],null]],[],[]]",
+					"moduleName": "/home/runner/work/boxel/boxel/packages/host/tests/integration/components/operator-mode-links-test.gts",
+					"scope": () => [OperatorModeContainer, noop],
+					"isStrictMode": true
+				}), this);
+			}
+		});
+		await click(`[data-test-boxel-filter-list-button="All Cards"]`);
+		await waitFor(`[data-test-cards-grid-item]`);
+		await click(`[data-test-cards-grid-item="${testRealmURL}Person/burcu"] .field-component-card`);
+		await waitFor(`[data-test-stack-card="${testRealmURL}Person/burcu"]`);
+		assert.dom(`[data-test-plural-view-field="nicknames"] [data-test-plural-view-item]`).exists({ count: 3 });
+		assert.dom(`[data-test-plural-view-field="favoriteGames"] [data-test-plural-view-item]`).exists({ count: 2 });
+		assert.dom(`[data-test-plural-view-field="nicknames"]`).containsText("Ace");
+		assert.dom(`[data-test-plural-view-field="nicknames"]`).containsText("Bolt");
+		assert.dom(`[data-test-plural-view-field="nicknames"]`).containsText("Comet");
+		assert.dom(`[data-test-plural-view-field="favoriteGames"]`).containsText("Chess");
+		assert.dom(`[data-test-plural-view-field="favoriteGames"]`).containsText("Go");
+		await click(`[data-test-stack-card="${testRealmURL}Person/burcu"] [data-test-edit-button]`);
+		document.querySelector("[data-test-list=\"nicknames\"]")?.scrollIntoView({ block: "center" });
+		assert.dom("[data-test-list=\"nicknames\"] [data-test-item]").exists({ count: 3 });
+		assert.dom("[data-test-list=\"favoriteGames\"] [data-test-item]").exists({ count: 2 });
+		assert.dom(`[data-test-list="nicknames"] [data-test-item="0"] input`).hasValue("Ace");
+		assert.dom(`[data-test-list="nicknames"] [data-test-item="1"] input`).hasValue("Bolt");
+		assert.dom(`[data-test-list="nicknames"] [data-test-item="2"] input`).hasValue("Comet");
+		assert.dom(`[data-test-list="favoriteGames"] [data-test-item="0"] input`).hasValue("Chess");
+		assert.dom(`[data-test-list="favoriteGames"] [data-test-item="1"] input`).hasValue("Go");
+		let dragAndDrop = async (itemSelector, targetSelector) => {
+			let itemElement = document.querySelector(itemSelector);
+			let targetElement = document.querySelector(targetSelector);
+			if (!itemElement || !targetElement) throw new Error("Item or target element not found");
+			let itemRect = itemElement.getBoundingClientRect();
+			let targetRect = targetElement.getBoundingClientRect();
+			await triggerEvent(itemElement, "mousedown", {
+				clientX: itemRect.left + itemRect.width / 2,
+				clientY: itemRect.top + itemRect.height / 2
+			});
+			await triggerEvent(document, "mousemove", {
+				clientX: itemRect.left + 1,
+				clientY: itemRect.top + 1
+			});
+			let firstStackItemHeaderRect = document.querySelector("[data-test-operator-mode-stack=\"0\"] header").getBoundingClientRect();
+			let firstStackItemPaddingTop = getComputedStyle(document.querySelector("[data-test-operator-mode-stack=\"0\"]")).getPropertyValue("padding-top").replace("px", "");
+			let marginTop = firstStackItemHeaderRect.height + Number(firstStackItemPaddingTop);
+			await triggerEvent(document, "mousemove", {
+				clientX: targetRect.left + targetRect.width / 2,
+				clientY: targetRect.top - marginTop
+			});
+			await triggerEvent(itemElement, "mouseup", {
+				clientX: targetRect.left + targetRect.width / 2,
+				clientY: targetRect.top - marginTop
+			});
+		};
+		await dragAndDrop("[data-test-list=\"nicknames\"] [data-test-sort=\"1\"]", "[data-test-list=\"nicknames\"] [data-test-sort=\"0\"]");
+		assert.dom("[data-test-list=\"nicknames\"] [data-test-item]").exists({ count: 3 });
+		assert.dom(`[data-test-list="nicknames"] [data-test-item="0"] input`).hasValue("Bolt");
+		assert.dom(`[data-test-list="nicknames"] [data-test-item="1"] input`).hasValue("Ace");
+		assert.dom(`[data-test-list="nicknames"] [data-test-item="2"] input`).hasValue("Comet");
+		assert.dom(`[data-test-list="favoriteGames"] [data-test-item="0"] input`).hasValue("Chess");
+		assert.dom(`[data-test-list="favoriteGames"] [data-test-item="1"] input`).hasValue("Go");
+		await click(`[data-test-stack-card="${testRealmURL}Person/burcu"] [data-test-edit-button]`);
+		assert.dom(`[data-test-plural-view-field="nicknames"] [data-test-plural-view-item]`).exists({ count: 3 });
+		assert.dom(`[data-test-plural-view-field="nicknames"]`).containsText("Bolt");
+		assert.dom(`[data-test-plural-view-field="nicknames"]`).containsText("Ace");
+		assert.dom(`[data-test-plural-view-field="nicknames"]`).containsText("Comet");
+		assert.dom(`[data-test-plural-view-field="favoriteGames"] [data-test-plural-view-item]`).exists({ count: 2 });
+		assert.dom(`[data-test-plural-view-field="favoriteGames"]`).containsText("Chess");
+		assert.dom(`[data-test-plural-view-field="favoriteGames"]`).containsText("Go");
+	});
+	(0, import_qunit.test)("can add multiple cards at once to a linksToMany field", async function(assert) {
+		ctx.setCardInOperatorModeState(`${testRealmURL}Person/fadhlan`);
+		await renderComponent(class TestDriver extends Component {
+			static {
+				setComponentTemplate(templateFactory({
+					"id": "JG8d9+H0",
+					"block": "[[[8,[32,0],null,[[\"@onClose\"],[[32,1]]],null]],[],[]]",
+					"moduleName": "/home/runner/work/boxel/boxel/packages/host/tests/integration/components/operator-mode-links-test.gts",
+					"scope": () => [OperatorModeContainer, noop],
+					"isStrictMode": true
+				}), this);
+			}
+		});
+		await waitFor(`[data-test-stack-card="${testRealmURL}Person/fadhlan"]`);
+		await click("[data-test-edit-button]");
+		assert.dom("[data-test-field=\"friends\"] [data-test-pet]").doesNotExist();
+		await click("[data-test-links-to-many=\"friends\"] [data-test-add-new]");
+		await waitFor("[data-test-card-chooser-modal]");
+		await waitFor(`[data-test-item-button="${testRealmURL}Pet/jackie"]`);
+		await click(`[data-test-item-button="${testRealmURL}Pet/jackie"]`);
+		await click(`[data-test-item-button="${testRealmURL}Pet/mango"]`);
+		assert.dom(`[data-test-item-button="${testRealmURL}Pet/jackie"][data-test-item-button-selected]`).exists("Jackie is selected");
+		assert.dom(`[data-test-item-button="${testRealmURL}Pet/mango"][data-test-item-button-selected]`).exists("Mango is selected");
+		await click("[data-test-card-chooser-go-button]");
+		await waitUntil(() => !document.querySelector("[data-test-card-chooser-modal]"));
+		assert.dom("[data-test-field=\"friends\"]").containsText("Jackie");
+		assert.dom("[data-test-field=\"friends\"]").containsText("Mango");
+		assert.dom("[data-test-links-to-many=\"friends\"] [data-test-card-format=\"fitted\"]").exists({ count: 2 });
+	});
+	(0, import_qunit.test)("already-linked cards are excluded from the multi-select chooser", async function(assert) {
+		ctx.setCardInOperatorModeState(`${testRealmURL}Person/burcu`);
+		await renderComponent(class TestDriver extends Component {
+			static {
+				setComponentTemplate(templateFactory({
+					"id": "JG8d9+H0",
+					"block": "[[[8,[32,0],null,[[\"@onClose\"],[[32,1]]],null]],[],[]]",
+					"moduleName": "/home/runner/work/boxel/boxel/packages/host/tests/integration/components/operator-mode-links-test.gts",
+					"scope": () => [OperatorModeContainer, noop],
+					"isStrictMode": true
+				}), this);
+			}
+		});
+		await waitFor(`[data-test-stack-card="${testRealmURL}Person/burcu"]`);
+		await click("[data-test-edit-button]");
+		assert.dom("[data-test-field=\"friends\"]").containsText("Jackie Woody");
+		await click("[data-test-links-to-many=\"friends\"] [data-test-add-new]");
+		await waitFor("[data-test-card-chooser-modal]");
+		await waitFor(`[data-test-item-button="${testRealmURL}Pet/mango"]`);
+		assert.dom(`[data-test-item-button="${testRealmURL}Pet/jackie"]`).doesNotExist("Jackie is already linked and should be excluded");
+		assert.dom(`[data-test-item-button="${testRealmURL}Pet/woody"]`).doesNotExist("Woody is already linked and should be excluded");
+		assert.dom(`[data-test-item-button="${testRealmURL}Pet/buzz"]`).doesNotExist("Buzz is already linked and should be excluded");
+		assert.dom(`[data-test-item-button="${testRealmURL}Pet/mango"]`).exists("Mango is not linked and should appear");
+	});
+	(0, import_qunit.test)("in multi-select mode, clicking a card toggles selection without submitting the modal", async function(assert) {
+		ctx.setCardInOperatorModeState(`${testRealmURL}Person/fadhlan`);
+		await renderComponent(class TestDriver extends Component {
+			static {
+				setComponentTemplate(templateFactory({
+					"id": "JG8d9+H0",
+					"block": "[[[8,[32,0],null,[[\"@onClose\"],[[32,1]]],null]],[],[]]",
+					"moduleName": "/home/runner/work/boxel/boxel/packages/host/tests/integration/components/operator-mode-links-test.gts",
+					"scope": () => [OperatorModeContainer, noop],
+					"isStrictMode": true
+				}), this);
+			}
+		});
+		await waitFor(`[data-test-stack-card="${testRealmURL}Person/fadhlan"]`);
+		await click("[data-test-edit-button]");
+		await click("[data-test-links-to-many=\"friends\"] [data-test-add-new]");
+		await waitFor("[data-test-card-chooser-modal]");
+		await waitFor(`[data-test-item-button="${testRealmURL}Pet/jackie"]`);
+		assert.dom("[data-test-item-button-selected]").doesNotExist();
+		await click(`[data-test-item-button="${testRealmURL}Pet/jackie"]`);
+		assert.dom(`[data-test-item-button="${testRealmURL}Pet/jackie"]`).hasAttribute("data-test-item-button-selected", "true", "card is selected");
+		assert.dom("[data-test-card-chooser-modal]").exists("modal remains open");
+		await click(`[data-test-item-button="${testRealmURL}Pet/jackie"]`);
+		assert.dom(`[data-test-item-button="${testRealmURL}Pet/jackie"]`).doesNotHaveAttribute("data-test-item-button-selected", "card is deselected after second click");
+		assert.dom("[data-test-card-chooser-modal]").exists("modal remains open after deselect");
+	});
+	(0, import_qunit.test)("in multi-select mode, double-clicking a card toggles selection without submitting the modal", async function(assert) {
+		ctx.setCardInOperatorModeState(`${testRealmURL}Person/fadhlan`);
+		await renderComponent(class TestDriver extends Component {
+			static {
+				setComponentTemplate(templateFactory({
+					"id": "JG8d9+H0",
+					"block": "[[[8,[32,0],null,[[\"@onClose\"],[[32,1]]],null]],[],[]]",
+					"moduleName": "/home/runner/work/boxel/boxel/packages/host/tests/integration/components/operator-mode-links-test.gts",
+					"scope": () => [OperatorModeContainer, noop],
+					"isStrictMode": true
+				}), this);
+			}
+		});
+		await waitFor(`[data-test-stack-card="${testRealmURL}Person/fadhlan"]`);
+		await click("[data-test-edit-button]");
+		await click("[data-test-links-to-many=\"friends\"] [data-test-add-new]");
+		await waitFor("[data-test-card-chooser-modal]");
+		await waitFor(`[data-test-item-button="${testRealmURL}Pet/jackie"]`);
+		await doubleClick(`[data-test-item-button="${testRealmURL}Pet/jackie"]`);
+		assert.dom("[data-test-card-chooser-modal]").exists("modal remains open after double-click");
+		assert.dom(`[data-test-item-button="${testRealmURL}Pet/jackie"]`).hasAttribute("data-test-item-button-selected", "true", "card is selected after double-click");
+	});
+	(0, import_qunit.test)("in multi-select mode, pressing Enter toggles selection without submitting the modal", async function(assert) {
+		ctx.setCardInOperatorModeState(`${testRealmURL}Person/fadhlan`);
+		await renderComponent(class TestDriver extends Component {
+			static {
+				setComponentTemplate(templateFactory({
+					"id": "JG8d9+H0",
+					"block": "[[[8,[32,0],null,[[\"@onClose\"],[[32,1]]],null]],[],[]]",
+					"moduleName": "/home/runner/work/boxel/boxel/packages/host/tests/integration/components/operator-mode-links-test.gts",
+					"scope": () => [OperatorModeContainer, noop],
+					"isStrictMode": true
+				}), this);
+			}
+		});
+		await waitFor(`[data-test-stack-card="${testRealmURL}Person/fadhlan"]`);
+		await click("[data-test-edit-button]");
+		await click("[data-test-links-to-many=\"friends\"] [data-test-add-new]");
+		await waitFor("[data-test-card-chooser-modal]");
+		await waitFor(`[data-test-item-button="${testRealmURL}Pet/jackie"]`);
+		await triggerKeyEvent(`[data-test-item-button="${testRealmURL}Pet/jackie"]`, "keydown", "Enter");
+		assert.dom("[data-test-card-chooser-modal]").exists("modal remains open after Enter");
+		assert.dom(`[data-test-item-button="${testRealmURL}Pet/jackie"]`).hasAttribute("data-test-item-button-selected", "true", "card is selected after Enter");
+		await triggerKeyEvent(`[data-test-item-button="${testRealmURL}Pet/jackie"]`, "keydown", "Enter");
+		assert.dom(`[data-test-item-button="${testRealmURL}Pet/jackie"]`).doesNotHaveAttribute("data-test-item-button-selected", "card is deselected after second Enter");
+		assert.dom("[data-test-card-chooser-modal]").exists("modal remains open after deselect");
+	});
+	(0, import_qunit.test)("in multi-select mode, Go button is disabled when no cards are selected and shows selection count", async function(assert) {
+		ctx.setCardInOperatorModeState(`${testRealmURL}Person/fadhlan`);
+		await renderComponent(class TestDriver extends Component {
+			static {
+				setComponentTemplate(templateFactory({
+					"id": "JG8d9+H0",
+					"block": "[[[8,[32,0],null,[[\"@onClose\"],[[32,1]]],null]],[],[]]",
+					"moduleName": "/home/runner/work/boxel/boxel/packages/host/tests/integration/components/operator-mode-links-test.gts",
+					"scope": () => [OperatorModeContainer, noop],
+					"isStrictMode": true
+				}), this);
+			}
+		});
+		await waitFor(`[data-test-stack-card="${testRealmURL}Person/fadhlan"]`);
+		await click("[data-test-edit-button]");
+		await click("[data-test-links-to-many=\"friends\"] [data-test-add-new]");
+		await waitFor("[data-test-card-chooser-modal]");
+		await waitFor(`[data-test-item-button="${testRealmURL}Pet/jackie"]`);
+		assert.dom("[data-test-card-chooser-go-button]").isDisabled("Go button is disabled with no selection");
+		assert.dom("[data-test-card-chooser-go-button]").hasText("Choose 0 Cards", "button text shows 0 cards");
+		await click(`[data-test-item-button="${testRealmURL}Pet/jackie"]`);
+		assert.dom("[data-test-card-chooser-go-button]").isNotDisabled("Go button is enabled after selecting 1 card");
+		assert.dom("[data-test-card-chooser-go-button]").hasText("Choose 1 Card", "button text shows singular card");
+		await click(`[data-test-item-button="${testRealmURL}Pet/mango"]`);
+		assert.dom("[data-test-card-chooser-go-button]").hasText("Choose 2 Cards", "button text shows plural cards");
+	});
+	(0, import_qunit.test)("in multi-select mode, selection dropdown shows count and supports Select All and Deselect All", async function(assert) {
+		ctx.setCardInOperatorModeState(`${testRealmURL}Person/fadhlan`);
+		await renderComponent(class TestDriver extends Component {
+			static {
+				setComponentTemplate(templateFactory({
+					"id": "JG8d9+H0",
+					"block": "[[[8,[32,0],null,[[\"@onClose\"],[[32,1]]],null]],[],[]]",
+					"moduleName": "/home/runner/work/boxel/boxel/packages/host/tests/integration/components/operator-mode-links-test.gts",
+					"scope": () => [OperatorModeContainer, noop],
+					"isStrictMode": true
+				}), this);
+			}
+		});
+		await waitFor(`[data-test-stack-card="${testRealmURL}Person/fadhlan"]`);
+		await click("[data-test-edit-button]");
+		await click("[data-test-links-to-many=\"friends\"] [data-test-add-new]");
+		await waitFor("[data-test-card-chooser-modal]");
+		await waitFor(`[data-test-item-button="${testRealmURL}Pet/jackie"]`);
+		assert.dom("[data-test-selection-dropdown-trigger]").doesNotExist("selection dropdown is hidden while nothing is selected");
+		await click(`[data-test-item-button="${testRealmURL}Pet/jackie"]`);
+		await click(`[data-test-item-button="${testRealmURL}Pet/mango"]`);
+		assert.dom("[data-test-selection-dropdown-trigger]").exists("selection dropdown appears once cards are selected");
+		assert.dom("[data-test-selection-dropdown-trigger]").hasText("2", "trigger shows the selected count");
+		await click("[data-test-selection-dropdown-trigger]");
+		await waitFor("[data-test-boxel-menu-item-text=\"Select All\"]");
+		await click("[data-test-boxel-menu-item-text=\"Select All\"]");
+		let totalItems = document.querySelectorAll("[data-test-item-button]").length;
+		assert.true(totalItems > 0, "there are items to select");
+		assert.dom("[data-test-item-button-selected]").exists({ count: totalItems }, "all visible cards are selected after Select All");
+		await click("[data-test-selection-dropdown-trigger]");
+		await waitFor("[data-test-boxel-menu-item-text=\"Deselect All\"]");
+		await click("[data-test-boxel-menu-item-text=\"Deselect All\"]");
+		assert.dom("[data-test-item-button-selected]").doesNotExist("all cards deselected after Deselect All");
+		assert.dom("[data-test-selection-dropdown-trigger]").doesNotExist("selection dropdown is hidden again once nothing is selected");
+	});
+});
+//#endregion