Embedded fill in the blanks is flickering in Firefox

Submitted by phil.r on Mon, 07/06/2020 - 05:43
Forums: 
Bugs in content types

mod_hvp version: 1.20. (2020020500)

Moodle version: 3.8.3

Question type: Fill in the blanks

Question type version: 1.12.4

Browser: Firefox 78.0.1 (does not occur in Chrome often, and is very mild when it does)

Steps to replicate:

  1. In Moodle create a new h5p activity and use 'Fill in the blanks'
  2. Create a large list of questions (with some blank text fields), around 20 lines. OR use the attached .h5p file to use my test activity
  3. Save and click 'embed' to copy the embed code
  4. Add a label resource in Moodle and paste the embed code into the HTML section of the editor. Save and return to course.

Observed results:

When loading the course page, the whole iframe flickers a lot (strobing effect) before finally loading the whole list at once. It generally occurs the first time and every second or third subsequent reload of the page (so keep refreshing until you see it).

Expected results:

The iframe loads all at once without unnecessary flickering.

H5P file: 
Binary Data test-2-119.h5p
Content types: 
Fill in the Blanks
BV52's picture

BV52

Mon, 07/06/2020 - 18:53

Hi phil.r,

Do you see any errors in the browser console? Also since I am unable to reproduce the issue do you have a test page that we can check?

-BV

otacke's picture

otacke

Mon, 07/06/2020 - 21:37

Hi all!

I have encountered this issue twice on moodle with Firefox.

One potential problem is the code creating and deleting each blank for every resize call which can hinder performance, especially if there are many blanks. A pull request to exterminate this issue has been idling at https://github.com/h5p/h5p-blanks/pull/45

One other time, there was a custom moodle filter that allowed to display H5P content directly on course pages instead of as interactions on a separate page. It put the H5P iframe into another iframe and used the regular H5P resizer script to resize that iframe - leading to two iframes constantly listening for H5P content resizes and triggering resizes themselves against each other. That custom solution required custom fixing.

Best,

Oliver 

davefoord

Sat, 04/17/2021 - 08:50

I am having a similar problem where quizzes that contain pictures, when viewed in firefox the screen flickers. It is fine in all other browsers.

Has any progress been made on this?

stefanriegel

Sun, 05/09/2021 - 23:31

I can reproduce the effect of flickering in Firefox 88, when I use Fill in the Blanks, or embed Fill in the Blanks into a Question Set, when I add many Blanks or 7 pages of Questions. It is reproducable by about 90% in Firefox, but have not seen in Edge. Looks to me like a Memory problem.

3TOON's picture

3TOON

Fri, 05/21/2021 - 13:22

Latest version of Moodle. Firefox 88, with two or more Fill in the Blanks, gives a painfull flickering which can last a very long time... Hope for a solution...

3TOON's picture

3TOON

Sat, 05/22/2021 - 10:45

I have found on the link below a simple solution, which works perfectly on my side:
https://tracker.moodle.org/browse/MDL-70445

One line to modify in the file yoursite/h5p/h5plib/v124/joubel/core/js/h5p-resizer.js

No more flickering in Firefox!

;-)

stefanriegel

Thu, 06/03/2021 - 15:22

I didn't have the opportunity yet to test it on our system, but this sounds like a perfect and highly desired solution. THANK YOU !