Save/refresh issue

[nanaosakisan]

Nature of issue?

• Found a bug
• Existing feature enhancement
• New feature request

Details about the bug:

• Web browser and version: Firefox Version 64.0 (and the lastest version of Chrome)
• Operating System: MacOs Sierra Version 10.12.6
• Steps to reproduce this: don't save/refresh code's modifications when I try to run the program.

[catarak]

thanks for reporting @nanaosakisan! can you be more specific about how to reproduce this bug? for example, by listing out a few steps? i don't understand what the bug is.

[nanaosakisan]

I can't tell you step by step how to reproduce the bug. If I change my code (like add a variable named "test" for example), and save the change, when I want to run the program, an error notify appears and tells me that the variable "tes" doesn't exist. If I refresh the page, I can see that the variable I created before is named "tes", so not correctly. If I don't save the change, the bug doesn't appear. Télécharger Outlook pour Android<https://aka.ms/ghei36> De : Cassie Tarakajian Envoyé : lundi 17 décembre à 20:08 Objet : Re: [processing/p5.js-web-editor] Save/refresh issue (#790) À : processing/p5.js-web-editor Cc : nanaosakisan, Mention thanks for reporting @nanaosakisan<https://github.com/nanaosakisan>! can you be more specific about how to reproduce this bug? for example, by listing out a few steps? i don't understand what the bug is. — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub<#790 (comment)>, or mute the thread<https://github.com/notifications/unsubscribe-auth/AcZQcmoXuc2cPw-5DyUETBB07HQsdoXMks5u5-uQgaJpZM4ZWa5g>.

[shiffman]

I have noticed some odd behavior like this after the fix for #675 was published. I think this may be related? I meant to file this a few days ago, but I forgot. You can see the trouble I was having here:

https://youtu.be/pKyU92cza0Y?t=1978

I will investigate a bit more!

[shiffman]

I encountered this bug again this morning. I still cannot determine what exactly is causing it and I don't see anything in the console output. But in case this is helpful, here is the sketch:

https://editor.p5js.org/codingtrain/sketches/SJMl3u5xN

This is what I am doing:

1. Editing lines 35 and 38 to switch add() to push().
2. Manually saving with command-s.
3. Run sketch.
4. Error: Uncaught TypeError: next.add is not a function
5. Refresh page (no warning) and code is back to add().

[shiffman]

(Update I restarted browser and was able to save the change)

[catarak]

thanks for the updates! i'm going to dig into this.

[catarak]

i think what's happening here is inconsistency between what's in the editor, what's in the redux store, and what's on the server. when a sketch is saving, and then a user changes the editor, i think it's not getting into sync properly, and maybe the change i made is just exposing this.

update: i'm having a hard time consistently being able to reproduce this. i'll keep looking at this and hopefully figure it out soon 😕

[shiffman]

I taught a workshop and ran into this issue a few times with attendees. I unfortunately noticed that from time to time it also does not render the code in the editor but from the last save (I think). Very mysterious! I am able to reproduce it more consistently with auto-save on, I recorded a screen capture here:

https://youtu.be/rhtIYnHICCs

Note at 46 seconds it renders background(100) while the code itself has background(220).

The video starts with autosave off and it's interesting to note that when I refresh the page you'll see the old code for a brief moment before the newly saved code replaces it.

Hope this is a bit helpful! I am happy to look into this more if anyone has suggestions for tests I can run!

[catarak]

thanks @shiffman—hopefully i'll figure out how to reproduce this!

[L05]

I'm helping @REAS teach a class right now and we've had multiple students also encountering this issue (8+ within the past hour). They've reported saving (sometimes multiple times) over a duration only to have the code revert to an earlier version. This has happened to me as well; I'm having a hard time reproducing it consistently, but the behavior is very similar to what @shiffman has experienced in his screen captures. I'll update if I can find a reliable test case.

[bengrosser]

I am seeing a version of this a lot over the last several days.

The symptom for me is that in the middle of writing code (or possibly also when running code), the source code in my editor pane instantly reverts to an older version, wiping out whatever changes I made in the last X minutes.

If I had that latest code running in the preview pane when this happens—and I didn't have auto-refresh turned on—then I am able to inspect the canvas (using browser dev tools) and find the most recent version of the script there so I can copy and paste it back into the editor pane. But if I had auto-refresh on, this swapping out of new code for old also changes what's in the DOM so my inspect trick doesn't work.

My suspicion is that when this code reversion happens, it is triggered when an auto-save happens, so I've turned off auto-save for the moment to see if I'm right. Will report back if I learn more. Happy to try and help further if I can—this is starting to feel regular to me (I've had it happen maybe 8 times in the last 3 or 4 days).

update--> Unfortunately, turning off auto-save isn't a useful workaround. I've had it off for the last hour and just had my code reverted.

[anuraghazra]

@shiffman @catarak I think I figured out how to recreate the bug consistently here are the steps (maybe won't work on your pc) - Auto-refresh is off

NOTE : i suspect that timing is really important in here, and i think this bug is causing differently on different Internet Speeds and throttles

1. Create New Sketch
2. firstly Save (ctrl + s) wait for the Project Saved and Autosave enabled message then -
3. Change background(0) value and Save
4. Reload (ctrl + r)
5. Change background(100) value hit Save and then reload (ctrl+r) while the Project Saved alert is visible on screen.
6. Again do the above step
7. Do the above step one or two times if bug is not recreated (timing matters, I don't know how p5editor's save system works but I think timing matters in this context)

[jaytay579]

A bump on this issue and a related question. I now have my students back working locally in Brackets instead of using editor.p5js.org until we have a reliable workaround for the issue discussed in this thread, but not being able to use the online editor for in-class experimentation really slows down the pacing of an already packed-to-the-gills course!

Which brings me to my related question: Does anyone know of another online editor that we could use with P5.js in the meantime? I tried to set up a project in JSFiddle, but the way that it sandboxes code appears to be incompatible with P5's "magic functions" (that's what I call setup(), draw(), etc. with my students).

[L05]

As a small follow up, I've found that disabling Autosave does not resolve this issue.

@jaytay579 I haven't tested it in a class setting, but it may be worth trying Codepen. Here's a template:
https://codepen.io/L05/pen/KJREpO?editors=0010#0