Open westnz opened 9 months ago
Thanks for logging @westnz. To debug and replicate the issue, we need a link to an existing lesson where this is happening. Are you able to share such a link?
Ah, I did originally fill in the reproduction steps. Fixed! ⏫
Thanks @westnz, I have also been able to replicate this on a test lesson
https://learn.wordpress.org/wp-admin/post.php?post=50087&action=edit
@adamwoodnz After looking into this, it looks like the Sensei image hotspot block sets a tabindex
of -1
to the a
tag used inside the image hotspot block, and somewhere along the line, this tabindex
is removed.
Content generated by `save` function:
<div class="wp-block-sensei-pro-image-hotspots-hotspot" data-sensei-block-id="efad44b7-2ecc-4942-8316-b68f62cbe2e2" data-sensei-wp-block="{"blockId":"efad44b7-2ecc-4942-8316-b68f62cbe2e2","draft":false,"x":55.53571428571429,"y":24.136904761904763}"><button class="sensei-lms-image-hotspots__hotspot-marker" style="left:55.53571428571429%;top:24.136904761904763%"><a tabindex="-1"></a></button><div class="sensei-lms-image-hotspots__hotspot-tooltip wp-block-sensei-pro-image-hotspots-hotspot" style="--y:24.14%;--x:55.54%"><span class="sensei-lms-image-hotspots__hotspot-tooltip-arrow"></span><!--sensei:inner-blocks-->
<!--/sensei:inner-blocks--></div></div>
Content retrieved from post body:
<div class="wp-block-sensei-pro-image-hotspots-hotspot" data-sensei-block-id="efad44b7-2ecc-4942-8316-b68f62cbe2e2" data-sensei-wp-block="{"blockId":"efad44b7-2ecc-4942-8316-b68f62cbe2e2","draft":false,"x":55.53571428571429,"y":24.136904761904763}"><button class="sensei-lms-image-hotspots__hotspot-marker" style="left:55.53571428571429%;top:24.136904761904763%"><a></a></button><div class="sensei-lms-image-hotspots__hotspot-tooltip wp-block-sensei-pro-image-hotspots-hotspot" style="--y:24.14%;--x:55.54%"><span class="sensei-lms-image-hotspots__hotspot-tooltip-arrow"></span><!--sensei:inner-blocks-->
<!--/sensei:inner-blocks--></div></div>
What's interesting is that when I test this on my local development environment, I cannot replicate this error, which makes me think it's either to something elsewhere in the .org codebase and not something in the wporg-learn theme or plugin.
Description
When editing specific lessons in a course, I encounter an issue where certain blocks do not display correctly in the backend, accompanied by the message: 'This block contains unexpected or invalid content.'
Step-by-step reproduction instructions
Please list the steps needed to reproduce the bug. For example:
Please note, this is only one example but also happens with other blocks such as Flashcard block: https://learn.wordpress.org/wp-admin/post.php?post=32844&action=edit & even the Video block: https://learn.wordpress.org/wp-admin/post.php?post=12045&action=edit
Expected behaviour
The blocks appear correctly.
Actual behaviour
The block needs to be recovered and you see the message: 'This block contains unexpected or invalid content.' You can recover the block, but it appears incorrectly again when you refresh or return to the lesson at a later stage.
Screenshots or screen recording (optional)
Environment information