[Bug] Page flickers randomly when playing the TTS

[fabiorbap]

Describe the bug

In "Kaarnalaul" from Manfred Kalmsten, when I am at the start of the book, I start the TTS and play it, the book pages start randomly flickering to the pages before or after the page where the locator is, and then it goes back to the current page where the locator is.
The reproduced audio is correct, it says the right words, but the locator highlight is also wrong, sometimes the highlight is on a text different from the currently being red, and sometimes the highlight just disappears.
It seems to be related to a specific book, as I tested others, but it didn't happen as I was playing them.

How to reproduce?

1. Open book the "Kaarnalaul" from Manfred Kalmsten
2. Go to the beginning of it
3. Start the TTS
4. Press play and watch
   The book randomly changes the pages back and forth.

Readium version

Tested on 2.3.0 and 3.0.0

Android API version

Tested on 33 and 34

Additional context

It feels like it's specific to a book, "Kaarnalaul" from Manfred Kalmsten, as I couldn't reproduce it in other books.
I didn't add a screenshot, video or share the publication as I am afraid that would be a copyright infringement.

[stevenzeck]

It will be difficult to troubleshoot without the epub. Is there a copy available online anywhere? Is it a RTL by chance?

[stevenzeck]

Thanks. It seems limited to content0. The log shows a bunch of JavaScript error: :0 undefined. I'll have to unzip the epub and take a look.

[fabiorbap]

Thanks @stevenzeck ! Let me know if I can help with anything else.

[stevenzeck]

Ok, I think it is a problem with the whole book, but just not as bad in content1. If you unzip the epub and open content0.html, you'll find a lot of these tags: <br></br>. For whatever reason, it throws the highlighting and positions off. It's not exactly valid HTML.

[fabiorbap]

@stevenzeck Thank you for the reply! I did feel it was something related to the book, as many others worked properly.
There's nothing to be done here, then, or will it be investigated?
We found another one with the same issue, would you like me to share it with you as well?

[stevenzeck]

@mickael-menu wanted to take a look at it too to make sure there isn't an issue with the locator.

If you could share the other one, that would help too.

[stevenzeck]

Yeah looks like the same HTML tag structure. I don't think Mickael has looked at this yet.

[stevenzeck]

I think it's a difference in the way jsoup is parsing the HTML to assign the nth-child and what Android's webview considers to be the 6th nth-child. I can see in debugging that jsoup is assigning <p class="b">1/2011 – H. P Lovecraft «Hullumeelsuse mägedes»</p> as the 6th child, while the Android webview considers the 6th to be <p class="b">2/2011 – Charles Stross «Palimpsest»</p>.

My guess is, jsoup considers <br></br> to be two different children, and thus assigns 6 to H.P. Lovecraft. But the webview interprets <br></br> together be one child, so H.P Lovecraft is 5. When reader tells the webview to highlight "1/2011..." in the 6th child, it can't find it because it's looking in <p class="b">2/2011 – Charles Stross «Palimpsest»</p>. When it can't find it, it seems to default going to the beginning of the resource.

I also tried the same HTML in a desktop browser, and it also says that H.P Lovecraft is the 6th. Mickael can confirm, but I don't think it's an issue the toolkit can solve. And since you'd have to get jsoup and different browsers to agree on what is what, there probably isn't anything they can do either.

<div style="text-align: justify" class="hsection1">
<div style="text-align: center;"><img src="imgab195046a3064bb7835a7d131f8a8368.jpg" alt=""></img></div>
<div style="page-break-after: always"></div>
<p class="b">Orpheuse Raamatukogu:<br></br><br></br></p>
<br></br> <---- THIS ONE
<p class="b">1/2011 – H. P Lovecraft «Hullumeelsuse mägedes»</p>
<p class="b">2/2011 – Charles Stross «Palimpsest»</p>

[fabiorbap]

@stevenzeck thank you for such thorough analysis!
I understand there's nothing to be done on Readium's side or anything can do to fix this, right?

[mickael-menu]

No I think we should support this edge case in Readium. I'm not sure when we'll have time to tackle it, but contributions are always welcome!