genoverse 4.0.0-beta1 → 4.0.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "genoverse",
-  "version": "4.0.0-beta1",
+  "version": "4.0.2",
   "description": "Genoverse is a portable, customizable, back-end independent JavaScript and HTML5 based genome browser which allows the user to explore data in a dynamic and interactive manner.",
   "main": "src/js/Genoverse.js",
   "directories": {
@@ -34,16 +34,16 @@
     "babel-plugin-transform-amd-to-commonjs": "^1.4.0",
     "canvas": "^2.8.0",
     "clean-webpack-plugin": "^4.0.0",
-    "css-loader": "^6.6.0",
+    "css-loader": "^6.7.0",
     "eslint": "^8.6.0",
     "eslint-config-airbnb-base": "^15.0.0",
     "eslint-plugin-align-assignments": "^1.1.2",
     "eslint-plugin-es": "^4.1.0",
     "eslint-plugin-import": "^2.25.4",
     "jest": "^27.5.1",
-    "mini-css-extract-plugin": "^2.5.3",
+    "mini-css-extract-plugin": "^2.6.0",
     "terser-webpack-plugin": "^5.3.0",
-    "webpack": "^5.66.0",
+    "webpack": "^5.70.0",
     "webpack-cli": "^4.9.1",
     "webpack-dev-server": "^4.7.4"
   },

package/src/js/Track/Model.js

@@ -100,7 +100,6 @@ export default Base.extend({
       return deferred.resolve();
     }
 
-    const model  = this;
     const bins   = [];
     const length = end - start + 1;
 
@@ -123,26 +122,30 @@ export default Base.extend({
       ...bins.map(
         (bin) => {
           const request = jQuery.ajax({
-            url       : model.parseURL(chr, bin[0], bin[1]),
-            data      : model.urlParams,
-            dataType  : model.dataType,
-            context   : model,
-            xhrFields : model.xhrFields,
-            success   : function (data) {
+            url       : this.parseURL(chr, bin[0], bin[1]),
+            data      : this.urlParams,
+            dataType  : this.dataType,
+            xhrFields : this.xhrFields,
+          }).done(
+            (data) => {
               this.receiveData(data, chr, bin[0], bin[1]);
-            },
-            error: function (xhr, statusText, ...args) {
-              this.track.controller.showError(
-                this.showServerErrors && (xhr.responseJSON || {}).message
-                  ? xhr.responseJSON.message
-                  : `${statusText} while getting the data, see console for more details`,
-                [ xhr, statusText, ...args ]
-              );
-            },
-            complete: function (xhr) {
-              this.dataLoading = this.dataLoading.filter(loading => xhr !== loading);
-            },
-          });
+            }
+          ).fail(
+            (xhr, statusText, ...args) => {
+              if (this.track?.controller?.showError) {
+                this.track.controller.showError(
+                  this.showServerErrors && xhr.responseJSON?.message
+                    ? xhr.responseJSON.message
+                    : `${statusText} while getting the data, see console for more details`,
+                  [ xhr, statusText, ...args ]
+                );
+              }
+            }
+          ).always(
+            () => {
+              this.dataLoading = this.dataLoading.filter(loading => request !== loading);
+            }
+          );
 
           request.coords = [ chr, bin[0], bin[1] ]; // store actual chr, start and end on the request, in case they are needed
 
@@ -150,7 +153,7 @@ export default Base.extend({
             request.done(done);
           }
 
-          model.dataLoading.push(request);
+          this.dataLoading.push(request);
 
           return request;
         }

package/src/js/Track.js

@@ -615,7 +615,9 @@ const Track = Base.extend({
   },
 
   reset: function (...args) {
-    this.setLengthMap();
+    if (args[0] !== 'resizing') {
+      this.setLengthMap();
+    }
 
     Object.values(this.models).filter(model => model.url !== false).forEach(model => model.init(true));
     Object.values(this.views).forEach(view => view.init(true));

package/test/change-width.test.js

@@ -0,0 +1,71 @@
+const { afterTest } = require('./utils');
+
+describe('Changing width', () => {
+  afterEach(afterTest);
+
+  const genoverse = new Genoverse({
+    chr            : 1,
+    start          : 1,
+    end            : 20,
+    chromosomeSize : 9e99,
+    width          : 100,
+    tracks         : [ Genoverse.Track.extend({ 10: false, model: Genoverse.Track.Model.extend({ __test: true }) }) ],
+  });
+
+  const track = genoverse.tracks[0];
+
+  it('Initial settings are correct', () => {
+    expect(track.lengthMap.length).toBe(2);
+    expect(track.lengthMap.map(l => l[0])).toEqual([ 10, -1 ]);
+
+    expect(track.model).toEqual(track.models[10]);
+    expect(track.model.__test).toBe(undefined);
+
+    expect(genoverse.width).toBe(100);
+  });
+
+  it('Settings are correct after width change', (done) => {
+    genoverse.setWidth(1000);
+
+    setTimeout( // setWidth causes tracks to be reset after a 1ms delay, which we need to wait for here
+      () => {
+        try {
+          expect(track.lengthMap.length).toBe(2);
+          expect(track.lengthMap.map(l => l[0])).toEqual([ 10, -1 ]);
+
+          expect(track.model).toEqual(track.models[10]);
+          expect(track.model.__test).toBe(undefined);
+
+          expect(genoverse.width).toBe(1000);
+
+          done();
+        } catch (e) {
+          done(e);
+        }
+      },
+      100
+    );
+  });
+
+  it('Model changes correctly after width change + zoom out', (done) => {
+    genoverse.setWidth(1000);
+
+    setTimeout( // setWidth causes tracks to be reset after a 1ms delay, which we need to wait for here
+      () => {
+        genoverse.moveTo(1, 1, 5);
+
+        try {
+          expect(genoverse.width).toBe(1000);
+          expect(genoverse.length).toBe(5);
+          expect(track.model).toEqual(track.models[-1]);
+          expect(track.model.__test).toBe(true);
+
+          done();
+        } catch (e) {
+          done(e);
+        }
+      },
+      100
+    );
+  });
+});