@sjcrh/proteinpaint-client 2.191.4 → 2.193.0

package/dist/matrix.sorterUi.unit.spec-Y2HXWHJN.js

@@ -0,0 +1,342 @@
+import {
+  getPlotConfig,
+  setComputedConfig
+} from "./chunk-5TJQ6633.js";
+import {
+  getSorterUi
+} from "./chunk-5CR24RTX.js";
+import "./chunk-CDUNE45Q.js";
+import {
+  require_tape
+} from "./chunk-QWOE5YTB.js";
+import "./chunk-L7VDSIM7.js";
+import "./chunk-HJ6L54YS.js";
+import "./chunk-LSEFWW72.js";
+import "./chunk-UXDVUCXU.js";
+import "./chunk-HYOEWQ5P.js";
+import "./chunk-HBW42TDT.js";
+import "./chunk-LQJMCE7G.js";
+import "./chunk-FN5XPUPH.js";
+import "./chunk-IIT367QZ.js";
+import "./chunk-RZGEKL77.js";
+import "./chunk-KM4JBR26.js";
+import "./chunk-COYULNJF.js";
+import "./chunk-6G4YOMWW.js";
+import "./chunk-7IYJZZQI.js";
+import {
+  copyMerge
+} from "./chunk-M3J4MINX.js";
+import "./chunk-PF4DSFDR.js";
+import "./chunk-I73KUUYG.js";
+import "./chunk-IVXCWCKS.js";
+import "./chunk-7KRS7L4U.js";
+import "./chunk-BKPDYW5T.js";
+import "./chunk-JNITUVXP.js";
+import "./chunk-TJYRBEBK.js";
+import "./chunk-LOZEKOES.js";
+import "./chunk-VQZ2Z5YU.js";
+import "./chunk-SOTB4FRE.js";
+import "./chunk-TLT4YIG3.js";
+import "./chunk-KYBIQBXE.js";
+import {
+  select_default
+} from "./chunk-I6Y4O3RR.js";
+import "./chunk-OMR2DT66.js";
+import "./chunk-DQC5FFGV.js";
+import {
+  __toESM
+} from "./chunk-HFNDKYVF.js";
+
+// plots/matrix/test/matrix.sorterUi.unit.spec.js
+var import_tape = __toESM(require_tape(), 1);
+var i = 0;
+async function getControls(_opts = {}) {
+  const holder = select_default("body").append("div").attr("class", "sja_root_holder").append("table").append("tr");
+  const parent = {
+    id: `_${i++}_${Math.random()}`,
+    app: {
+      dispatch: _opts.dispatch || ((action) => {
+        copyMerge(config, action.config);
+        setComputedConfig(config);
+        uiApi.main();
+      }),
+      vocabApi: {
+        termdbConfig: {}
+      }
+    },
+    dom: {
+      holder
+    }
+  };
+  const config = await getPlotConfig(_opts, parent.app);
+  setComputedConfig(config);
+  parent.config = config;
+  const controls = { parent };
+  const opts = { controls, holder, debug: true, setComputedConfig };
+  const uiApi = getSorterUi(opts);
+  return { uiApi, controls, config, parent: controls.parent, opts };
+}
+(0, import_tape.default)("\n", function(test) {
+  test.comment("-***- plots/matrix.sorterUi -***-");
+  test.end();
+});
+(0, import_tape.default)("default setup", async (test) => {
+  const { uiApi, controls, config, parent, opts } = await getControls();
+  const s = parent.config.settings.matrix;
+  const activeOption = s.sortOptions[s.sortSamplesBy];
+  test.equal(
+    opts.holder.node().querySelectorAll("thead").length,
+    // 2 theads, 1 for hardcoded manual selected rows + 1 for sort by case names
+    // 1 thead for main table heading
+    activeOption.sortPriority.length + 2 + 1,
+    "should have the expected number of thead"
+  );
+  if (test._ok) uiApi.destroy();
+  test.end();
+});
+(0, import_tape.default)("section visibility toggling", async (test) => {
+  const { uiApi, controls, config, parent, opts } = await getControls();
+  const s = config.settings.matrix;
+  const ui = uiApi.Inner;
+  const activeOptionBeforeDrag = structuredClone(ui.activeOption);
+  const thead = opts.holder.selectAll("thead").filter((d) => d?.types?.includes("geneVariant")).node();
+  test.equal(
+    thead.nextSibling.style.display,
+    "none",
+    "should have a hiddden table section for gene mutation before toggling"
+  );
+  thead.firstChild.firstChild.click();
+  test.equal(
+    opts.holder.selectAll("thead").filter((d) => d?.types?.includes("geneVariant")).node().nextSibling.style.display,
+    "",
+    "should have a visible table section for gene mutation after toggling"
+  );
+  if (test._ok) uiApi.destroy();
+  test.end();
+});
+(0, import_tape.default)("simulated section drag/drop", async (test) => {
+  const { uiApi, controls, config, parent, opts } = await getControls();
+  const s = config.settings.matrix;
+  const prevSettings = structuredClone(s);
+  const ui = uiApi.Inner;
+  const activeOptionBeforeDrag = structuredClone(ui.activeOption);
+  const th = opts.holder.selectAll("th").filter((d) => d?.types?.includes("geneVariant")).node();
+  const sectionData = th.__data__;
+  ui.trackDraggedSection.call(th, {}, sectionData);
+  test.equal(
+    select_default(th.parentNode.parentNode).on("drop"),
+    ui.adjustSortPriority,
+    "should attach the correct drop handler for section thead"
+  );
+  const i2 = ui.activeOption.sortPriority.indexOf(sectionData);
+  ui.adjustSortPriority({}, ui.activeOption.sortPriority[i2 + 1]);
+  test.deepEqual(
+    activeOptionBeforeDrag.sortPriority,
+    prevSettings.sortOptions[s.sortSamplesBy].sortPriority,
+    "should not adjust the sortPriority/table before clicking apply, after drag/drop"
+  );
+  ui.apply();
+  test.deepEqual(
+    activeOptionBeforeDrag.sortPriority.reverse(),
+    config.settings.matrix.sortOptions[s.sortSamplesBy].sortPriority,
+    "should adjust the sortPriority/table after clicking apply"
+  );
+  if (test._ok) uiApi.destroy();
+  test.end();
+});
+(0, import_tape.default)("simulated tiebreaker drag/drop", async (test) => {
+  const { uiApi, controls, config, parent, opts } = await getControls();
+  const s = config.settings.matrix;
+  const prevSettings = structuredClone(s);
+  const ui = uiApi.Inner;
+  const activeOptionBeforeDrag = structuredClone(ui.activeOption);
+  const thead0 = opts.holder.selectAll("thead").filter((d) => d?.types?.includes("geneVariant")).node();
+  thead0.firstChild.firstChild.click();
+  const thead1 = opts.holder.selectAll("thead").filter((d) => d?.types?.includes("geneVariant")).node();
+  const trs = thead1.nextSibling.querySelectorAll("tr");
+  test.equal(
+    select_default(trs[0]).on("drop"),
+    ui.adjustTieBreakers,
+    "should attach the correct drop handler for tiebreaker label"
+  );
+  const tbData = trs[0].__data__;
+  ui.trackDraggedTieBreaker.call(trs[0], { target: trs[0].firstChild.nextSibling }, tbData);
+  const activeTieBreakers = ui.activeOption.sortPriority[0].tiebreakers;
+  const i2 = activeTieBreakers.indexOf(tbData);
+  ui.adjustTieBreakers({ preventDefault: () => void 0 }, activeTieBreakers[i2 + 1]);
+  const thead2 = opts.holder.selectAll("thead").filter((d) => d?.types?.includes("geneVariant")).node();
+  const trs2 = [...thead2.nextSibling.querySelectorAll("tr")];
+  test.deepEqual(
+    trs2.slice(0, 2).map((elem) => elem.__data__),
+    activeOptionBeforeDrag.sortPriority[0].tiebreakers.slice(1, 3).reverse(),
+    "should visibly switch the first two tiebreaker rows"
+  );
+  test.deepEqual(
+    activeOptionBeforeDrag.sortPriority[0].tiebreakers,
+    prevSettings.sortOptions[s.sortSamplesBy].sortPriority[0].tiebreakers,
+    "should not adjust the tiebreakers before clicking apply, after drag/drop"
+  );
+  ui.apply();
+  test.deepEqual(
+    activeTieBreakers,
+    config.settings.matrix.sortOptions[s.sortSamplesBy].sortPriority[0].tiebreakers,
+    "should adjust the tiebreakers after clicking apply"
+  );
+  if (test._ok) uiApi.destroy();
+  test.end();
+});
+(0, import_tape.default)("tiebreaker disabled", async (test) => {
+  const { uiApi, controls, config, parent, opts } = await getControls();
+  const s = config.settings.matrix;
+  const ui = uiApi.Inner;
+  const activeOptionBeforeDrag = structuredClone(ui.activeOption);
+  const thead0 = opts.holder.selectAll("thead").filter((d) => d?.types?.includes("geneVariant")).node();
+  thead0.firstChild.firstChild.click();
+  const thead1 = opts.holder.selectAll("thead").filter((d) => d?.types?.includes("geneVariant")).node();
+  const trs = thead1.nextSibling.querySelectorAll("tr");
+  test.equal(
+    select_default(trs[0].lastChild).select("button").node(),
+    null,
+    `should not have an enable/disable toggle button for the protein-changing tiebreaker that is not configured with 'mayToggle: true'`
+  );
+  test.equal(
+    select_default(trs[1].lastChild).select("button").html(),
+    "Enable",
+    "should indicate that the CNV tiebreaker is not active"
+  );
+  select_default(trs[1].lastChild).select("button").node().click();
+  const activeTieBreakers = ui.activeOption.sortPriority[0].tiebreakers;
+  ui.apply();
+  test.deepEqual(
+    activeTieBreakers[1].disabled,
+    config.settings.matrix.sortOptions[s.sortSamplesBy].sortPriority[0].tiebreakers[1]?.disabled,
+    "should adjust the CNV tiebreaker disabled after clicking apply"
+  );
+  if (test._ok) uiApi.destroy();
+  test.end();
+});
+(0, import_tape.default)("simulated value drag/drop", async (test) => {
+  const { uiApi, controls, config, parent, opts } = await getControls();
+  const ui = uiApi.Inner;
+  const a = structuredClone(config.settings.matrix.sortOptions.a);
+  ui.expandedSection = a.sortPriority[0].label;
+  a.sortPriority[0].tiebreakers[1].isOrdered = true;
+  uiApi.main({
+    sortOptions: { a }
+  });
+  const activeOptionBeforeDrag = structuredClone(ui.activeOption);
+  const thead1 = opts.holder.selectAll("thead").filter((d) => d?.types?.includes("geneVariant")).node();
+  const valuesDiv = thead1.nextSibling.querySelectorAll("tr")[0].querySelector(".sjpp-matrix-sorter-ui-value");
+  const lastVal = select_default(valuesDiv.lastChild);
+  test.equal(lastVal.on("drop"), ui.adjustValueOrder, "should attach the correct drop handler for value label");
+  const activeOrder = ui.activeOption.sortPriority[0].tiebreakers[1].order;
+  const activeOrderBeforeDrag = structuredClone(activeOrder);
+  const value = lastVal.datum();
+  ui.trackDraggedValue.call(lastVal.node(), { target: lastVal.node() }, value);
+  ui.adjustValueOrder({ preventDefault: () => void 0 }, valuesDiv.firstChild.__data__);
+  const thead2 = opts.holder.selectAll("thead").filter((d) => d?.types?.includes("geneVariant")).node();
+  const valuesDiv2 = thead2.nextSibling.querySelectorAll("tr")[0].querySelector(".sjpp-matrix-sorter-ui-value");
+  const lastVal2 = select_default(valuesDiv2.lastChild);
+  const n = activeOrderBeforeDrag.length;
+  test.deepEqual(
+    [valuesDiv2.firstChild.__data__?.key, valuesDiv2.lastChild.__data__?.key],
+    [activeOrderBeforeDrag[n - 1], activeOrderBeforeDrag[n - 2]],
+    "should visibly switch the last value to first"
+  );
+  const s = config.settings.matrix;
+  test.deepEqual(
+    activeOrderBeforeDrag,
+    s.sortOptions[s.sortSamplesBy].sortPriority[0].tiebreakers[1].order,
+    "should not adjust the tiebreaker.order before clicking apply, after drag/drop"
+  );
+  ui.apply();
+  test.deepEqual(
+    activeOrder,
+    s.sortOptions[s.sortSamplesBy].sortPriority[0].tiebreakers[1].order,
+    "should adjust the tiebreaker.order after clicking apply"
+  );
+  if (test._ok) uiApi.destroy();
+  test.end();
+});
+(0, import_tape.default)("hidden values", async (test) => {
+  const filterByClass = {
+    // CNV_amp: 'value',
+    // CNV_loss: 'value',
+    // Utr3: 'value',
+    // Utr5: 'value',
+    // S: 'value',
+    // Intron: 'value',
+    noncoding: "value"
+  };
+  const legendValueFilter = Object.freeze({
+    isAtomic: true,
+    type: "tvslst",
+    in: true,
+    join: "and",
+    lst: [
+      {
+        legendGrpName: "test",
+        type: "tvs",
+        tvs: {
+          isnot: true,
+          legendFilterType: "geneVariant_soft",
+          // indicates this matrix legend filter is soft filter
+          term: { type: "geneVariant" },
+          values: [{ dt: 1, mclasslst: Object.keys(filterByClass) }]
+        }
+      }
+    ]
+  });
+  const { uiApi, controls, config, parent, opts } = await getControls({
+    legendValueFilter: structuredClone(legendValueFilter)
+  });
+  const s = config.settings.matrix;
+  const ui = uiApi.Inner;
+  const tipNode = ui.dom.tip.d.node();
+  const a = config.settings.matrix.sortOptions.a;
+  ui.expandedSection = a.sortPriority[0].label;
+  a.sortPriority[0].tiebreakers[1].isOrdered = true;
+  a.sortPriority[0].tiebreakers[1].notUsed = ["S"];
+  uiApi.main({
+    sortOptions: { a }
+  });
+  const origConfig = structuredClone(config);
+  const thead1 = opts.holder.selectAll("thead").filter((d) => d?.types?.includes("geneVariant")).node();
+  const tr1 = thead1.nextSibling.querySelectorAll("tr")[0];
+  const valuesDiv = tr1.querySelector(".sjpp-matrix-sorter-ui-value");
+  const m = valuesDiv.querySelectorAll(":scope>div").length;
+  const hiddenBtn = tr1.querySelector("[data-testid=sjpp-matrix-sorter-ui-hidden-add]");
+  hiddenBtn.click();
+  const unusedVals = tipNode.querySelector("[data-testid=sjpp-matrix-sorter-ui-hidden-vals]");
+  const n = 1;
+  test.equal(
+    unusedVals.querySelectorAll(":scope>div").length,
+    1,
+    `should have the expected number of addable hidden values on load`
+  );
+  valuesDiv.firstChild.click();
+  const tr1_a = opts.holder.selectAll("thead").filter((d) => d?.types?.includes("geneVariant")).node().nextSibling.querySelectorAll("tr")[0];
+  const valuesDiv_a = tr1_a.querySelector(".sjpp-matrix-sorter-ui-value");
+  const hiddenBtn_a = tr1_a.querySelector("[data-testid=sjpp-matrix-sorter-ui-hidden-add]");
+  hiddenBtn_a.click();
+  const unusedVals_a = tipNode.querySelector("[data-testid=sjpp-matrix-sorter-ui-hidden-vals]");
+  test.deepEqual(
+    [valuesDiv_a.querySelectorAll(":scope>div").length, unusedVals_a.querySelectorAll(":scope>div").length],
+    [m - 1, n + 1],
+    `should increase the expected number of used and unused values by 1, after clicking on a visible sorter value`
+  );
+  test.deepEqual(origConfig, config, "should not adjust the tiebreaker.order + notUsed arrays before clicking apply");
+  ui.apply();
+  const s0 = origConfig.settings.matrix;
+  const tb = s0.sortOptions.a.sortPriority[0].tiebreakers[1];
+  if (!tb.notUsed) tb.notUsed = [];
+  tb.notUsed.unshift(tb.order.shift());
+  test.deepEqual(
+    config.settings.matrix.sortOptions.a,
+    origConfig.settings.matrix.sortOptions.a,
+    "should adjust the tiebreaker.order + notUsed after clicking apply"
+  );
+  if (test._ok) uiApi.destroy();
+  test.end();
+});
+//# sourceMappingURL=matrix.sorterUi.unit.spec-Y2HXWHJN.js.map