sqlite-hub 1.1.1 → 1.1.2

package/tests/documents-view.test.js

@@ -0,0 +1,132 @@
+const assert = require("node:assert/strict");
+const path = require("node:path");
+const { pathToFileURL } = require("node:url");
+const test = require("node:test");
+
+let documentsViewModulePromise = null;
+
+function loadDocumentsViewModule() {
+  if (!documentsViewModulePromise) {
+    documentsViewModulePromise = import(
+      pathToFileURL(path.resolve(__dirname, "../frontend/js/views/documents.js")).href
+    );
+  }
+
+  return documentsViewModulePromise;
+}
+
+function buildDocumentsState() {
+  return {
+    connections: {
+      active: { id: "db-one", label: "Database One" },
+    },
+    documents: {
+      items: [],
+      selectedId: null,
+      selected: null,
+      searchQuery: "",
+      draftFilename: "",
+      draftContent: "",
+      dirty: false,
+      documentsVisible: true,
+      editorVisible: true,
+      previewVisible: true,
+      loading: false,
+      detailLoading: false,
+      saving: false,
+      deleting: false,
+      error: null,
+      saveError: null,
+    },
+  };
+}
+
+function buildSelectedDocumentsState(overrides = {}) {
+  const state = buildDocumentsState();
+  state.documents.items = [
+    {
+      contentLength: 11,
+      filename: "notes.md",
+      id: "doc-one",
+      title: "Notes",
+      updatedAt: "2026-06-21T10:00:00.000Z",
+    },
+  ];
+  state.documents.selectedId = "doc-one";
+  state.documents.selected = state.documents.items[0];
+  state.documents.draftFilename = "notes.md";
+  state.documents.draftContent = "# Notes";
+  Object.assign(state.documents, overrides);
+
+  return state;
+}
+
+test("documents view uses a new document dropdown for blank and markdown import", async () => {
+  const { renderDocumentsView } = await loadDocumentsViewModule();
+  const { main } = renderDocumentsView(buildDocumentsState());
+
+  assert.match(main, /data-dropdown-button/);
+  assert.match(main, /New Document/);
+  assert.match(main, /Blank Page/);
+  assert.match(main, /data-action="create-document"/);
+  assert.match(main, /Import \.md/);
+  assert.match(main, /data-action="import-document-markdown"/);
+  assert.match(main, /data-bind="document-import-file"/);
+  assert.doesNotMatch(main, /data-form="new-document"/);
+});
+
+test("documents panes keep both headers visible and move pane toggles into headers", async () => {
+  const { renderDocumentsView } = await loadDocumentsViewModule();
+  const { main } = renderDocumentsView(
+    buildSelectedDocumentsState({
+      editorVisible: false,
+      previewVisible: true,
+    }),
+  );
+
+  assert.match(main, /documents-workspace--editor-collapsed/);
+  assert.match(main, /documents-pane--editor documents-pane--collapsed/);
+  assert.match(main, /data-pane="editor"/);
+  assert.match(main, /Show Editor/);
+  assert.match(main, /data-pane="preview"/);
+  assert.match(main, /Hide Preview/);
+  assert.doesNotMatch(main, />Editor<\/span>/);
+  assert.doesNotMatch(main, />Preview<\/span>/);
+});
+
+test("documents subnavi can be hidden while the show documents button stays available", async () => {
+  const { renderDocumentsView } = await loadDocumentsViewModule();
+  const { main } = renderDocumentsView(
+    buildSelectedDocumentsState({
+      documentsVisible: false,
+    }),
+  );
+
+  assert.doesNotMatch(main, /documents-view__sidebar/);
+  assert.match(main, /data-action="toggle-documents-panel"/);
+  assert.match(main, /Show Documents/);
+  assert.match(main, /aria-pressed="true"/);
+});
+
+test("selected document actions render in one titlebar without a save button", async () => {
+  const { renderDocumentsView } = await loadDocumentsViewModule();
+  const { main } = renderDocumentsView(buildSelectedDocumentsState());
+  const orderedFragments = [
+    'data-action="toggle-documents-panel"',
+    'data-bind="document-field"',
+    "New Document",
+    "Insert",
+    "Export .md",
+    "Delete",
+  ];
+  const indexes = orderedFragments.map(fragment => main.indexOf(fragment));
+
+  indexes.forEach(index => assert.notEqual(index, -1));
+
+  for (let index = 1; index < indexes.length; index += 1) {
+    assert.ok(indexes[index - 1] < indexes[index]);
+  }
+
+  assert.doesNotMatch(main, /documents-toolbar/);
+  assert.doesNotMatch(main, /data-action="save-document"/);
+});

package/tests/dropdown-button.test.js

