Confluence import - graphics issue

David Skoglund · Post by **David Skoglund** » Wed Jun 28, 2023 12:06 pm

I imported a large amount of content from a Confluence wiki into Flare. I discovered a something annoying about how the import deals with certain graphics.

If the graphic hasn't been resized in Confluence, the graphic imports cleanly.

Resulting HTML code: <img loading="lazy" src="Images\Image.jpg" />

If the graphic has been resized in Confluence, the graphic imports with a lot of garbage that will cause problems.

Resulting HTML code: <img loading="lazy" src="Images\Image.jpg"" srcset="<wiki server link>/wiki/download/thumbnails/3405283391/Image.jpg"?version=1&modificationDate=1687974537882&cacheVersion=1&api=v2&width=680&height=382 2x, <wiki server link>/wiki/download/thumbnails/3405283391/Image.jpg"?version=1&modificationDate=1687974537882&cacheVersion=1&api=v2&width=340&height=191 1x" />

Note: I replaced the actual server address with <wiki server link> in the code above.

The srcset is especially problematic. It means even though the image is in your Flare project (source and output), the browser will try and load it from the Confluence wiki space. I didn't notice this because I'm always signed into the wiki as part of my job. I know I should have used a incognito browser to test, but I didn't.

If you look at the image properties in Frame everything looks good. You won't see any problems on the broken link report either. My solution to the problem was searching for that attribute in the source and hand editing hundreds of HTML files. Now I know to check for it if I import something from Confluence.

The loading="lazy" comes in with the import no matter what. I'm not a fan of that artifact either.