H5P Core/Moodle plugin: Tooltip can overflow viewport and can be hidden underneath other elements
Description
Steps to reproduce
Use an H5P integration that features a version of H5P Core that contains the H5P.Tooltip class (should only be the H5P plugin for moodle and moodle’s custom H5P integration into moodle core). That’s Can be moodle’s sandbox, too.
Create a Question Set with at least two exercises and view it.
Hover the Check button. Reduce the viewport width if required.
Observe the tooltip positioning (the next button is on top) and sizing (the viewport is overflown and the tooltip text cut off)
Background
The H5P.Tooltip class was introduced in to solve the problems that the title attribute can cause for screen readers.
It does not seem to be released for any of H5P Group’s H5P integrations except for the H5P plugin for moodle. Other H5P integrations are using it as well, because a tagged and released version of H5P core suggests it could be used. Among those are at least moodle’s custom H5P integration in moodle core and Edlib run by NDLA.
Steps to reproduce
Use an H5P integration that features a version of H5P Core that contains the H5P.Tooltip class (should only be the H5P plugin for moodle and moodle’s custom H5P integration into moodle core). That’s Can be moodle’s sandbox, too.
Create a Question Set with at least two exercises and view it.
Hover the
Checkbutton. Reduce the viewport width if required.Observe the tooltip positioning (the next button is on top) and sizing (the viewport is overflown and the tooltip text cut off)
Background
The H5P.Tooltip class was introduced in to solve the problems that the
titleattribute can cause for screen readers.It does not seem to be released for any of H5P Group’s H5P integrations except for the H5P plugin for moodle. Other H5P integrations are using it as well, because a tagged and released version of H5P core suggests it could be used. Among those are at least moodle’s custom H5P integration in moodle core and Edlib run by NDLA.