@@ -0,0 +1,75 @@
+const assert = require("node:assert/strict");
+const path = require("node:path");
+const { pathToFileURL } = require("node:url");
+const test = require("node:test");
+
+let dropdownButtonModulePromise = null;
+
+function loadDropdownButtonModule() {
+  if (!dropdownButtonModulePromise) {
+    dropdownButtonModulePromise = import(
+      pathToFileURL(path.resolve(__dirname, "../frontend/js/components/dropdownButton.js")).href
+    );
+  }
+
+  return dropdownButtonModulePromise;
+}
+
+test("dropdown button renders reusable action items", async () => {
+  const { renderDropdownButton } = await loadDropdownButtonModule();
+  const markup = renderDropdownButton({
+    icon: "add_box",
+    label: "Insert",
+    title: "Insert content",
+    items: [
+      {
+        action: "open-document-insert-table-modal",
+        dataAttributes: { sourceView: "documents" },
+        icon: "table_chart",
+        label: "Insert Table",
+      },
+      {
+        action: "open-document-insert-note-modal",
+        icon: "note_add",
+        label: "Insert Note",
+      },
+    ],
+  });
+
+  assert.match(markup, /data-dropdown-button/);
+  assert.match(markup, /dropdown-button__toggle/);
+  assert.match(markup, /dropdown-button__panel/);
+  assert.match(markup, /data-action="open-document-insert-table-modal"/);
+  assert.match(markup, /data-source-view="documents"/);
+  assert.match(markup, /Insert Note/);
+});
+
+test("dropdown button renders disabled as a real disabled button", async () => {
+  const { renderDropdownButton } = await loadDropdownButtonModule();
+  const markup = renderDropdownButton({
+    disabled: true,
+    label: "Insert",
+    items: [{ action: "noop", label: "Noop" }],
+  });
+
+  assert.doesNotMatch(markup, /<details/);
+  assert.match(markup, /disabled/);
+  assert.match(markup, /aria-disabled="true"/);
+});
+
+test("dropdown button supports local action attributes", async () => {
+  const { renderDropdownButton } = await loadDropdownButtonModule();
+  const markup = renderDropdownButton({
+    label: "Format",
+    items: [
+      {
+        action: "fit",
+        actionAttribute: "data-structure-graph-action",
+        label: "Fit Graph",
+      },
+    ],
+  });
+
+  assert.match(markup, /data-structure-graph-action="fit"/);
+  assert.doesNotMatch(markup, /data-action="fit"/);
+});

package/tests/query-editor.test.js

@@ -0,0 +1,28 @@
+const assert = require("node:assert/strict");
+const path = require("node:path");
+const { pathToFileURL } = require("node:url");
+const test = require("node:test");
+
+let queryEditorModulePromise = null;
+
+function loadQueryEditorModule() {
+  if (!queryEditorModulePromise) {
+    queryEditorModulePromise = import(
+      pathToFileURL(path.resolve(__dirname, "../frontend/js/components/queryEditor.js")).href
+    );
+  }
+
+  return queryEditorModulePromise;
+}
+
+test("query editor groups editor actions in a reusable dropdown", async () => {
+  const { renderQueryEditor } = await loadQueryEditorModule();
+  const markup = renderQueryEditor({ query: "select * from companies;" });
+
+  assert.match(markup, /data-dropdown-button/);
+  assert.match(markup, /Editor actions/);
+  assert.match(markup, /data-action="format-current-query"/);
+  assert.match(markup, /data-action="clear-query"/);
+  assert.match(markup, /data-action="copy-current-query"/);
+  assert.match(markup, /Copy to Clipboard/);
+});

package/tests/query-history-detail.test.js

@@ -0,0 +1,37 @@
+const assert = require("node:assert/strict");
+const path = require("node:path");
+const { pathToFileURL } = require("node:url");
+const test = require("node:test");
+
+let queryHistoryDetailModulePromise = null;
+
+function loadQueryHistoryDetailModule() {
+  if (!queryHistoryDetailModulePromise) {
+    queryHistoryDetailModulePromise = import(
+      pathToFileURL(path.resolve(__dirname, "../frontend/js/components/queryHistoryDetail.js")).href
+    );
+  }
+
+  return queryHistoryDetailModulePromise;
+}
+
+test("query history detail delete button renders a trash icon", async () => {
+  const { renderQueryHistoryDetail } = await loadQueryHistoryDetailModule();
+  const html = renderQueryHistoryDetail({
+    item: {
+      id: 42,
+      displayTitle: "Recent Query",
+      rawSql: "select * from companies;",
+      queryType: "select",
+      isSaved: false,
+      isDestructive: false,
+      executionCount: 1,
+      createdAt: "2026-06-21T10:00:00.000Z",
+      updatedAt: "2026-06-21T10:00:00.000Z",
+    },
+    runs: [],
+  });
+
+  assert.match(html, /data-action="open-delete-query-history-modal"/);
+  assert.match(html, /<span class="material-symbols-outlined text-sm">delete<\/span>Delete/);
+});

package/tests/query-history-header.test.js

