innerText of nodes are empty when defining functions in AnkiDroid

[regularuser123]

I think I have encountered a bug related to Javascript in AnkiDroid. I’ll present a minimal working example and as much details as possible.

Table of contents

• Behavior in Anki Desktop
  • Behavior no. 1
  • Behavior no. 2
• Behavior in AnkiDroid
  • Behavior no. 1
  • Behavior no. 2: Reproducing the bug
• Conclusion

Behavior in Anki Desktop

I’ve created a new profile in Anki Desktop and I created the following card.

Behavior no. 1

I modified the “Front Template” for the “Basic” notetype.

{{Front}}

<span>foo</span>

<script>
  var nodes = document.querySelectorAll('span')
  for(const node of nodes) {
    console.log(node)
    console.log(node.innerText)
    console.log(node.innerText === '')
  }
</script>

When I review the card, the innerText of the span node is is correctly printed (see screenshot below). This is expected behavior.

Behavior no. 2

I modified the “Front Template” to the following. Note that I added the function myFunction.

{{Front}}

<span>foo</span>

<script>
  function myFunction(a) {
    return a.replace(/\[[^\]]+/, 'b')
  }

  var nodes = document.querySelectorAll('span')
  for(const node of nodes) {
    console.log(node)
    console.log(node.innerText)
    console.log(node.innerText === '')
  }
</script>

When I review the card, the innerText of the span node is correctly printed. This is expected behavior.

Behavior in AnkiDroid

I’ve created a new profile in AnkiDroid and I created the following card.

Behavior no. 1

In AnkiDroid, I modified the “Front Template” to the same template that was shown in the previous section “Behavior no. 1” (please see screenshot below).

When I review the card, the innerText of the span node is correctly printed. This is expected behavior. The following screenshot shows the information reported by Chrome Development Tools.

Behavior no. 2: Reproducing the bug

I added the same definition of myFunction to “Front Template”. (please see screenshot below).

When I review the card the innerText of the span node is reported to be empty (see screenshot below). To me, this is unexpected behavior.

Conclusion

In section “Behavior no. 2: Reproducing the bug”, we could see that by only adding the definition of a function myFunction, which is never called, causes some nodes are reported to have an empty innerText. To me, this is unexpected behavior.