Table sorting preferences will be saved and reused based on the user’s selections

tests/installBase.test.cjs

@@ -92,7 +92,9 @@ class Element {
   constructor(tag, document) { this.tag = tag; this.document = document; this.children = []; this.dataset = {}; this.attributes = {}; this.listeners = {}; }
   append(...nodes) { nodes.forEach(node => { node.parent = this; }); this.children.push(...nodes); }
   set textContent(value) { this.text = value; this.children = []; }
-  get textContent() { return this.text || ""; }
+  get textContent() { return (this.text || "") + this.children.map(child => child.textContent).join(""); }
+  querySelectorAll(selector) { return walk(this).filter(node => node !== this && node.tag === selector); }
+  querySelector(selector) { return walk(this).find(node => node.attributes["data-sort-key"] === selector.match(/data-sort-key="([^"]+)"/)?.[1]); }
   setAttribute(key, value) { this.attributes[key] = value; }
   addEventListener(key, fn) { this.listeners[key] = fn; }
   focus() { this.document.activeElement = this; }
@@ -100,13 +102,28 @@ class Element {
   get isConnected() { return Boolean(this.parent); }
   click() { return this.listeners.click(); }
 }
-function setup() {
+function setup(localStorage) {
   const document = { createElement: tag => new Element(tag, document), createElementNS: (_, tag) => new Element(tag, document),
     getElementById: id => id === app.contracts.MODAL_ID ? overlay : null };
   const overlay = new Element("main", document);
-  const app = loadApplication("content", { document, Intl, Date });
+  const app = loadApplication("content", { document, Intl, Date, localStorage });
   return { app, overlay, document };
 }
+
+test("installBase sorts typed values and restores the selected header across application instances", () => {
+  const saved = new Map();
+  const storage = { getItem: key => saved.get(key), setItem: (key, value) => saved.set(key, value) };
+  const items = [{ productName: "Ten", quantity: 10 }, { productName: "Two", quantity: 2 }] ;
+  const first = setup(storage);
+  first.app.installBaseView.openInstallBaseModal(customer).render(items);
+  walk(first.overlay).find(node => node.attributes["data-sort-key"] === "quantity").click();
+  const second = setup(storage);
+  second.app.installBaseView.openInstallBaseModal(customer).render(items);
+  const rows = walk(second.overlay).find(node => node.tag === "tbody").children;
+  assert.equal(rows[0].children[7].textContent, "2");
+  assert.equal(walk(second.overlay).find(node => node.attributes["data-sort-key"] === "quantity").parent.attributes["aria-sort"], "ascending");
+  assert.equal(items[0].quantity, 10);
+});
 const customer = { CustomerAccount: { PartyNumber: "customer-123", PartyUniqueName: "Synthetic customer" } };
 const walk = node => [node, ...node.children.flatMap(walk)];