Bug with editor in Branching Scenario

Submitted by hjakobs on Mon, 08/15/2022 - 17:46
Forums: 
Bugs in content types

Using the Branching Scenario we encountered a bug related to the text editor. This is what happens:

  1. Create a branching scenario.
  2. Add some questions and answers options.
  3. Then try to edit answers (in our case they are slides, actually). When editing the answers sometimes when clicking into the text field to edit the text the field itself disappears. You see the frame of the editor and the tool bar but the content area is somehow hidden/has disappeared. Also, you cannot extend the content area by using the black arrow on the right hand side. So, basically you cannot edit the content as there is no text showing.
  4. If you cancel everything and try another answer this sometimes works.

Some more info:

  • Moodle 3.11.8
  • Branching Scenario v 1.7.0
  • Device: Macbook Air, macOS Monterey 12.5 (the problem also appeared on Windows machines so not bound to Mac)
  • Browsers: Firefox 103.0.2.; Chrome 104.0.5112.79
  • Example can be provided

The attached screenshots show the steps from this list:

Step 1: Edit an answer in the branching tree.

Step 2: Edit the text of the answer (slide)

Step 3: Click into the text field of the answer

Step 4: The result is that the text area shrinks and the text disappears. It is not possible to extend the editor again through the small black arrow on the right corner. The weird thing is that this shrinking doesn't happen always.

Any help on this will be greatly appreciated.

 

Thank you very much!
Harald

 

Attachments: 
Image icon step 4_editor shrinks and text disappears.png
Image icon step 3_click in the text field for the answer.png
Image icon step 2_edit answer text.png
Image icon step 1_edit answer in tree.png
Content types: 
Branching Scenario
BV52's picture

BV52

Mon, 08/15/2022 - 19:05

Hi Harald,

This has been reported several times but for some reason I am unable to reproduce the issue. However someone suggested that clearing the browser's cache has resolved the issue.

Note: Please avoid cross posting in the forums.

-BV

hjakobs

Tue, 08/16/2022 - 12:16

Hello BV,

first of all apologies for creating a double entry here. I had problems in creating the forum post and must have ended up creating two.

Regarding your suggestion on how to solve the issue, it doesn't work unfortunately. We tried with Edge and Firefox on a Windows machine and with Chrome and Firefox on a Macbook Air with macOS Monterey. But the issue remains the same. You can edit an element but if you move on to the next you'll experience the error described.

Best
Harald

hjakobs

Tue, 08/16/2022 - 12:11

Hello BV,

first of all apologies for creating double entries. I had problems when trying to create the forum post and must have created two as a result.

Regarding your solution: Clearing the browser cache doesn't work for us. We tested with Edge and Firefox on a Windows machine and with Chrome and Firefox on a Macbook Air with macOS Monterey. The issue remains the same. You can edit an element. But if you move on to the next one to edit that one you will experience the error.

 

Best
Harald

thomas.crausaz

Wed, 08/17/2022 - 10:07

Same issue here. 

BV52's picture

BV52

Wed, 08/17/2022 - 18:34

Hi Everyone,

Would you mind checking the browser console for any errors?

-BV

thomas.crausaz

Thu, 08/18/2022 - 11:00

Hi, 

that the error I have when it happen in Chrome. 

Thanks

 

Attachments: 
Image icon chrome error.JPG
BV52's picture

BV52

Thu, 08/18/2022 - 18:04

Hi Thomas,

Thanks you for checking but I doubt the error is the one causing the issue.

-BV

hjakobs

Thu, 08/18/2022 - 12:50

Hello BV,

I checked for errors in the browser console (Chrome) but it doesn't show any errors. What I found when inspecting the elements was that this line puts 0px as height for the content area. This is wrong and causes that you can't access the existing text. Could that be fixed?

<div id="cke_470_contents" class="cke_contents cke_reset" role="presentation" style="height: 0px;"

 

Best
Harald

BV52's picture

BV52

Thu, 08/18/2022 - 18:05

Hi Harald,

I was expecting to see something similar, however my coding skills are novice at best. If anyone in the community have other suggestions feel free to post it here.

-BV

otacke's picture

otacke

Wed, 08/31/2022 - 20:49

Hi all!

