UPDATE: textWithLink method to cover multi-line annotated text (#3281)

Co-authored-by: Lukas Holländer <[email protected]>

Author: Goku-kun

src/modules/annotations.js

@@ -357,21 +357,35 @@ import { jsPDF } from "../jspdf.js";
    * @returns {number} width the width of the text/link
    */
   jsPDFAPI.textWithLink = function(text, x, y, options) {
-    var width = this.getTextWidth(text);
-    var height = this.internal.getLineHeight() / this.internal.scaleFactor;
+    var totalLineWidth = this.getTextWidth(text);
+    var lineHeight = this.internal.getLineHeight() / this.internal.scaleFactor;
+    var linkHeight, linkWidth;
+
+    // Checking if maxWidth option is passed to determine lineWidth and number of lines for each line
+    if (options.maxWidth !== undefined) {
+      var { maxWidth } = options;
+      linkWidth = maxWidth;
+      var numOfLines = this.splitTextToSize(text, linkWidth).length;
+      linkHeight = Math.ceil(lineHeight * numOfLines);
+    } else {
+      linkWidth = totalLineWidth;
+      linkHeight = lineHeight;
+    }
+
     this.text(text, x, y, options);
+
     //TODO We really need the text baseline height to do this correctly.
     // Or ability to draw text on top, bottom, center, or baseline.
-    y += height * 0.2;
+    y += lineHeight * 0.2;
     //handle x position based on the align option
     if (options.align === "center") {
-      x = x - width / 2; //since starting from center move the x position by half of text width
+      x = x - totalLineWidth / 2; //since starting from center move the x position by half of text width
     }
     if (options.align === "right") {
-      x = x - width;
+      x = x - totalLineWidth;
     }
-    this.link(x, y - height, width, height, options);
-    return width;
+    this.link(x, y - lineHeight, linkWidth, linkHeight, options);
+    return totalLineWidth;
   };
 
   //TODO move into external library

test/reference/multiLineLinkWithText.pdf

@@ -72,6 +72,18 @@ describe("Module: Annotations", () => {
 
     comparePdf(doc.output(), "insertLinkAddPage.pdf", "annotations");
   });
+  it("should add a multline link to the page", () => {
+    var doc = new jsPDF({
+      floatPrecision: 2
+    });
+
+    doc.textWithLink("This is a very long link text!", 10, 10, {
+      url: "https://parall.ax/",
+      maxWidth: 20
+    });
+
+    comparePdf(doc.output(), "multiLineLinkWithText.pdf", "annotations");
+  });
   it("should align text link based on the align option", () => {
     var doc = new jsPDF({
       unit: "px",