Requirements for p5.js Web Editor


I would like to use the p5.js Web Editor for introducing programming in 2 courses at my school. Unfortunately, I only get an empty page (it contains some divs that are not displayed) when I try to load the editor with Firefox. There seem to be no problems with our school filter and our school’s IT admin told me that Javascript is activated.

Could you please tell me, which requirements are needed for the p5.js Web Editor to be displayed / run in a browser (Firefox)?

Since school starts again next week, I am getting a bit nervous, so I would be really glad if I could get a fast answer.

Thank you very much for your help.

Best regards

Hi! I’m not sure about the requirements. But…

  • What version of Firefox is it?
  • Does it have any plugins running? Some plugins block certain features.
  • If you open the console (Ctrl+Shift+K) in Firefox, does it show any errors there?
  • What about working on instead of the web editor? Can you type programs there and run them?
  • When you say Web Editor, do you mean this: ?

Thank you very much for your input. I found the problem today and it was the Firefox version. Checking the errors hinted that html5 and css3 were not supported. Since that seemed really strange I checked the version and found that it was 22.0. I looked that up in the version history and it is from 2013, before html5 was supported by most browsers. At the end of last term Firefox was more or less up to date. In the summer vacations a “new” image was installed on the 500 school computers… Unfortunately, we teachers do not have any rights for installing or updating software, so this will be an “interesting” start…

But I did not know, so at least I got some new input out of it :wink: Thanks for that.

I think you should probably try to get your browsers upgraded. Not just for the P5.js editor, but for general sanity.

But if for whatever reason you can’t update them, it’s worth noting that the P5.js web editor isn’t strictly required to edit P5.js. It’s perfectly fine to use a basic text editor, or the Processing editor itself, to edit P5.js code.

Shameless self-promotion: here is a guide on different editors that can edit P5.js:

That is like driving a car without seat belts. Using such obsolete versions is just a security risk. Your IT department should know better…


1 Like