Freecodecamp: Code Editor in challenges does not scroll in Firefox

[rubenvar]

Describe the bug
When viewing any challenge in Firefox, I can scroll in the instructions/theory part of the window, but the scrolling does not work in the code editor. I have tried with an external mouse as well as with the Trackpad in my Mac.

In the same computer and with the same devices it works perfectly using Chrome.

To Reproduce

1. Go to any challenge.
2. Try to scroll inside the code editor.
3. It does not work.

Expected behavior
It should scroll.

Desktop:

• macOS 10.14.6
• Mozilla Firefox 69.0.3

Additional context
So far, to scroll in Firefox I have to click and drag the _side scrolling bar_ in order to navigate the code.

I think I'm only having this issue since the last redesign, but I may be wrong on this.

[moT01]

I've noticed this for quite a while - but I don't recall if it was present before the latest redesign.

[ArielLeslie]

I am also experiencing this problem as of the update.

• Windows 10 desktop
• Firefox 69.0.3
• External mouse with a scroll wheel

• In order to scroll I have to find the very small and hard to see scroll bar inside the code editor and click+drag

[tmoss0]

Having the same issue as you @ArielLeslie

Might take a dig in the code/inspector and see what's up.

[lasjorg]

It looks like a possible bug with the monaco editor (we are using monaco-editor": "^0.17.1")
https://github.com/Microsoft/monaco-editor/issues/1353

I confirmed the bug locally first and I then updated to the latest version of monaco 0.18.1 and the scroll works again in Firefox. So it has been fixed.

I'm just not sure how involved it is for us to update the editor?

[raisedadead]

@lasjorg Thanks for digging into this and finding the updates.

I think we should be able to update monaco-editor itself which we have as a dep:

https://github.com/freeCodeCamp/freeCodeCamp/blob/073ea9a4ef68e0e4381e5ac011edda582c659dce/client/package.json#L43

But the issue right now is to confirm if react-monaco-editor is going to play along as well:

https://github.com/freeCodeCamp/freeCodeCamp/blob/073ea9a4ef68e0e4381e5ac011edda582c659dce/client/package.json#L57

I think I could not bump it last time I was trying to update it.

Opening up for investigation and fix. A PR is most welcome, or any pointers are welcome as well.

[Blueyo12]

I am also experiencing this problem after the update.
MacOS 10.14.6
Firefox 69.0.3
Both external mouse with a scroll wheel and Macbook Pro trackpad cannot scroll the code window however Chrome and Safari browser does not have this problem.

[lasjorg]

@raisedadead I was able to update react-monaco-editor to both 0.30.2 and 0.31.0.

I updated react-monaco to 0.18.1 and react-monaco-editor to 0.31.0, did a few challenges locally and didn't see any immediate issues from the editor update.

A PR would just be a chore update to package.json and package-lock.json correct?

[raisedadead]

I am also experiencing this problem after the update.

Thanks for reporting, please use the voting feature instead of confirming further.

We know this is a confirmed bug, more so in an underlying library that we have little control over. We are working on a solution. Keeping the thread free for solutions will help.

[raisedadead]

A PR would just be a chore update to package.json and package-lock.json correct?

Yes please. You are the rockstar.