`...<img...` doesn't work but `...<" + "img...` works

Anki Card Design
1

I have found a workaround, but I want to know what in the world is happening here!

Add the following code to the template of a basic card:

<div id="test"></div>

<script>
document.getElementById("test").innerHTML = "<img src='my" + "Image.png'>";
</script>

myImage.png would show as a place holder image. If you replace <img with <" + "img, it works. Why?

2

Anki url-encodes media references that it finds via a regex before displaying cards. Said regex mistakenly matches against my" + "Image.png and replaces it with my%22%20+%20%22Image.png

If the rust regex crate supported look-around assertions, it could have been modified to avoid looking in script tags perhaps

2 Likes
3

Is that url-encoding necessary? Because it seems that not doing it doesn’t cause any issues, even if I add spaces and special characters to the image name.

4

@llama I believe it’s a deliberate choice by the crate due to the potential performance issues. A “proper” implementation would use a parser instead of a regex, as there’ll always be corner cases like this.

1 Like
5

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.