I have seen this error being reported a couple of times now on moodle (with moodle's custom H5P integration only?), but I also failed to reproduce it. Might be good to gather details about the platform: moodle version, H5P core version, moodle's settings for caching and aggregating assets, theme that's installed and might customize things, etc.

Best,
Oliver

hjakobs

Thu, 09/01/2022 - 19:57

Hi Oliver,

than you for looking into this. Here's some info on our setup:

Moodle: 3.11.8 (Build: 20220711)H5P: for all H5P Core Plugins (filter, atto, contenttype) the Version is 2021051700 and H5P framework v1.24Cache: (application cache in) RedisTheme: boost_campus with local adjustments for RWTH AachenOS: CentOS 7PHP: 7.4DB: MySQL 8.0.29Contenttypes are updated on a daily basis via scheduled task After your suggestion the issue might rather be related to Moodle than to H5P I exported the H5P file and edited it with the Lumi editor (https://next.lumi.education/en/). Here I could edit the file without problems. So it seems you are right. BestHarald

 

otacke's picture

otacke

Thu, 09/01/2022 - 20:14

Hi!

I am not really looking into it, sorry. I was just sharing my observation that this seems to be a moodle only issue and more information might help to locate the issue. Could be in H5P core, but then I'd expect this to happen on other H5P integrations, too, not only on moodle. Since you're mentioning the cron based upgrade, I assume you're not running the H5P plugin for moodle, but moodle's custom integration? Could be important.

Cheers,
Oliver

thomas.crausaz

Wed, 08/31/2022 - 16:29

Hi. here is a little video to demonstrate the problem. 

Thank you

Thomas

 

yagomsilva

Thu, 09/01/2022 - 00:08

I'm also having the same problem with the text. and I have a doubt about backup, sometimes because of the internet I forgive all the Brendcenario built, don't you have a way of automatic backup?

 

TrainingBuilder

Tue, 11/08/2022 - 07:27

Chrome, Moodle 4.0 H5P plugin.  For me it seems to happen once text gets beyond a certain length and remains irrevocably reduced to a body size of 0 even if I hit backspace to reduce character count below the threshold.  It occurs in any Body text field (Text, branching questions, Feedback, etc).

hjakobs

Thu, 01/19/2023 - 13:31

Hi

there's three entries in the Moodle tracker addressing this problem:

The first and the third one are duplicates of the second one so MDL-74692 is the relevant one. There's also another H5P forum entry addressing the same issue discussed here.

As stated in MDL-74692, it seems that this already closed issue MDL-73853 on upgrading the h5p-editor-php-library and h5p-library-php to moodle-1.22.4 fixes the issue. We will try if that's the case.

Best
Harald

stopbit's picture

stopbit

Tue, 05/23/2023 - 15:17

Hi,

My course development team discovered the same issue today after a site upgrade to 3.11.14 Moodle. I've read that upgrading the 4.1 moodle is the suggested fix as a solution as that updates the library editor for h5p. Well, I did a file comparison and there is no difference in the ckeditor.js in these moodle versions, which seems to be the cause of the issue. So, it's not really a fix to upgrade, nor is it desirabled for many.

I inspected the problematic file and created a small work-around code tweak that fixes the problem.

Go here: /h5p/h5plib/v124/joubel/editor/ckeditor/ckeditor.js

Find line 371, which will look like so:

"")+'\x3c{outerEl} class\x3d"cke_inner cke_reset" role\x3d"presentation"\x3e{topHtml}\x3c{outerEl} id\x3d"{contentId}" class\x3d"cke_contents cke_reset" role\x3d"presentation"\x3e\x3c/{outerEl}\x3e{bottomHtml}\x3c/{outerEl}\x3e\x3c/{outerEl}\x3e'),b=CKEDITOR.dom.element.createFromHtml(q.output({id:a.id,name:b,langDir:a.lang.dir,langCode:a.langCode,voiceLabel:a.title,topHtml:h?'\x3cspan id\x3d"'+a.ui.spaceId("top")+'" class\x3d"cke_top cke_reset_all" role\x3d"presentation" style\x3d"height:auto"\x3e'+

Change it to this (I've bolded the code that needs inserting):

"")+'\x3c{outerEl} class\x3d"cke_inner cke_reset" role\x3d"presentation"\x3e{topHtml}\x3c{outerEl} id\x3d"{contentId}" class\x3d"cke_contents cke_reset" style\x3d"min-height:100% !important" role\x3d"presentation"\x3e\x3c/{outerEl}\x3e{bottomHtml}\x3c/{outerEl}\x3e\x3c/{outerEl}\x3e'),b=CKEDITOR.dom.element.createFromHtml(q.output({id:a.id,name:b,langDir:a.lang.dir,langCode:a.langCode,voiceLabel:a.title,topHtml:h?'\x3cspan id\x3d"'+a.ui.spaceId("top")+'" class\x3d"cke_top cke_reset_all" role\x3d"presentation" style\x3d"height:auto"\x3e'+

Save the file.

Purge your moodle caches and retry editing in H5P. The problem should be fixed.

Something is calculating the 'height' style element and applying 0px height, as a work-around I've manually inserted a min-height: 100% !important style, which overrides the normal height css value. Even when the height style value is set to 0 the min-height will take priority.

It's not perfect, but it does work and solves this issue, which in my opinion is a big problem.

Hope that helps everyone - also don't forget to get your Health and Safety training from SHEilds, should you need any.
Sorry for the sales pitch :-D