microsoft / microsoft/pxt-microbit

Code malformed when "grey blocks" are switched from blocks to Javascript

Open
#5,374 1 comment 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

decompiler P2
Dominant language
TypeScript
Stars
804
Forks
721
Avg merge
2d 9h
Merged PRs (30d)
2

Description

Describe the bug
When valid Javascript/TypeScript doesn't have an equivalent block it appears as "grey block" in the Blocks view.

With this example, the buffer code added in Javascript will appear as grey blocks, and when it's switched back to Javascript the formatting is missing the expected code indentation.

From (correct):

function startActivity () {
    basic.showNumber(0)
    buffer_a.fill(0)
    buffer_b.fill(0)
    basic.showNumber(0)
    basic.showNumber(0)
}
let buffer_a = pins.createBuffer(16)
let buffer_b = pins.createBuffer(16)

Then to blocks and back to Javascript, we get (incorrect):

function startActivity () {
    basic.showNumber(0)
    buffer_a.fill(0)
buffer_b.fill(0)
basic.showNumber(0)
    basic.showNumber(0)
}
let buffer_a = pins.createBuffer(16)
let buffer_b = pins.createBuffer(16)

To Reproduce
Steps to reproduce the behavior:

  1. Open this project: https://makecode.microbit.org/_V1U4fPFpJbi0
  2. Change to blocks (no need to even edit the project, the issue happens the landing page as well)
  3. Change back to Javascript
  4. The code formatting has been changed and the indentation removed

Expected behavior
The same indentations to be maintained inside the function body code.

Screenshots
Kapture 2023-10-18 at 17 58 14

micro:bit version (please complete the following information):

N/A

Desktop (please complete the following information):
N/A

Smartphone (please complete the following information):
N/A

Additional context

makecode.microbit.org version: 6.0.19
Microsoft MakeCode version: 9.0.12
microbit runtime version: v2.2.0-rc6
codal-microbit-v2 runtime version: v0.2.61

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Reproduce the behavior with the linked MakeCode project by switching from JavaScript to Blocks and back, then compare indentation inside the function body. Trace the Blocks-to-JavaScript conversion path and verify that returning to JavaScript preserves the original indentation.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
developer-experience, frontend
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.