Incorrect image markdown causes loop and crash

[ausbitbank]

I've run into a strange issue that seems to be handled in condensor and steempeak, but not steem-content-renderer .

The bug is triggered when attempting to render a post containing this code
<img src="![Sacrifice The Truth Logo.jpg](https://cdn.steemitimages.com/DQmUjNstssuPJpjPDDWfRnw1x2tY6AWWKcajDMGpPLA5iJf/Sacrifice%20The%20Truth%20Logo.jpg)"/>

This triggers a repeating wave of errors in browser console that eventually terminates itself complaining You may have an infinite update loop in a component render function

These are the render options used when this happens

     renderer: new DefaultRenderer({
        baseUrl: 'https://sonicgroove.net/',
        breaks: false,
        skipSanitization: false,
        allowInsecureScriptTags: false,
        addNofollowToLinks: true,
        doNotShowImages: false,
        ipfsPrefix: '',
        assetsWidth: 640,
        assetsHeight: 480,
        imageProxyFn: (url) => url,
        usertagUrlFn: (account) => '/@' + account,
        hashtagUrlFn: (hashtag) => '/trending/' + hashtag,
        isLinkSafeFn: (url) => true
      })

The loop and error isn't triggered if doNotShowImages is set to true, but this obviously isn't an ideal solution.

[Jblew]

Unfortunately I cannot reproduce this error neither in browser nor in mocha tests. I have also tried to do it manually, using your settings. I have the following questions:

1. Which version of the library do you use?
2. Can you share the component code with me? (Maybe it has something to do with the try-catch code in the Vue components. Setting reactive props in catch sometimes cause endless render loops.

[ausbitbank]

If it helps, the original post (before being edited) is here https://steemd.com/tx/b426edca06f28e11ce376adc39b87f788fc5efa5 . Maybe it requires the multiple malformed images in a row to trigger the issue ?

1: From package.json the version is "steem-content-renderer": "^2.1.1"
2: I'm using it inside a quasar project with the render options above, a container that appears when post content is loaded and it's called with
div v-html="renderer.render(currentPost.body)"></div> . It's pretty basic and similar to the example given. I don't have access to source code right now but I can share more info privately if you're unable to reproduce with the above info

Thanks for the help, sorry for the delay answering

[ausbitbank]

The same guy that made a post with borked images last time, did it again this week slightly differently and it breaks my site again. Post is https://steemit.com/sgl/@lk666/sonic-groove-live-week-3-original-song-inside-my-soul

I'm guessing this is the code doing it :

<center><a href="https://morktra.bandcamp.com/track/inside-my-soul"><img src="![bandcamp.png](https://cdn.steemitimages.com/DQmYSHTrr1Y3DksHN2oZ1AqeDcDpdKrdVSNZMRxbd4rsx5x/bandcamp.png)"/></a>Click to download</center>

This error gets dumped to the console in an infinite loop until the tab crashes :

77e9898f.031d3787.js:55 universe-log-no-metadata.[steem-content-renderer]. | 2019-09-20T00:24:43.623Z [warn]: Blocked, image tag src does not appear to be a url; img

Update: The post was updated and now works without any issues or errors in console. Here is the diff, to stop the crashes and issues he simply removed the whole block of images - http://scribe.steemian.info/?url=https%3A%2F%2Fsteemit.com%2F%40lk666%2Fsonic-groove-live-week-3-original-song-inside-my-soul