Skip to content

Upgrade Blockly to v13.0.0-beta.5#11321

Draft
microbit-matt-hillsdon wants to merge 1 commit into
microsoft:masterfrom
microbit-matt-hillsdon:blockly-v13-upgrade
Draft

Upgrade Blockly to v13.0.0-beta.5#11321
microbit-matt-hillsdon wants to merge 1 commit into
microsoft:masterfrom
microbit-matt-hillsdon:blockly-v13-upgrade

Conversation

@microbit-matt-hillsdon
Copy link
Copy Markdown
Contributor

@microbit-matt-hillsdon microbit-matt-hillsdon commented May 19, 2026

Draft for visibility.

Demo deployment: https://blockly-v13-upgrade.review-pxt.pages.dev/#editor

Bump from 12.3.1 and drop the @blockly/keyboard-navigation plugin (now built into Blockly core).

User-facing changes:

  • Keyboard navigation and screen-reader support are always enabled. Removed the accessible-blocks preference and its toggle UI. The heavier focus outlines for toolbox/workspace are enabled when using a meaningful keyboard navigation (previously matched setting).
  • Aligned pxt's cut/copy/paste with copy/cut toasts and the cut audio cue.
  • Variable creation focuses the new variable in the flyout (v13 behaviour); manual focus restore to the button removed.
  • Audio cues when keyboard navigation reaches limits and when a block is dropped on the workspace from move mode or drag.
  • Context menu changes were intentionally not ported from the keyboard navigation plugin. We could consider adding Cut alongside Copy/Paste, Copy/Paste are also not Blockly default.
  • Mac uses Cmd not Option as the unconstrained movement modifier.
  • Left and right arrow keys no longer wrap based on screen reader user feedback
  • Added an "end" position at the end of statement inputs. This can be useful for block insertion but is mainly motivated by helping screen reader users understand hierarchy in a way that's closer to text-based coding and more usable than a full tree structure.

API:

  • Custom drag strategy collapsed from a substantial copy of Blockly's internals thin subclass due as the base is now exported.
  • Event handler shapes, navigator/focus manager flows, bubble interfaces and widget-div positioning all updated to match v13.
  • Shortcut formatting is now a tracked port of Blockly's internal helper (not on the public API, previously this was copied from the nav plugin).

Workarounds for regressions in pxt customisations:

CSS:

  • Blockly v13 injects its CSS via adoptedStyleSheets, flipping the cascade. We've generally added body to selectors to address this.
    • The cascade change is currently under investigation to see if we can do better here in Blockly.
  • Related, adoptedStyleSheets requires Safari 16, last year we agreed 15, Blockly are up for a fix that's backwards compatible (will help with some iPads that still get 15.x security fixes) and micro:bit are taking a look here.

Translation:

  • New aria labels, move-mode announcements, and screen-reader-mode toggle inherited from Blockly v13.
    • Note the "command" language will change to "statement" in the next Blockly release and we'll sync with that then.

Known regressions vs Blockly 12 + keyboard nav plugin:

Follow ups will be needed for better screen reader integration and to update the keyboard controls help.

Closes microsoft/pxt-microbit#6870

Bump from 12.3.1 and drop the @blockly/keyboard-navigation plugin
(now built into Blockly core).

User-facing changes:
- Keyboard navigation and screen-reader support are always enabled.
  Removed the accessible-blocks preference and its toggle UI.
  The heavier focus outlines for toolbox/workspace are enabled when
  using a meaningful keyboard navigation (previously matched setting).
- Aligned pxt's cut/copy/paste with copy/cut toasts and the cut audio cue.
- Variable creation focuses the new variable in the flyout (v13
  behaviour); manual focus restore to the button removed.
- Audio cues when keyboard navigation reaches limits and when a block is
   dropped on the workspace from move mode or drag.
- Context menu changes were intentionally not ported from the keyboard navigation
   plugin. We could consider adding Cut alongside Copy/Paste, Copy/Paste are also
   not Blockly default.
- Mac uses Cmd not Option as the unconstrained movement modifier.
- Left and right arrow keys no longer wrap based on screen reader user feedback
- Added an "end" position at the end of statement inputs. This can be useful
  for block insertion but is mainly motivated by helping screen reader users
  understand hierarchy in a way that's closer to text-based coding and more
  usable than a full tree structure.

API:
- Custom drag strategy collapsed from a substantial copy of Blockly's
  internals thin subclass due as the base is now exported.
- Event handler shapes, navigator/focus manager flows, bubble
  interfaces and widget-div positioning all updated to match v13.
- Shortcut formatting is now a tracked port of Blockly's internal
  helper (not on the public API).

Workarounds for regressions in pxt customisations:
- Preserve duplicate-shadow-on-drag (e.g. melody).
  Patched at the gesture and drag-strategy level.
  Previously this only worked because of an odd behaviour in Blockly where
  the shadow was briefly focused (you can actually see this in live MakeCode
  when clicking a block).
- Snap dragged blocks back to the pointer at the snap-radius
  boundary (see RaspberryPiFoundation/blockly#9898).
- Re-stack the connection-preview indicator over the highlight path.

CSS:
- Blockly v13 injects its CSS via adoptedStyleSheets, flipping the
  cascade. We've generally added body to selectors to address this.
    - The cascade change is currently under investigation to see if we
      can do better here in Blockly.
- Related, adoptedStyleSheets requires Safari 16, last year we agreed 15,
  Blockly are up for a fix that's backwards compatible (will help with some
  iPads that still get 15.x security fixes) and micro:bit are taking a look
  here.

Translation:
- New aria labels, move-mode announcements, and screen-reader-mode toggle
  inherited from Blockly v13.

Known regressions vs Blockly 12 + keyboard nav plugin:
- Glitch when dragging affecting mouse users -
  RaspberryPiFoundation/blockly#9898 (Should be easy
  fix)
- Initial block placement isn't intelligent -
  RaspberryPiFoundation/blockly#9878 (Blockly plan to
  fix)
- Focused inputs not always respected for keyboard block insert -
  RaspberryPiFoundation/blockly#9899 (Newly raised)

Follow ups will be needed for better screen reader integration and to update
the keyboard controls help.

Closes microsoft/pxt-microbit#6870
@microbit-matt-hillsdon
Copy link
Copy Markdown
Contributor Author

@riknoll FYI, we'll continue to test this and update it with Blockly beta releases.

I'm away next week so @microbit-robert will pick up as needed.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Upgrade blockly to v13.0.0

1 participant