@@ -0,0 +1,30 @@
+const assert = require("node:assert/strict");
+const path = require("node:path");
+const { pathToFileURL } = require("node:url");
+const test = require("node:test");
+
+let queryHistoryHeaderModulePromise = null;
+
+function loadQueryHistoryHeaderModule() {
+  if (!queryHistoryHeaderModulePromise) {
+    queryHistoryHeaderModulePromise = import(
+      pathToFileURL(path.resolve(__dirname, "../frontend/js/components/queryHistoryHeader.js")).href
+    );
+  }
+
+  return queryHistoryHeaderModulePromise;
+}
+
+test("query history search renders a magnifier icon", async () => {
+  const { renderQueryHistorySearch } = await loadQueryHistoryHeaderModule();
+  const markup = renderQueryHistorySearch({
+    bind: "charts-history-search",
+    value: "revenue",
+  });
+
+  assert.match(markup, /query-history-search/);
+  assert.match(markup, /query-history-search__icon/);
+  assert.match(markup, />search<\/span>/);
+  assert.match(markup, /data-bind="charts-history-search"/);
+  assert.match(markup, /value="revenue"/);
+});

package/tests/risky-sql.test.js

@@ -0,0 +1,30 @@
+const assert = require("node:assert/strict");
+const path = require("node:path");
+const { pathToFileURL } = require("node:url");
+const test = require("node:test");
+
+async function loadModule() {
+  return import(pathToFileURL(path.resolve(__dirname, "../frontend/js/utils/riskySql.js")).href);
+}
+
+test("risky SQL detector ignores selects and detects schema changes", async () => {
+  const { detectRiskySqlOperations } = await loadModule();
+
+  assert.deepEqual(detectRiskySqlOperations("SELECT * FROM companies"), []);
+  assert.equal(detectRiskySqlOperations("  ALTER TABLE companies ADD COLUMN ticker TEXT")[0].type, "schema_change");
+});
+
+test("risky SQL detector handles comments, case, multiple statements, and drop table names", async () => {
+  const { detectRiskySqlOperations } = await loadModule();
+  const operations = detectRiskySqlOperations(`
+    -- DROP TABLE ignored;
+    select 1;
+    /* comment */ drop table if exists "users";
+    create index idx_users_name on users(name);
+  `);
+
+  assert.equal(operations.length, 2);
+  assert.equal(operations[0].type, "drop_table");
+  assert.equal(operations[0].tableName, "users");
+  assert.equal(operations[1].type, "migration");
+});

package/tests/row-editor-null-values.test.js

@@ -82,6 +82,30 @@ test("row editor renders visible NULL and empty-string states", async () => {
   assert.doesNotMatch(html, /name="field:nullable_text"[\s\S]*?disabled/);
 });
 
+test("row editor delete button renders a trash icon", async () => {
+  const { renderRowEditorPanel } = await loadFrontendModule(
+    "../frontend/js/components/rowEditorPanel.js"
+  );
+  const html = renderRowEditorPanel({
+    title: "Values",
+    closeAction: "close",
+    formName: "save-data-row",
+    deleteAction: "delete-data-row",
+    deleteEnabled: true,
+    deleteRowIndex: 0,
+    editableFields: [
+      {
+        name: "title",
+        label: "title",
+        value: "Acme",
+      },
+    ],
+  });
+
+  assert.match(html, /class="delete-button"[^>]*data-action="delete-data-row"/);
+  assert.match(html, /<span class="material-symbols-outlined text-sm">delete<\/span>\s*Delete Row/);
+});
+
 test("data updates can change NULL to empty string and empty string to NULL", () => {
   const db = new Database(":memory:");
 

package/tests/structure-view.test.js

@@ -0,0 +1,56 @@
+const assert = require("node:assert/strict");
+const path = require("node:path");
+const { pathToFileURL } = require("node:url");
+const test = require("node:test");
+
+let structureViewModulePromise = null;
+
+function loadStructureViewModule() {
+  if (!structureViewModulePromise) {
+    structureViewModulePromise = import(
+      pathToFileURL(path.resolve(__dirname, "../frontend/js/views/structure.js")).href
+    );
+  }
+
+  return structureViewModulePromise;
+}
+
+function buildStructureState() {
+  return {
+    structure: {
+      data: {
+        grouped: {
+          tables: [{ name: "companies", type: "table" }],
+          views: [],
+          indexes: [],
+          triggers: [],
+        },
+        graph: {
+          relationshipCount: 0,
+          tables: [{ name: "companies", type: "table", columns: [], foreignKeys: [] }],
+        },
+      },
+      detail: null,
+      detailLoading: false,
+      error: null,
+      loading: false,
+      selectedName: "companies",
+      tableSearchQuery: "",
+      tablesVisible: true,
+    },
+  };
+}
+
+test("structure toolbar groups graph format actions in a dropdown", async () => {
+  const { renderStructureView } = await loadStructureViewModule();
+  const { main } = renderStructureView(buildStructureState());
+
+  assert.match(main, /data-dropdown-button/);
+  assert.match(main, /Format graph/);
+  assert.match(main, /Fit Graph/);
+  assert.match(main, /data-structure-graph-action="fit"/);
+  assert.match(main, /Recalculate Layout/);
+  assert.match(main, /data-structure-graph-action="relayout"/);
+  assert.match(main, /Clear Selection/);
+  assert.match(main, /data-structure-graph-action="clear"/);
+});