cool#7316 - Use fillRect to get hairlines back in the calc grid in fi…

…refox.

Somewhat disappointing cf. https://bugzilla.mozilla.org/show_bug.cgi?id=1857185

Interestingly dashed-hair-lines still seem to work nicely on large canvases.

cf. #7316

Signed-off-by: Michael Meeks <michael.meeks@collabora.com>
Change-Id: I1371671e4ef8e8ca1e5f2790c3f0f2431bf9e2ba

browser/src/canvas/sections/CalcGridSection.ts

@@ -95,7 +95,21 @@ class CalcGridSection extends app.definitions.canvasSectionObject {
 			// as horizontal line rendering: due to cache effects - so to
 			// help our poor CPU renderers - render in horizontal strips.
 			var bandSize = 256;
-			var clearDash = false;
+			var printRangeLine = false;
+
+			var drawPrintLine = function(ctx: CanvasRenderingContext2D,
+						    x1: number, y1: number, x2: number, y2: number) {
+				ctx.moveTo(x1 + 0.5, y1 + 0.5);
+				ctx.lineTo(x2 - 0.5, y2 - 0.5);
+				ctx.stroke();
+			};
+			var drawHairLine = function(ctx: CanvasRenderingContext2D,
+						    x1: number, y1: number, x2: number, y2: number) {
+				// https://bugzilla.mozilla.org/show_bug.cgi?id=1857185
+				ctx.fillRect(x1, y1, x2 - x1, y2 - y1);
+			};
+
+			this.context.fillStyle = this.sectionProperties.strokeStyle;
 			for (var miny = area.min.y; miny < area.max.y; miny += bandSize)
 			{
 				var maxy = Math.min(area.max.y, miny + bandSize);
@@ -106,20 +120,22 @@ class CalcGridSection extends app.definitions.canvasSectionObject {
 				this.sectionProperties.docLayer.sheetGeometry._columns.forEachInCorePixelRange(
 					area.min.x, area.max.x,
 					function(pos: any, colIndex: any) {
-						var xcoord = xTransform(Math.floor(scale * (pos - paneOffset.x)) - 0.5);
+						var xcoord = xTransform(Math.floor(scale * (pos - paneOffset.x)));
 
-						clearDash = false;
+						printRangeLine = false;
+						var drawLine = drawHairLine;
 						if (printRange.length === 4
 							&& (printRange[0] === colIndex || printRange[2] + 1 === colIndex)) {
-							clearDash = true;
+							printRangeLine = true;
 							startEndDash(this.context, false /* end? */);
+							drawLine = drawPrintLine;
 						}
 
-						this.context.moveTo(xcoord, Math.floor(scale * (miny - paneOffset.y)) + 0.5);
-						this.context.lineTo(xcoord, Math.floor(scale * (maxy - paneOffset.y)) - 0.5);
-						this.context.stroke();
+						drawLine(this.context,
+							 xcoord - 1, Math.floor(scale * (miny - paneOffset.y)) - 1,
+							 xcoord, Math.floor(scale * (maxy - paneOffset.y)));
 
-						if (clearDash)
+						if (printRangeLine)
 							startEndDash(this.context, true /* end? */);
 					}.bind(this));
 
@@ -128,22 +144,22 @@ class CalcGridSection extends app.definitions.canvasSectionObject {
 					miny, maxy,
 					function(pos: any, rowIndex: any) {
 
-						clearDash = false;
+						printRangeLine = false;
+						var drawLine = drawHairLine;
 						if (printRange.length === 4
 							&& (printRange[1] === rowIndex || printRange[3] + 1 === rowIndex)) {
-							clearDash = true;
+							printRangeLine = true;
 							startEndDash(this.context, false /* end? */);
+							drawLine = drawPrintLine;
 						}
 
-						this.context.moveTo(
-							xTransform(Math.floor(scale * (area.min.x - paneOffset.x)) + 0.5),
-							Math.floor(scale * (pos - paneOffset.y)) - 0.5);
-						this.context.lineTo(
-							xTransform(Math.floor(scale * (area.max.x - paneOffset.x)) - 0.5),
-							Math.floor(scale * (pos - paneOffset.y)) - 0.5);
-						this.context.stroke();
+						drawLine(this.context,
+							 xTransform(Math.floor(scale * (area.min.x - paneOffset.x))) - 1,
+							 Math.floor(scale * (pos - paneOffset.y)) - 1,
+							 xTransform(Math.floor(scale * (area.max.x - paneOffset.x))),
+							 Math.floor(scale * (pos - paneOffset.y)));
 
-						if (clearDash)
+						if (printRangeLine)
 							startEndDash(this.context, true /* end? */);
 					}.bind(this));