Next js module

__mocks__/molstar-lib.ts

@@ -0,0 +1,80 @@
+// Minimal Jest mock for Mol* UI and QA used by src/utils/molstar.ts during tests
+
+export const PluginConfig = {
+  Viewport: {
+    ShowControls: 'ShowControls',
+    ShowSettings: 'ShowSettings',
+    ShowExpand: 'ShowExpand',
+    ShowSelectionMode: 'ShowSelectionMode',
+    ShowAnimation: 'ShowAnimation',
+    ShowScreenshotControls: 'ShowScreenshotControls',
+    ShowToggleFullscreen: 'ShowToggleFullscreen',
+    ShowReset: 'ShowReset',
+    ShowXR: 'ShowXR'
+  }
+} as const;
+
+export function DefaultPluginUISpec() {
+  return { config: [], layout: { initial: {} }, behaviors: [] } as any;
+}
+
+export async function createPluginUI({ target }: { target: Element }) {
+  if (!target) throw new Error('no target');
+  const calls: any = {};
+  const plugin: any = {
+    clear: async () => {},
+    dispose: () => {},
+  };
+  plugin.builders = {
+    data: { rawData: async () => ({ cell: {} }) },
+    structure: {
+      parseTrajectory: async () => ({ cell: {} }),
+      hierarchy: { applyPreset: async () => {} },
+      representation: { addRepresentation: async () => {} },
+    },
+  };
+  plugin.representation = {
+    structure: {
+      themes: {
+        colorThemeRegistry: { add: () => {} },
+      },
+    },
+  };
+  const makeBuild = () => ({
+    to: () => ({ update: () => ({ commit: async () => {} }) }),
+    delete: () => {},
+    commit: async () => {},
+  });
+  plugin.build = makeBuild;
+  plugin.managers = {
+    structure: {
+      component: { updateRepresentationsTheme: async () => {} },
+      hierarchy: { current: { structures: [] as any[] } },
+    },
+    camera: { reset: () => {} },
+    lociLabels: { addProvider: () => {} },
+  };
+  plugin.canvas3d = {
+    props: { postprocessing: { outline: { name: 'off', params: {} }, occlusion: { name: 'off', params: {} }, shadow: { name: 'off', params: {} } } },
+    setProps: () => {},
+  };
+  plugin.context = {};
+  (globalThis as any).__mockViewer = { plugin };
+  return plugin;
+}
+
+export const PLDDTConfidenceColorThemeProvider = {
+  name: 'plddt-confidence',
+  isApplicable: () => false,
+} as any;
+
+export const QualityAssessment = {
+  isApplicable: () => false,
+} as any;
+
+export const QualityAssessmentProvider = {
+  attach: async () => {},
+  get: () => ({ value: {} }),
+} as any;
+
+

jest.config.ts

@@ -12,7 +12,8 @@ const config: Config = {
   moduleNameMapper: {
     '^@components(.*)$': '<rootDir>/src/components$1',
     '^@utils(.*)$': '<rootDir>/src/utils$1',
-    '^@types$': '<rootDir>/src/types.ts'
+    '^@types$': '<rootDir>/src/types.ts',
+    '^molstar/lib/.*$': '<rootDir>/__mocks__/molstar-lib.ts'
   },
   collectCoverage: true,
   collectCoverageFrom: [

jest.setup.ts

@@ -1,3 +1,11 @@
 import '@testing-library/jest-dom';
 
+// Silence noisy React act() warnings in tests where we drive async state updates intentionally
+const originalError = console.error;
+console.error = (...args: any[]) => {
+  const msg = args[0];
+  if (typeof msg === 'string' && msg.includes('not wrapped in act')) return;
+  originalError(...args);
+};
+
 

package.json

@@ -22,31 +22,22 @@
   "files": [
     "dist"
   ],
-  "peerDependencies": {
-    "molstar": ">=4.8.0",
-    "react": ">=18",
-    "react-dom": ">=18"
-  },
   "devDependencies": {
-    "react": "19.2.0",
-    "react-dom": "19.2.0",
-    "ts-node": "^10.9.2",
-    "@types/react": "^19.2.2",
-    "@types/react-dom": "^19.2.2",
-    "@types/jest": "^29.5.12",
-    "jest": "^29.7.0",
-    "jest-environment-jsdom": "^29.7.0",
+    "@testing-library/jest-dom": "^6.6.3",
     "@testing-library/react": "^16.0.1",
     "@testing-library/user-event": "^14.5.2",
-    "@testing-library/jest-dom": "^6.6.3",
-    "ts-jest": "^29.2.5",
-    "@typescript-eslint/eslint-plugin": "^8.46.2",
-    "@typescript-eslint/parser": "^8.46.2",
+    "@types/jest": "^29.5.12",
+    "@types/react": "^19.2.2",
+    "@types/react-dom": "^19.2.2",
     "@vitejs/plugin-react": "^5.1.0",
     "eslint": "^9.39.0",
-    "molstar": ">=4.8.0",
+    "jest": "^30.2.0",
+    "jest-environment-jsdom": "^30.2.0",
+    "molstar": "^5.2.0",
+    "react": "19.2.0",
+    "react-dom": "19.2.0",
+    "ts-jest": "^29.2.5",
     "typescript": "^5.6.3",
-    "typescript-eslint": "^8.46.2",
     "vite": "^7.1.12",
     "vite-plugin-dts": "^4.5.4"
   },
@@ -77,5 +68,8 @@
   "bugs": {
     "url": "https://github.com/juliocesar-io/nano-protein-viewer-react/issues"
   },
-  "homepage": "https://github.com/juliocesar-io/nano-protein-viewer-react#readme"
+  "homepage": "https://github.com/juliocesar-io/nano-protein-viewer-react#readme",
+  "dependencies": {
+    "ts-node": "^10.9.2"
+  }
 }