ExternalHyperLink still not working with images

[Niccober]

Some time ago I created an issue about bugged external hyperlinks when trying to use them in combination with images here:

• ExternalHyperLink not working with images #1699

With the latest release 8.0.0, @dolanmiu kindly addressed this issue with the following PR

• #1699 Allow images to work with Hyperlink #1853

which subsequently marked the issue as solved.

After updating to the newest version (now 8.0.1) I eagerly tested whether the behaviour of the application changed but it seems like the bug is still present on my machine when using the same code snippet from the docs as posted in the original issue. I tested it on two different devices:

Desktop

• OS: Windows 11 22H2
• Word: 2303 (Build 16.0.16227.20212) 64-bit

Laptop

• OS: Windows 10 21H2
• Word: 2303 (Build 16.0.16130.20298) 64-bit

Laptop (old one)

• OS: Mac El Capital Version 10.11.6
• Word version: 14.4.3 (140616)

Differing from the experience in the original issue the link now seems not only to be flawed and therefore removed when exporting the document as PDF but missing completely already in the Word file instead. While I was able to at least see and click the link when hovering over the image while pressing STRG before, even this does now not work anymore.

Can anybody confirm this behaviour? If it is actually still an existing bug, I could move the content of this discussion and create a separate issue for it. I am looking forward to further insights.

Thanks in advance!

[dolanmiu]

I tested this on Microsoft Word 365, and Libre Office Writer on Windows 10, and it works fine for me

I CTRL + clicked, which worked for me. I am unsure what the STRG key is

[Niccober]

Yes sorry - German keyboard layout - it is the CTRL key I was talking about.

Could you please post your working code so I can test it exactly under the same circumstances on my machines? Is the code shown in the demo up to date or changed sth in the syntax after the fix?

[dolanmiu]

I simply used the hyperlink demo:

https://github.com/dolanmiu/docx/blob/master/demo/35-hyperlinks.ts

No extra changes or anything

[Niccober]

Hmm, this is really weird. I tested again with the exact code from the hyperlink demo (the only thing I adjusted was the link path to the image, of course) but I still do not get an image with a correct hyperlink reference in the document.

Here are the result files:
Hyperlink-Test.docx
Hyperlink-Test.pdf

This is the result that I am actually looking for (notice the possibility to click on the image in the pdf and get redirected to the link target):
Hyperlink Working (manually adjusted).docx
Hyperlink Working (manually adjusted).pdf

If integrated correctly the contextmenue of the image should offer the option to remove the link:

But currently it still looks like this:

I investigated a little further and additionally found something interesting:
As already noted in the original issue (#1699 (comment)) I was able to reproduce the state where the link was not properly integrated into the word file but at least I could get the image to redirect me to the link when clicking on it while holding CTRL in the word file.

Now when opening this very discussion I had the problem that I even couldn't reproduce that state anymore and I think I found out why - while testing I noticed that the possibility to get redirected when clicking on the image while holding CTRL in the word file seems to interefere with the floating property that can be added to an image. So while this enables me to click with holding CTRL in the word file:

new docx.Paragraph({
  children: [
    new docx.ExternalHyperlink({
      children: [
        new docx.ImageRun({
          data: fs.readFileSync("./media/Haus.jpeg"),
          transformation: {
            width: 100,
            height: 100,
          },
        }),
      ],
      link: "http://www.google.com",
    }),
  ],
})

This doesn't:

new docx.Paragraph({
  children: [
    new docx.ExternalHyperlink({
      children: [
        new docx.ImageRun({
          data: fs.readFileSync("./media/Haus.jpeg"),
          transformation: {
            width: 100,
            height: 100,
          },
          floating: {
            horizontalPosition: {
              align: docx.HorizontalPositionAlign.RIGHT,
              relative: docx.HorizontalPositionRelativeFrom.INSIDE_MARGIN
            },
            verticalPosition: {
              offset: 90000
            }
          }
        }),
      ],
      link: "http://www.google.com",
    }),
  ],
}),

So summarizing I can perceive two different issues which may exist separately while issue number 2 is actually the main problem:

1. Interference between the floating property and the possibility to click on the link while holding CTRL in the word file
2. The link implemented in the word file still seems to be not integrated properly as the contextmenue of the image does not show the link and when transforming the word file into a pdf file the image link is lost completely

Can you confirm this behaviour on your machine? I hope these information will help to get to the bottom of this issue.
Thanks in advance for your efforts!