Freecodecamp: Editor getting empty on ctrl+z

[Harshdand]

Challenge http://www.freecodecamp.com/challenges/waypoint-turn-an-image-into-a-link has an issue.
The editor has a small issue. If the editor has some code initially, even that code gets blank on ctrl+z

[Harshdand]

One more thing on this page the instructions are not clear whether we need to create a new anchor tag or wrap the image in the old anchor tag. Error shows Make sure each of your a(anchor) elements has a closing tag.

[BerkeleyTrue]

Hey @Harshdand,

ctrl(or cmd) z is the undo key binding. When the editor is first loaded the context is then inserted. When you hit ctrl + z that action is undone. That is why the content disappears. While this is annoying, this is by design. If you run into this again: redo key binding is usually ctrl(or cmd) + y.

As for the anchor tag the text says to wrap your img tag in an anchor tag but nothing about changing tags that are already there. @QuincyLarson Is currently auditing the entire curriculum and I will bring this to his attention.

Thanks and Good Luck!

[Harshdand]

@BerkeleyTrue Yes that is true ctrl+z has undo key binding but it should not undo on initial code.
I have tried demo code on codemirror website https://codemirror.net/ which works fine.

[enkessler]

@BerkeleyTrue Just ran into this myself. By design or not, it is unintuitive and feels like a bug to the user. Especially users who are just starting to learn programming (i.e. your target audience). Surely it is preventable somehow.

[QuincyLarson]

@BerkeleyTrue I just reproduced this, and hadn't noticed this behavior before. I agree that this is astonishing, and should probably be redesigned in keeping with the principle of least astonishment.

Is there a way we could prevent ctrl+z from wiping the initial seed? If there is a way we could do this without otherwise interfering with ctrl+z's behavior, that would be preferable.

[Harshdand]

Codemirror doesn't delete the initial code. If any wrappers are used then the issue might be because of them.

[ivantedja]

@QuincyLarson @BerkeleyTrue

In CodeMirror's example, CodeMirror uses CodeMirror.fromTextArea to generate the "editor" and the "editor" is loaded from the <textarea>. Whereas in FCC, the <textarea> is empty and the "editor" is loaded using editor.setValue(something).

So it means:

• "editor" initialize as empty
• JS call editor.setValue(something) to fill the "editor"
• UNDO at this point will bring to its previous content which is empty

The solution is to clear the undo history after editor.setValue(something)

See snippets below:

// client/commonFramework/create-editor.js

window.common = (function(global) {
  // ...
  common.init.push(function() {
    // ...
    editor.setValue(common.replaceSafeTags(editorValue));
    editor.getDoc().clearHistory(); // add this line
    editor.refresh();
  });
  // ...
}(window));

From what I heard, production it using backup/staging branch but PR should target staging branch (beta). So I'm not sure how to do PR for this as staging is using react which is totally different

[BerkeleyTrue]

@ivantedja Thank you for investigating. I was not aware that there was a codemirror solution for this.

[systimotic]

This bug doesn't seem to be happening in beta. Does that mean we can close this issue?

[ivantedja]

the behaviour in beta is in here #10972

[systimotic]

Ah, I see. Seems like the behaviour in this issue is no longer around, but what's happening in the other issue is definitely related. I'm working on a fix based on what you found.

[systimotic]

Seeing as though this issue is fixed in the beta, should we close this issue, or try to get a fix for the "old" version past staging into production?

[QuincyLarson]

@systimotic if it's working on beta, it will work as soon as we push beta. So yes, we can close this issue. Thanks for confirming this.