Using Recogito with multiple elements on page

[Apeli]

We use Recogito with multiple elements (1 to 6 divs) on a single page. Suddenly we've encountered a strange issue: when we render the annotations to one element, they get removed from the other elements.

We use v. 1.5.3 but even downgrading to 1.4.5 didn't help. Do you have an idea of what could cause this? Is there any document-wide "clear annotation spans" -type function that could cause the behaviour?

EDIT: I found the reason from Highlighter.js @ clear(). Would a small fix like this be ok for a PR?:

const allAnnotationSpans = Array.from(this.el.querySelectorAll('.r6o-annotation'));

[rsimon]

Yikes - no, I can confirm that RecogitoJS is the culprit, not your app. I don't have time to clean up everything right now (probably on the weekend). But the problem seems to be mostly this line here, which indeed removes annotations from every Recogito instance on the page, rather than just its own:

https://github.com/recogito/recogito-js/blob/main/src/highlighter/Highlighter.js#L98

const allAnnotationSpans = Array.from(document.querySelectorAll('.r6o-annotation'));

Instead it should be:

const allAnnotationSpans = Array.from(this.el.querySelectorAll('.r6o-annotation'));

I think that's all that's needed. But, as I said, needs a little testing and cross-checking.

[Apeli]

@rsimon You have a pull request waiting for this!

[rsimon]

Yay! Thanks :-)

[rsimon]

As I said: I think this should be all that's needed to fix this. But I'll do more testing on the weekend.

Cheers, R