fix(#222): Right-hand editor gutter marker was not aligned correctly

fix(#222): Fixed poor rendering performance in large files

CHANGELOG.md

@@ -1,24 +1,3 @@
-## [5.4.7](https://github.com/wickedest/Mergely/compare/v5.4.6...v5.4.7) (2026-02-28)
-
-
-### Bug Fixes
-
-* **#228:** Fixes issue where a single scroll event would cause multiple updates and calculate view placement incorrectly ([9834f09](https://github.com/wickedest/Mergely/commit/9834f0964abeac88a4af83cde40b1deb29b8fe5d))
-
-## [5.4.6](https://github.com/wickedest/Mergely/compare/v5.4.5...v5.4.6) (2026-02-24)
-
-
-### Bug Fixes
-
-* **#228:** Clicking on edit marker in gutter now accounts for top position of editor. ([cc7df68](https://github.com/wickedest/Mergely/commit/cc7df68aea62e2e3a18c996fa56048f1e583faa5)), closes [#228](https://github.com/wickedest/Mergely/issues/228)
-
-## [5.4.5](https://github.com/wickedest/Mergely/compare/v5.4.4...v5.4.5) (2026-02-23)
-
-
-### Bug Fixes
-
-* **#222:** Fixed issue with poor rendering performance and marker misalignment ([27778f0](https://github.com/wickedest/Mergely/commit/27778f0840895bf5e029d8c962e99890b8a0a8f6)), closes [#222](https://github.com/wickedest/Mergely/issues/222) [#227](https://github.com/wickedest/Mergely/issues/227)
-
 ## [5.4.4](https://github.com/wickedest/Mergely/compare/v5.4.3...v5.4.4) (2026-02-23)
 
 

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "mergely",
-  "version": "5.4.7",
+  "version": "5.4.4",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "mergely",
-      "version": "5.4.7",
+      "version": "5.4.4",
       "license": "(GPL-3.0 OR LGPL-3.0 OR MPL-1.1 OR SEE LICENSE IN LICENSE)",
       "devDependencies": {
         "@babel/core": "^7.1.6",

package.json

@@ -1,6 +1,6 @@
 {
   "name": "mergely",
-  "version": "5.4.7",
+  "version": "5.4.4",
   "description": "A javascript UI for diff/merge",
   "license": "(GPL-3.0 OR LGPL-3.0 OR MPL-1.1 OR SEE LICENSE IN LICENSE)",
   "author": {

src/diff-view.js

@@ -130,6 +130,7 @@ CodeMirrorDiffView.prototype.scrollToDiff = function(direction) {
 	this.trace('change', 'current-diff', this._current_diff);
 	// _current_diff changed, refresh the view
 	this._scroll_to_change(this.changes[this._current_diff]);
+	this.setChanges(this.changes);
 };
 
 CodeMirrorDiffView.prototype.mergeCurrentChange = function(side) {
@@ -148,6 +149,7 @@ CodeMirrorDiffView.prototype.scrollTo = function(side, num) {
 	const ed = this.editor[side];
 	ed.setCursor(num);
 	ed.centerOnCursor();
+	this._renderChanges();
 	this.el.dispatchEvent(new Event('updated'));
 };
 
@@ -554,12 +556,20 @@ CodeMirrorDiffView.prototype._scroll_to_change = function(change) {
 	if (!change) {
 		return;
 	}
+	const {
+		lhs: led,
+		rhs: red
+	} = this.editor;
+	// set cursors
+	const llf = Math.max(change['lhs-line-from'], 0);
+	const rlf = Math.max(change['rhs-line-from'], 0);
+	led.setCursor(llf, 0);
+	red.setCursor(rlf, 0);
 	if (change['lhs-line-to'] >= 0) {
 		this.scrollTo('lhs', change['lhs-line-to']);
 	} else if (change['rhs-line-to'] >= 0) {
 		this.scrollTo('rhs', change['rhs-line-to']);
 	}
-	const { lhs: led } = this.editor;
 	led.focus();
 };
 
@@ -1175,16 +1185,12 @@ CodeMirrorDiffView.prototype._renderDiff = function(changes) {
 	ctx_rhs.fillRect(1.5, rfrom, 4.5, rto);
 
 	this._handleLhsMarginClick = function (ev) {
-		// `top` accounts for the editor starting at position other than 0 on page
-		const { top } = ev.currentTarget.offsetParent.getBoundingClientRect();
-		const y = (ev.pageY - top) - ex.lhs_xyoffset.top - (lto / 2);
+		const y = ev.pageY - ex.lhs_xyoffset.top - (lto / 2);
 		const sto = Math.max(0, (y / mcanvas_lhs.height) * ex.lhs_scroller.scrollHeight);
 		ex.lhs_scroller.scrollTo({ top: sto });
 	};
 	this._handleRhsMarginClick = function (ev) {
-		// `top` accounts for the editor starting at position other than 0 on page
-		const { top } = ev.currentTarget.offsetParent.getBoundingClientRect();
-		const y = (ev.pageY - top) - ex.rhs_xyoffset.top - (rto / 2);
+		const y = ev.pageY - ex.rhs_xyoffset.top - (rto / 2);
 		const sto = Math.max(0, (y / mcanvas_rhs.height) * ex.rhs_scroller.scrollHeight);
 		ex.rhs_scroller.scrollTo({ top: sto });
 	};