microsoft / pxt-microbit

A Blocks / JavaScript code editor for the micro:bit built on Microsoft MakeCode
https://makecode.microbit.org
Other
708 stars 588 forks source link

Writing in TS, then checking blocks, then going back to TS breaks formatting and type definitions. #5051

Open LibrarySeph opened 1 year ago

LibrarySeph commented 1 year ago

Describe the bug I wrote some test code in TS. Clicked "blocks" to see what would happen. Then went back to TS and it was filled with type errors and wonky indentation. I could not use undo to get my code back.

To Reproduce Steps to reproduce the behavior:

  1. Create a Blocks + Code project
  2. Copy the code from main.ts of this project: https://makecode.microbit.org/_6pjC8o6iLM2C
  3. Click "blocks" in either the top action button or side explorer
  4. Go back to main.ts

Expected behavior As no changes were made in blocks mode, the code was expected to remain the same when returned to. Even if changes are made in blocks mode, returning to the file and using undo is expected to return the file to its previous state.

Screenshots Written code image

Switch to blocks. Create no changes. image

Switch back and now there's errors image

Additional context I'm really glad I found this in my testing. Having an introductory coding lesson where there are multiple buttons on the screen that will break the code in ways that even the teacher can't reverse is... frankly, I find humor in it. Very much a "trial by fire" experience for any newcomers who accidently hit that button after trying to learn to write code.

Suggestion When converting from Code to Blocks, store the original code in local storage. If no changes are made, use that as the output of back-converting. Also, add the conversion process to undo history.

martinwork commented 1 year ago

The code at the link above still has the calls to sound.ts.

Here's the code without sound.ts https://makecode.microbit.org/_KFs006hsxP46 Load the project. Switch to blocks, then back to Javascript.

martinwork commented 1 year ago

const randDir becomes randDir. Reinserting constfixes the errors.

LibrarySeph commented 1 year ago

Don't forget the strange indentation and the unconventional refactoring!

Having code change in such large ways might be very confusing to people that don't know what's going on behind the scenes.

martinwork commented 1 year ago

I didn't mean to minimise or forget anything - just figuring out what the error was.

martinwork commented 1 year ago

The indentation goes wrong after a section that doesn't translate to blocks.

LibrarySeph commented 1 year ago

Ah, good catch. It seemed related, but many of the lines were clearly not part of the custom code blocks. Such as triedReverse = true. It follows console.log(), but itself is easily represented by blocks.