Component is not being created in Redwood/Sumac

[mariajgrimaldi]

Expected behavior

Recommender xblock should be created.

Actual behavior

When a recommender component is added nothing happens. When the page is refreshed on studio the page won't load. From LMS an error is displayed.

You can see it here (until next Monday): https://studio.redwood.demo.edly.io/container/block-v1:OpenedX+DemoX+DemoCourse+type@vertical+block@19fc1913a7f64ce4a4223e9f314cedef

Screencast.from.23-05-24.09.51.20.webm

Steps to reproduce

Go to Studio, add "recommender" to "Advanced Settings" -> "Advanced module list" add a component from "Advanced" -> "recommender"

Original issue: openedx/wg-build-test-release#355

[mariajgrimaldi]

Hi @navinkarkera! I see you're the new maintainer. Could you give us a hand here? Thanks!

[navinkarkera]

@mariajgrimaldi I don't have write access yet as I just closed the nomination post. I'll need to sort out the permissions first, but I can take a look in the meantime.

[navinkarkera]

@mariajgrimaldi I just tried this xblock on tutor-nightly and it seems to work, although it doesn't look very good. I am not sure if I can get redwood stack working locally via tutor as of now.

[mariajgrimaldi]

Thank you for trying it! Was that tutor-nightly a remote environment? I'm just making sure the error is not related to an asset-production issue.

[navinkarkera]

Was that tutor-nightly a remote environment?

@mariajgrimaldi No, tested it locally.

[mariajgrimaldi]

@navinkarkera: I tested it locally on Redwood, and it worked. So this might be related to how it's being deployed, maybe to the assets-building process? I don't know this component so I couldn't say for sure, but this is the error I'm seeing in the Studio console after replicating what I mentioned above:

Uncaught SyntaxError: invalid regular expression flag t
    globalEval https://studio.redwood.demo.edly.io/static/studio/js/cms-base-vendor.5fa9e818ccd4.js:486
    domManip https://studio.redwood.demo.edly.io/static/studio/js/cms-base-vendor.5fa9e818ccd4.js:5434
    append https://studio.redwood.demo.edly.io/static/studio/js/cms-base-vendor.5fa9e818ccd4.js:5574
    loadResource https://studio.redwood.demo.edly.io/static/studio/bundles/js/factories/container.33125aa522f51f597b81.ab77e4b3456f.js:2
    i https://studio.redwood.demo.edly.io/static/studio/bundles/js/factories/container.33125aa522f51f597b81.ab77e4b3456f.js:2
    i https://studio.redwood.demo.edly.io/static/studio/bundles/js/factories/container.33125aa522f51f597b81.ab77e4b3456f.js:2
    fire https://studio.redwood.demo.edly.io/static/studio/js/cms-base-vendor.5fa9e818ccd4.js:3330
    add https://studio.redwood.demo.edly.io/static/studio/js/cms-base-vendor.5fa9e818ccd4.js:3389

[navinkarkera]

@mariajgrimaldi It might be due underscore.min.js file as that is the only file which has regex with t flag which according to mozilla is not a valid flag (I am not even sure that is the issue here but doesn't hurt to try). The use of underscore.min.js was removed via this commit: 40bd60d so it should be safe to remove the file completely.

[navinkarkera]

@mariajgrimaldi Were you able to get this working?

[mariajgrimaldi]

@navinkarkera: thank you for all the insight. I haven't had the time to review this, but I'll try to get someone from my team to look. Thank you!

[BryanttV]

Hi @mariajgrimaldi @navinkarkera, I'm working on this issue. I will first try deleting the file that may be causing the error.

[BryanttV]

I tested in a remote environment on Redwood (18.1.2). I installed a custom version that doesn't include the underscore.min.js file. However, it still keeps the same error, and this comes up in the browser console:

VM591:1 Uncaught SyntaxError: Invalid regular expression flags
    at eval (<anonymous>)
    at Function.globalEval (cms-base-vendor.5fa9e818ccd4.js:486:5)
    at domManip (cms-base-vendor.5fa9e818ccd4.js:5434:15)
    at jQuery.fn.init.append (cms-base-vendor.5fa9e818ccd4.js:5574:10)
    at child.loadResource (container.33125aa522f51f597b81.ab77e4b3456f.js:2:97554)
    at i (container.33125aa522f51f597b81.ab77e4b3456f.js:2:97120)
    at Object.<anonymous> (container.33125aa522f51f597b81.ab77e4b3456f.js:2:97192)
    at fire (cms-base-vendor.5fa9e818ccd4.js:3330:31)
    at Object.add [as done] (cms-base-vendor.5fa9e818ccd4.js:3389:7)
    at i (container.33125aa522f51f597b81.ab77e4b3456f.js:2:97175)

I will continue to investigate what may be causing the error.

[BryanttV]

Hi, sorry for not updating the status of this. I spent some more time researching and found the following:

1. For Redwood (v18.1.2) on local and remote with this branch which removes the underscore.min.js file from XBlock, the same error also happens.
2. For Nightly and v2.2.0 of XBlock, it works correctly locally.
3. Finally, with Redwood (v18.1.2 and v18.1.3) I tried an edx-platform mount with the master branch, and it works (locally).

In conclusion, the problem seems to be directly in edx-platform. In the master branch it seems to be already fixed.

[navinkarkera]

@BryanttV Thank you for you investigation!

@mariajgrimaldi Should we close this issue now that it has been fixed in master branch of edx-platform?

[BryanttV]

Hi, @mariajgrimaldi, @navinkarkera

We have been testing on:

• https://sandbox.openedx.edly.io/
• https://next-release.openedx.org/

The error is still present. Since these environments are not aligned with the latest changes in the edx-platform, the ideal would be to test in a remote environment in Nightly; however, we do not have access to one now. It's best to leave the issue open and monitor it in Sumac when it becomes available.

[mariajgrimaldi]

@BryanttV: have you been able to reproduce this issue in the sumac sandbox?

[BryanttV]

Hi @mariajgrimaldi, I have bad news. The error keeps happening in the Sumac sandbox 🤔 I'm running out of ideas about what might happen.

[mariajgrimaldi]

@navinkarkera, could you help us by looking into this issue? It seems like this xblock is unusable in remote environments.

[navinkarkera]

@BryanttV I don't have a remote environment to test this on but I have created this PR: #105 that removes use of mustache templates and replaces it with edx.HtmlUtils.template (which is what is used in edx-platform) and also upgrades tooltipster. Can you please test this PR branch in your remote environment and see if it fixes the issue?
cc: @mariajgrimaldi

[BryanttV]

Hi @navinkarkera, I tested in our remote environment in Sumac with your branch, but the same error still happens.