RaspberryPiFoundation/blockly
43.6
Weak · 1 October 2026
132.6k
lines of production code
TypeScript
with JavaScript
2
measurements over time
What this system is
This system is the Blockly library, a comprehensive framework for building block-based visual programming editors. It provides the core engine for rendering, dragging, and connecting blocks, along with a modular plugin ecosystem for extending functionality with custom fields, toolboxes, and themes. The codebase also includes infrastructure for generating code in multiple languages and managing workspace serialization, while actively maintaining accessibility standards and modernizing its architecture for TypeScript and ES modules.
How it got here
2013 — legacy codebase cleanup and migration
33 changes.
This period focused on removing legacy infrastructure, including App Engine backends, sample applications, and outdated demo pages, to streamline the project. Simultaneously, core components were migrated from JavaScript to JSON and TypeScript, and localization systems were updated to replace deprecated Closure-based formats.
2015–2026 — Accessibility overhaul and v13 modernization
61 changes.
This period focused on a comprehensive accessibility overhaul, introducing ARIA labels, keyboard navigation, and screen reader support across the core library, toolbox, and plugins. It also involved a major architectural modernization for Blockly v13, including a migration to TypeScript, a modular serialization system, and the introduction of new rendering engines and ESM support.
Features
Added Hacker Mode theme plugin
The @blockly/theme-hackermode plugin is now available, providing a visual theme that simulates a movie hacker screen with a black background, black blocks, and lime green monospace text. Users can apply this theme by importing it and passing it to the Blockly injection options, which updates the workspace background, toolbox, flyout, and block colors to match the aesthetic.
packages/plugins/theme-hackermode · high confidence
Block Factory demo adds stub analytics and restructures core controllers
The Block Factory demo now includes a stubbed analytics integration (BlocklyDevTools.Analytics) that logs events such as navigation, saves, imports, exports, and errors to the console when enabled, providing a foundation for future usage tracking. Additionally, the demo's architecture has been restructured with new or updated controllers (AppController, BlockLibraryController, BlockExporterController) and supporting utilities (BlockDefinitionExtractor, BlockExporterTools, BlockLibraryStorage/View) that manage the block library lifecycle, export settings, and block definition extraction, enhancing the tool's modularity and user workflow for saving, editing, and exporting custom blocks.
packages/blockly/demos · high confidence
Dynamic connection blocks for if, list, and text join
The @blockly/block-dynamic-connection plugin introduces blocks that replace the standard mutator UI with dynamic connections: dragging a block onto an input on a dynamic if, list create, or text join block automatically adds a new input. To use this behavior, call overrideOldBlockDefinitions() to swap in the dynamic versions, register the decoratePreviewer as the connectionPreviewer plugin, and add the finalizeConnections listener to the workspace so that added inputs are committed when blocks are deleted or finalized.
packages/plugins/block-dynamic-connection · high confidence
Introduce @blockly/dev-scripts for plugin development
The \@blockly/dev-scripts\ package is added to provide a standardized set of CLI commands for developing Blockly plugins. It includes scripts for \start\ (launching a webpack dev server with hot reloading for the test playground), \build\ (compiling source code to production), \test\ (running Mocha tests), \clean\, \predeploy\, and \auditFix\. The package configures webpack to handle TypeScript, generate UMD libraries, and manage environment-specific entry points for development and testing.
packages/plugins/dev-scripts · high confidence
Introduce @blockly/field-bitmap plugin for pixel-grid input
The new @blockly/field-bitmap plugin adds a field that lets users paint small bitmap images on a grid of clickable pixels, with the image value stored as a 2D array of 1s and 0s. Users can paint pixels with the mouse, randomize the grid, or clear it, and the field supports configuration for initial value, width, height, static field height, custom colors, and toggling the Randomize and Clear buttons. The field is serializable and integrates with Blockly via JavaScript or JSON block definitions, and includes a test suite and demo playground to validate creation, value setting, and accessibility behavior.
packages/plugins/field-bitmap · high confidence
Introduce ESM entrypoints and package exports
The package configuration now includes an \exports\ section, enabling native ES Module (ESM) entrypoints for consumers. This change modernizes the module resolution strategy, allowing projects that use ESM to import Blockly directly without relying on CommonJS interop or bundler workarounds, while maintaining backward compatibility for existing CommonJS users.
(dependencies) · high confidence
Introduce continuous-scroll toolbox and workspace backpack plugins
This release adds two new plugins: the continuous toolbox, which provides an always-open, vertically scrolling flyout that displays all block categories simultaneously with smooth category navigation and block recycling for performance, and the workspace backpack, which allows users to copy, paste, and manage blocks across workspaces via a dedicated flyout with configurable context menus and accessibility improvements.
packages/plugins/continuous-toolbox, packages/plugins/workspace-backpack · high confidence
Introduce multiline text input field and code-generation block
The \@blockly/field-multilineinput\ plugin is now available, providing a \FieldMultilineInput\ that supports newline characters and configurable options like \maxLines\, \spellcheck\, and \enterCommits\ behavior. It also includes a \text\_multiline\ block with generators for JavaScript, Python, PHP, Lua, and Dart, allowing users to create and export multiline string values directly from their block programs.
packages/plugins/field-multilineinput · high confidence
Migration script for API renames and module reorganization
A new migration tool has been added to help users update their code when upgrading Blockly versions. The \renamings.json5\ file defines a mapping of renamed modules, exports, and properties (such as moving clipboard and dialog functions to new modules and changing direct property access to getter/setter methods) so that automated scripts can refactor legacy code to match the new API structure.
packages/blockly/scripts/migration · high confidence
New @blockly/create-package CLI for scaffolding plugins and apps
The dev-create plugin now provides a command-line tool (bin/create.js) that lets developers scaffold new Blockly plugins (block, field, theme, or generic) and standalone applications from pre-existing templates. The CLI supports generating JavaScript or TypeScript projects, allows specifying a custom directory name, author, and whether the plugin is first-party (affecting the npm package scope), and automatically runs npm install after creation. It also includes updated documentation and .gitignore rules to keep generated sample-app copies out of version control.
packages/plugins/dev-create · high confidence
New ARIA label composition and flyout inflation logic
The core library now uses a dedicated \block\_aria\_composer\ module to generate detailed, context-aware ARIA labels for blocks, including parent input context and field row descriptions. Additionally, flyout block creation has been moved into a new \BlockFlyoutInflater\ class, which handles block instantiation and explicitly manages ARIA roles (such as \OPTION\) and hidden states for screen readers.
packages/blockly/core · high confidence
New Geras and Thrasos block renderers and demo storage infrastructure
This change introduces two new block rendering engines, Geras and Thrasos, which provide updated visual styles and layout logic for Blockly blocks, including support for highlights, drop shadows, and embossed connections. Additionally, it adds the backend infrastructure for the Blockly demo app, including a Python-based storage system for saving and retrieving block XML/JSON, an expiration handler to clean up old data, and a redirect page to manage legacy URL paths.
(repo-wide) · high confidence
New HSV colour and date input fields for Blockly blocks
Developers can now use two new field types in their block definitions: \FieldColourHsvSliders\ and \FieldDate\. The HSV colour field provides a dedicated UI with hue, saturation, and brightness sliders (plus an optional eye-dropper button on supported browsers) for selecting colours, while the date field leverages the browser's native date picker input. Both fields are available as npm packages (\@blockly/field-colour-hsv-sliders\ and \@blockly/field-date\) and include test playgrounds for manual verification.
packages/plugins/field-colour-hsv-sliders · high confidence
New ScrollOptions plugin for enhanced workspace scrolling
The @blockly/plugin-scroll-options package is introduced, providing two new scrolling capabilities: wheel scrolling (allowing users to scroll the workspace with the mousewheel while dragging a block) and edge scrolling (automatically scrolling the workspace when a block or workspace comment is dragged near the edge). The plugin includes a ScrollBlockDragger and ScrollMetricsManager that must be registered in the Blockly workspace configuration, and offers configurable options for scroll speeds and activation distances.
packages/plugins/scroll-options · high confidence
New TypeScript sample application plugin
A new TypeScript-based sample application has been added to the plugins directory, providing a complete reference implementation for integrating Blockly. This plugin includes a custom 'add\_text' block definition, a JavaScript code generator that appends text to the UI, and a full workspace setup with a toolbox containing standard logic, loop, and math blocks. It features a split-pane interface for viewing generated code and output, along with logic to save and load workspace state to local storage, all built using a Webpack and TypeScript configuration.
packages/plugins/sample-app-ts · high confidence
New accessibility and utility utilities for Blockly
This change introduces a suite of new utility modules in the core utils package to support improved accessibility and internal logic. The new \aria.ts\ module provides a comprehensive API for managing ARIA roles, states, and live region announcements, enabling screen reader support for workspace elements. Additionally, \focusable\_tree\_traverser.ts\ adds helpers for navigating focusable nodes within the workspace tree, while \shortcut\_formatting.ts\ introduces platform-aware formatting for keyboard shortcut display. Supporting utilities for color manipulation, coordinate geometry, and string parsing are also included to standardize these operations across the library.
packages/blockly/core/utils · high confidence
New bubble components with keyboard navigation and ARIA support
The bubble subsystem has been refactored to introduce a new abstract Bubble base class and specific implementations (TextBubble, TextInputBubble, MiniWorkspaceBubble) that support keyboard navigation and accessibility. Users can now interact with bubbles using keyboard shortcuts, and screen readers receive proper ARIA labels and context for bubble content, improving usability for assistive technology users.
packages/blockly/core/bubbles · high confidence
New colour field and blocks plugin for Blockly
The \@blockly/field-colour\ plugin is introduced, providing a \FieldColour\ UI component and four associated blocks: \colour\_picker\, \colour\_random\, \colour\_rgb\, and \colour\_blend\. The field allows users to select colours from a grid palette, while the blocks enable picking a colour, generating a random one, composing a colour from RGB percentages, and blending two colours by ratio. The plugin includes code generators for JavaScript, Dart, Lua, PHP, and Python, and is built on top of the \@blockly/field-grid-dropdown\ field.
packages/plugins/field-colour, packages/plugins/field-grid-dropdown · high confidence
New common block rendering infrastructure
The \packages/blockly/core/renderers/common\ directory now contains the core implementation for the block rendering pipeline, including the \Renderer\ base class, \ConstantProvider\ for sizing and path data, \RenderInfo\ for measuring block dimensions, \Drawer\ for generating SVG paths, and \PathObject\ for managing SVG elements. This change establishes the foundational rendering logic that computes block shapes and handles visual states like highlighting and selection.
packages/blockly/core/renderers/common · high confidence
New field-angle and field-dependent-dropdown plugins added to monorepo
The \@blockly/field-angle\ and \@blockly/field-dependent-dropdown\ plugins have been added to the monorepo, providing new field types for Blockly applications. The angle field allows users to select angular values via a visual protractor or compass interface, supporting configurable modes, tick marks, and direction. The dependent dropdown field enables cascading selection by automatically updating its available options based on the value of a parent field, including support for chained dependencies and proper undo/redo history.
packages/plugins/field-angle, packages/plugins/field-dependent-dropdown · high confidence
New i18n conversion scripts for translation workflows
Added Python scripts in the i18n directory to streamline the translation process: js\_to\_json.py extracts messages from Blockly's messages.js into JSON files for translation platforms, create\_messages.py converts those JSON files back into JavaScript, and supporting utilities (common.py, dedup\_json.py) handle shared logic and data cleanup. These changes improve the developer experience by automating message extraction and regeneration, reducing manual effort in the localization pipeline.
packages/blockly/scripts/i18n · high confidence
New keyboard-driven block movement with visual indicators
Users can now move blocks, comments, and bubbles using keyboard shortcuts. This change introduces a new \KeyboardMover\ class that coordinates the movement logic and a \MoveIndicator\ component that displays a visual arrow indicator on the workspace to show the element being moved. The implementation includes logic to handle move commits and prevent conflicts with other keyboard actions.
_packages/blockly/core/keyboard\nav · high confidence
New modular toolbox architecture with keyboard navigation and accessibility improvements
The toolbox system has been refactored into a modular structure with dedicated classes for categories, collapsible categories, separators, and the toolbox container itself. This change introduces full keyboard navigation support for the toolbox and flyout, allowing users to navigate and select items using keyboard shortcuts. Separators are now excluded from the accessibility tree to improve screen reader experience, and the flyout now correctly follows the toolbox in the DOM. Additionally, fixes ensure that nested categories with blocks in the parent are resolved correctly, and errors when mixing keyboard and mouse input in the toolbox/flyout are prevented.
packages/blockly/core/toolbox · high confidence
New sample application for building Blockly apps
A new sample application is now available to help developers get started with Blockly. This starter project includes a pre-configured development environment using Webpack, TypeScript, ESLint, and Mocha, along with a complete source structure. It demonstrates core concepts such as injecting the Blockly workspace, defining a comprehensive toolbox, creating custom blocks (like the example 'add\_text' block), generating JavaScript code, and persisting workspace state to browser local storage. Users can clone this app to use as a foundation for their own Blockly-based projects.
packages/plugins/sample-app · high confidence
Plus/Minus plugin introduces a +/- UI for block mutators
The @blockly/block-plus-minus plugin replaces the default mutator dialog for built-in blocks (if/else-if/else, text join, list create, and procedure definitions) with a direct +/- button interface. This allows users to add or remove inputs inline on the block, with the minus button appearing only when inputs can be removed. The plugin also includes ARIA labels for screen reader accessibility and supports localization of the button text.
packages/plugins/block-plus-minus, packages/plugins/content-highlight · high confidence
Structured keyboard navigation policies for Blockly UI elements
This change introduces a set of dedicated navigation policy classes within the \packages/blockly/core/keyboard\_nav/navigation\_policies\ directory to govern keyboard focus movement across the workspace. New implementations include \BlockNavigationPolicy\ for traversing blocks, fields, and connections; \IconNavigationPolicy\ and \BubbleNavigationPolicy\ for handling block icons and their associated bubbles; \FieldNavigationPolicy\ for moving between editable fields; \ConnectionNavigationPolicy\ for navigating to input and statement connections; \WorkspaceCommentNavigationPolicy\ and \CommentBarButtonNavigationPolicy\ for workspace comments; \FlyoutButtonNavigationPolicy\ and \FlyoutSeparatorNavigationPolicy\ for the flyout interface; \ToolboxItemNavigationPolicy\ for navigating the toolbox hierarchy; and \WorkspaceNavigationPolicy\ for the workspace root. These policies collectively define the rules for parent, child, and sibling navigation, enabling consistent keyboard accessibility for all major Blockly components.
_packages/blockly/core/keyboard\_nav/navigation\policies · high confidence
Workspace comments now support keyboard navigation and ARIA accessibility
Workspace comments are now fully accessible via keyboard and screen readers. The comment UI components (top bar buttons, editor, and resize handle) implement the IFocusableNode interface, allowing users to tab through and interact with comments using standard keyboard controls. ARIA roles and labels are applied to the comment container, buttons, and text area to provide proper context for assistive technologies. Additionally, focus management ensures that the workspace scrolls into view when a comment is focused, and the delete button plays a sound and manages focus appropriately upon deletion.
packages/blockly/core/comments · high confidence
Workspace minimap plugin with keyboard navigation and focus region
The @blockly/workspace-minimap plugin now provides a miniature overview of your blocks that appears on top of the main workspace, helping you see how your code is organized. It includes a focus region that highlights your current viewport and supports keyboard accessibility: when the minimap is focused, arrow keys pan the main workspace (with a configurable pan step via setKeyboardPanStep). The plugin offers two modes—PositionedMinimap, which automatically sizes and places itself within the workspace layout, and Minimap, which allows custom CSS positioning.
packages/plugins/workspace-minimap · high confidence
Removals
Block Factory application removed
The Block Factory application, located in apps/blockfactory, has been removed. This change deletes the core JavaScript files (blocks.js, factory.js, preview.js) and HTML pages (index.html, preview.html) that comprised the tool, eliminating the ability to visually design and generate custom Blockly blocks and their code generators.
apps/blockfactory · high confidence
Graphing Calculator application removed
The Graphing Calculator app has been removed from the platform. The application files, including the user interface (index.html), styling (style.css), template (template.soy), and core logic (graph.js, blocks.js), have been deleted. Users will no longer be able to access or use the graphing calculator feature.
apps/graph · high confidence
Maze application removed from Blockly
The Maze application, including its blocks, logic, UI templates, and assets, has been deleted from the codebase. Users will no longer be able to access or play the Maze tutorial within Blockly.
apps/maze · high confidence
RTL demo removed
The Right-to-Left (RTL) demo page has been deleted from the demos directory. Users can no longer access this specific demonstration of Blockly's RTL capabilities via the previous URL.
demos/rtl · high confidence
Removal of generated Blockly localization files
The automatically generated JavaScript localization files for the Blockly Code app (including af.js, ar.js, arz.js, be-tarask.js, bg.js, bn.js, and br.js) have been deleted from the apps/code/generated directory. These files, which provided translated UI strings and interface templates for various languages, are no longer present in this location.
apps/code/generated · high confidence
Removal of generated Plane app localization files
The automatically generated JavaScript localization files for the Plane app (located in apps/plane/generated) have been removed. These files, which provided translated UI strings and rendered HTML templates for various languages (such as Arabic, Bengali, Breton, and Catalan), are no longer included in this location.
apps/plane/generated, apps/puzzle/generated · high confidence
Removal of generated localization files for Turtle Graphics
The automatically generated JavaScript localization files for the Turtle Graphics application (such as af.js, ar.js, be-tarask.js, bg.js, and bn.js) have been removed from the apps/turtle/generated directory. These files previously provided translated UI strings and block labels for various languages; their deletion means the application will no longer serve these specific language assets from this location.
apps/turtle/generated · high confidence
Removal of legacy App Engine backend services
The appengine directory's legacy backend components have been removed, including the redirect logic (index\_redirect.py, redirect.html), the user report submission handler (report.py), and the XML storage service (storage.py). This eliminates the server-side infrastructure previously used for handling URL redirects, storing user-generated code reports, and persisting XML block definitions via the old Google App Engine db API.
appengine · high confidence
Removal of legacy English message file
The legacy \msg/messages.js\ file, which previously provided English string definitions for Blockly blocks and UI elements using the \goog.provide\ system, has been deleted. This change removes the old JavaScript-based message source, indicating a migration to a different localization format (such as JSON) for managing user-facing text.
msg · high confidence
Removal of legacy JavaScript block generators
The JavaScript code generators for core block categories—colour, lists, logic, loops, math, procedures, text, and variables—have been removed from the \generators/javascript\ directory. This deletion eliminates the legacy \goog.provide\/\goog.require\ module system and the associated helper functions (such as \variableDB\\ and \definitions\\) previously used to generate JavaScript code for these blocks.
generators/javascript · high confidence
Removal of legacy JavaScript message files
The legacy JavaScript localization files for German (de), English (en, en\_us), Persian (fa), and Hungarian (hu) have been removed from the msg/js directory. These files, which previously provided string translations for Blockly blocks and UI elements, are no longer included in this location, indicating a shift in how language resources are managed or delivered.
msg/js · high confidence
Removal of legacy apps and shared application assets
The apps directory has been cleaned up by deleting the shared infrastructure and several sample applications. The common support files—\common.js\, \common.css\, \common.soy\, and the \index.html\ landing page—have been removed, eliminating the shared language packs, UI dialog templates, and navigation hub previously used by the apps. Additionally, the \prettify.js\ and \prettify.css\ syntax highlighting libraries, the \slider.js\ SVG control, and the \\_soy\ Closure Templates compiler utilities have been deleted. Specific application directories and files, including the Puzzle app, the Turtle Graphics contest page, and the Code app, have also been removed from this location.
apps · high confidence
Removal of legacy demos index page
The main demos index page (demos/index.html) has been removed. This page previously served as a directory listing for various Blockly integration examples, including fixed and resizable blockly, toolbox definition, RTL support, maximum block limits, JavaScript generation, and cloud storage. Users will no longer be able to access this specific landing page for these demos.
demos · high confidence
Removal of the Cloud Storage demo
The Cloud Storage demo page has been removed from the demos directory. Users can no longer access this specific example, which previously demonstrated saving and retrieving Blockly projects via App Engine.
demos/storage · high confidence
Removal of the Code application from the main apps directory
The Code application files (code.js, index.html, readonly.html, and template.soy) have been deleted from the apps/code directory. This change removes the interactive Blockly editor interface that allowed users to create programs using blocks and view the generated JavaScript or Python code, as well as the associated Soy templates and language strings for this feature.
apps/code · high confidence
Removal of the Plane Seat Calculator demo application
The Plane Seat Calculator demo application has been removed from the product. This change deletes the application's core files, including the HTML entry point, the JavaScript logic for the seat calculation and SVG rendering, the custom Blockly blocks for setting and retrieving seat counts, the CSS styles, and the Closure Templates (Soy) that defined the user interface and instructional text. Users will no longer have access to this specific interactive tutorial.
apps/plane · high confidence
Removal of the Puzzle application
The Puzzle application, which allowed users to match countries with their flags and cities using Blockly blocks, has been removed from the codebase. All associated source files, including the block definitions, application logic, templates, and styles, have been deleted as the app has moved to Blockly Games.
apps/puzzle · high confidence
Removed Maximum Block Limit demo
The Maximum Block Limit demo application has been removed from the demos directory. This demo previously demonstrated how to restrict the number of blocks in a Blockly workspace to a specific limit (e.g., 5 blocks) using the \maxBlocks\ configuration option.
demos/maxBlocks · high confidence
Removed Toolbox demo page
The demos/toolbox/index.html file has been deleted, removing the specific demo page that showcased a complex category structure for the Blockly toolbox.
demos/toolbox · high confidence
Removed fixed and generator demo pages
The 'Fixed Blockly' and 'Generating JavaScript' demo pages have been deleted from the demos directory. Users can no longer access these specific examples for injecting Blockly into fixed-size containers or generating and running JavaScript code directly from the workspace.
demos/generator · high confidence
Removed generated Maze localization files
The automatically generated JavaScript localization files for the Maze application (e.g., af.js, ar.js, bn.js) have been removed from the apps/maze/generated directory. These files, which previously provided translated UI strings and help text for various languages, are no longer included in this location.
apps/maze/generated · high confidence
Removed generated localization files for the Graphing Calculator app
The automatically generated JavaScript localization files (e.g., af.js, ar.js, de.js) for the Graphing Calculator app in apps/graph/generated have been deleted. These files previously provided translated UI strings and toolbox categories for various languages; their removal means the app will no longer load these specific language resources from this directory.
apps/graph/generated · high confidence
Removed iframe-based Blockly demo
The 'Iframe Blockly' demo, which previously demonstrated injecting Blockly into a resizable iframe element, has been removed from the demos directory. This eliminates the need for users to load Blockly within an iframe context for this specific example.
demos/iframe · high confidence
Removed legacy Python i18n build scripts
The i18n directory's legacy Python toolchain has been removed. This includes the deletion of \common.py\ (shared utilities), \create\_messages.py\ (JSON-to-JS generation), \dedup\_json.py\ (JSON deduplication), \js\_to\_json.py\ (JS-to-JSON extraction), \json\_to\_js.py\ (JSON-to-JS/Soy compilation), \status.py\ (translation status reporting), \tests.py\ (unit tests for i18n scripts), and \xliff\_to\_json.py\ (XLIFF-to-JSON conversion). These scripts are no longer available for generating or managing translation files.
i18n · high confidence
Removed legacy generator test suite files
Deleted the legacy generator test suite files in tests/generators, including the index.html runner and XML test definitions for colour, lists, logic, loops, and procedures. These files are no longer part of the active test infrastructure.
tests/generators · high confidence
Turtle Graphics application removed
The Turtle Graphics application has been removed from the platform. The source files for the application, including the user interface (index.html), styling (style.css), block definitions (blocks.js), and core logic (turtle.js), have been deleted. Users will no longer be able to access or use the Turtle Graphics tool.
apps/turtle · high confidence
Architecture
Refactored drag-and-drop logic into a modular strategy architecture
The core dragging logic in \packages/blockly/core/dragging\ has been restructured to use a strategy pattern, introducing dedicated \BlockDragStrategy\, \BubbleDragStrategy\, and \CommentDragStrategy\ classes to handle specific draggable types. This change centralizes drag lifecycle management in the \Dragger\ class while delegating type-specific behaviors—such as connection snapping for blocks, layer management for bubbles, and event firing for comments—to their respective strategies. This modularization improves code maintainability and isolates the complex logic for block movement, bubble positioning, and comment dragging.
packages/blockly/core/dragging · high confidence
Behavioural changes
2234 commits (500 fixes) modifying core
A change to existing behaviour in core — 2234 commits (500 fixs), 37 files.
core · medium confidence · unverified
7 commits (1 fix) modifying media
A change to existing behaviour in media — 7 commits (1 fix), 12 files.
media · medium confidence · unverified
Block definitions migrated from JavaScript to JSON format
The block definitions in the \blocks/\ directory (including colour, lists, logic, loops, math, procedures, text, and variables) have been removed from their previous JavaScript implementation. This change represents the migration of these core block definitions to a JSON format, which is the new standard for defining blocks in the library.
blocks · high confidence
Blockly v13.3.0 release with accessibility, navigation, and API improvements
This release introduces several user-facing enhancements and fixes. Users can now use optional keyboard shortcuts to navigate the toolbox and flyout, and to scroll the workspace. The workspace search feature has received improved UI and full screen reader support. Custom tooltips can now be unset. Several bugs were fixed, including issues with block movement during insertion, drag-and-drop interactions, undo stack corruption, and keyboard shortcut idempotency. Accessibility was also improved by restoring focus on toast dismiss and ensuring field corners remain within caps. The release also includes API documentation generation via TypeDoc and relaxed access restrictions on BlockDragStrategy.
packages/blockly · high confidence
Build and deployment scripts migrated from Gulp to Node.js
The build tooling in the scripts directory has been replaced with standalone Node.js modules, removing the previous Gulp dependency. This change introduces new scripts for compiling TypeScript (tsc.mjs), generating language files (langfiles.mjs), packaging the npm distribution (package.mjs), and updating the GitHub Pages site (update\_github\_pages.mjs). It also adds specific utilities for cleaning the workspace (clean.mjs), preparing the advanced playground for deployment (prepare\_advanced\_playground.mjs), and bundling Mocha tests (prepare\_mocha\_bundle.mjs).
packages/blockly/scripts · high confidence
Built-in blocks now include custom ARIA labels for improved accessibility
The built-in block definitions in the \packages/blockly/blocks\ module have been updated to include \ariaLabelText\ properties on input values and \aria\ strings on dropdown options. This change ensures that screen readers receive specific, descriptive labels for block inputs (such as the list item in \lists\_repeat\ or the condition in \controls\_for\) and dropdown choices (such as the operator in \logic\_compare\ or the math function in \math\_single\), rather than relying on generic or missing descriptions.
packages/blockly/blocks · high confidence
Dev-tools plugin migrated to monorepo with Blockly v13 support
The @blockly/dev-tools plugin has been moved into the monorepo structure and updated to depend on Blockly v13, which is a breaking change from previous versions. This update includes the full plugin source code, test helpers, and documentation, ensuring compatibility with the latest Blockly core while maintaining existing debugging features like the playground, debug renderer, and field test block generation.
packages/plugins/dev-tools · high confidence
Migrate Blockly core interfaces to TypeScript
The \packages/blockly/core/interfaces\ directory has been converted from the legacy Closure Library module system to native TypeScript interfaces. This change replaces the previous \goog.module\-based definitions with standard ES module exports, providing a cleaner, type-safe contract for core components such as blocks, flyouts, drag-and-drop operations, and keyboard navigation.
packages/blockly/core/interfaces · high confidence
New Gulp build and deployment task scripts for Blockly
The build system now includes new Gulp task scripts in the gulpfiles directory to manage compilation and deployment. The new build\_tasks.mjs script defines the compilation pipeline, including TypeScript output, Closure Compiler chunking for core and language generators, and source map generation. The appengine\_tasks.mjs script handles the preparation and deployment of Blockly demos to Google App Engine, including copying static assets, built files, and playground dependencies. The config.mjs script centralizes build directory paths for compiled output, typings, language files, and release artifacts.
packages/blockly/scripts/gulpfiles · high confidence
New modular serialization system for blocks, variables, and comments
The workspace serialization logic has been refactored into a new, modular system located in \packages/blockly/core/serialization\. This change introduces dedicated serializers for blocks (\blocks.ts\), variables (\variables.ts\), procedures (\procedures.ts\), and workspace comments (\workspace\_comments.ts\), replacing the previous monolithic implementation. The system uses a registry (\registry.ts\) to manage these serializers and enforces a specific deserialization priority order (\priorities.ts\) to ensure dependencies (like variables) are loaded before dependent elements (like blocks). This modular approach allows for more granular control over the save/load process and improves the maintainability of the serialization code.
packages/blockly/core/serialization · high confidence
Python code generators migrated from JavaScript to TypeScript
The Python code generators (colour, lists, logic, loops, math, procedures, text, and variables) have been converted from JavaScript (.js) to TypeScript (.ts). This migration updates the implementation language of the generators while preserving the existing code generation logic for Blockly blocks.
generators/python · high confidence
Redesigned Zelos renderer with dynamic output shapes and improved RTL support
The Zelos renderer has been refactored to support dynamic output connection shapes (hexagonal, round, square) and to fix visual bugs in Right-to-Left (RTL) layouts. Users will see blocks with output connections rendered with specific geometric shapes rather than generic notches, and tall field corners are now correctly contained within round caps. Additionally, focus rings and selected path transformations are now properly mirrored in RTL mode, and the renderer handles Safari-specific layout calculations more accurately to prevent inaccurate flyout item counts.
packages/blockly/core/renderers/zelos · high confidence
Refactor block rendering measurables to TypeScript
The block rendering measurables in \packages/blockly/core/renderers/measurables\ have been migrated from JavaScript to TypeScript. This change introduces a new \Measurable\ base class and strongly-typed subclasses for all block components (such as \Field\, \Icon\, \Connection\, \Row\, and various input types), replacing the previous \goog.module\-based structure with modern ES module imports and exports. While the core rendering logic remains functionally equivalent, this refactor improves type safety and code maintainability for the block layout engine.
packages/blockly/core/renderers/measurables · high confidence
Refactored block icons into a modular, type-safe system with improved accessibility
The icon system in the core workspace has been restructured to use a dedicated registry and distinct TypeScript classes for Comment, Warning, and Mutator icons, replacing the previous monolithic implementation. This change introduces a strict type system via IconType to prevent duplicate icon registrations and ensures icons are properly serialized. For users, this results in more robust block metadata handling and improved accessibility, as the new icon components now integrate with the focus manager and provide proper ARIA labels and keyboard navigation support for screen readers.
packages/blockly/core/icons · high confidence
Refactored clipboard system with dedicated paster implementations
The clipboard logic in the core package has been restructured to use a registry-based system for pasting. New files introduce \BlockPaster\ and \WorkspaceCommentPaster\ classes that handle the specific logic for pasting blocks and workspace comments, including moving them to non-conflicting positions and managing focus. A new \registry.ts\ file provides the mechanism to register and unregister these paster types, separating the pasting behavior from the general clipboard interface.
packages/blockly/core/clipboard · high confidence
Refactored input classes and added custom ARIA label support
The input system in \packages/blockly/core/inputs\ has been refactored to use distinct classes for each input type (\ValueInput\, \StatementInput\, \DummyInput\, and the new \EndRowInput\), replacing the previous single-class approach. This change introduces support for custom ARIA labels on inputs via a new \AriaLabelProvider\ type and \setAriaLabelProvider\ method on the \Input\ base class, allowing developers to define specific accessibility strings for inputs. Additionally, an \Align\ enum has been added to standardize input field alignment options (Left, Centre, Right).
packages/blockly/core/inputs · high confidence
Release v13.3.0
This release introduces several new capabilities and fixes. Key features include optional keyboard shortcuts for toolbox and flyout navigation, the ability to unset custom tooltips, and improved screen reader support and UI for workspace search. Bug fixes address unexpected block movement during insertion, rendering issues that could clobber the undo stack, and various keyboard shortcut idempotency problems.
(repo-wide) · high confidence
Removal of legacy JavaScript and Python generator files
The legacy \generators/javascript.js\ and \generators/python.js\ files have been removed from the codebase. These files previously provided the core logic for generating JavaScript and Python code using the older \goog.provide\/\goog.require\ module system. Their deletion indicates a migration away from this legacy module format, likely as part of a broader effort to modernize the generator architecture (e.g., to ES Modules or a new class-based structure), which will require users to update their build configurations or import paths to use the new generator implementations.
generators · high confidence
Restructured event system with consolidated naming and improved undo handling
The event system in \packages/blockly/core/events\ has been reorganized to use explicit, prefixed event names (e.g., \BlockCreate\, \BlockDelete\, \BlockChange\) replacing older generic aliases like \Create\, \Delete\, and \Change\, which are now marked as deprecated. This change consolidates event types for better clarity and maintainability. Additionally, the \BlockChange\ event now supports a \disabledReason\ property to track why a block was disabled, and the \BlockCreate\ and \BlockDelete\ events have been updated to handle shadow blocks more robustly by preventing undo operations for shadow block changes, ensuring that undo/redo history remains consistent with user actions.
packages/blockly/core/events · high confidence
Shadow Block Converter plugin restructured and upgraded to Blockly v13
The @blockly/shadow-block-converter plugin has been moved into the monorepo and upgraded to support Blockly v13. This update introduces a new \BlockShadowStateChange\ event to better manage undo/redo history for shadow block conversions, ensuring that the original shadow state is preserved and correctly restored when users edit or revert changes. The plugin now exports a \shadowBlockConversionChangeListener\ that automatically converts shadow blocks to regular blocks upon editing, allowing users to move or delete them while maintaining the persistent default value behavior.
packages/plugins/typed-variable-modal · high confidence
Shareable procedure blocks now use observable data models for undo/redo and workspace sharing
The @blockly/block-shareable-procedures plugin has been updated to use ObservableProcedureModel and ObservableParameterModel instead of the default Blockly procedure models. This change enables procedure definitions and calls to be shared across multiple workspaces and supports full undo/redo history for procedure creation, deletion, renaming, and parameter changes. Users upgrading to this version will see that procedure blocks now reference explicit backing data models, allowing for more robust manipulation and synchronization of procedures between different editor instances.
packages/plugins/block-shareable-procedures · high confidence
Theme plugins migrated to Blockly v13
The theme plugins (dark, deuteranopia, highcontrast, and modern) have been updated to depend on Blockly v13. This is a breaking change that requires users to upgrade their Blockly core dependency to version 13 to use these themes.
(repo-wide) · high confidence
Toolbox search now indexes and matches all block types
The toolbox search plugin now indexes and searches across all blocks available in the toolbox, including those defined in custom categories (such as Variables and Functions). Previously, the search might have been limited to explicitly listed blocks; now, the \BlockSearcher\ recursively traverses the entire toolbox definition to build its index, ensuring that dynamically generated or custom-category blocks are also findable via the search field.
packages/plugins/toolbox-search · high confidence
Updated @blockly/block-test plugin for Blockly v13 compatibility
The @blockly/block-test plugin has been updated to support Blockly v13, addressing breaking changes from the previous major version. This update includes a fix for the test plugin's behavior under the new Blockly core, ensuring that the provided test blocks (covering alignment, connections, fields, and drag behaviors) function correctly with the latest library version.
(repo-wide) · high confidence
Updated Blockly localization messages
The JSON message files in the \packages/blockly/msg/json\ directory have been updated with new translations and corrections from Translatewiki. This ensures that Blockly interface strings, block labels, tooltips, and accessibility announcements are correctly localized for supported languages, including new entries for languages such as Abkhaz (ab) and Acehnese (ace).
packages/blockly/msg · high confidence
Updated package entrypoints and build templates for Blockly
The package distribution now uses new entrypoints and build templates that change how the library is loaded. The main \index.js\ entrypoint no longer automatically loads generators (such as the JavaScript generator); users must now explicitly import generators (e.g., from \blockly/javascript\) if they need them, as they no longer define global properties like \Blockly.JavaScript\ upon loading. A new \core-node.js\ entrypoint is provided for Node.js environments, which uses \jsdom\ to inject XML-handling dependencies. Additionally, the package includes updated UMD build templates (\umd.template\ and \umd-msg.template\) and documentation (\README.md\) reflecting these import and usage changes.
packages/blockly/scripts/package · high confidence
Updated workspace UI assets
The media assets for the Blockly workspace have been refreshed with new SVG icons for the delete, dropdown, foldout, and resize-handle controls, alongside a redesigned sprites sheet that now includes updated styling for selection states, checkmarks, trash icons, and zoom controls.
packages/blockly/media · high confidence
Workspace Search plugin adds screen reader support and UI improvements
The workspace search plugin now includes accessibility enhancements for screen reader users, such as ARIA roles and accessible labels on navigation buttons, alongside general UI improvements to the search bar interface.
packages/plugins/workspace-search · high confidence
Fixes
Fix keyboard navigation between toolbox, flyout, and workspace
Resolves issues where keyboard navigation would fail or behave incorrectly when moving focus between the toolbox, flyout, and main workspace, particularly across different layout positions (top, bottom, left, right) and in Right-to-Left (RTL) modes. The update introduces dedicated navigators for the toolbox and flyout that correctly handle directional arrows (in/out/next/previous) based on the physical screen position of these panels, ensuring smooth and error-free traversal of all UI elements.
_packages/blockly/core/keyboard\nav/navigators · high confidence
Test coverage
Added TypeScript compilation tests for Blockly API surface; Added advanced compilation test suite for Blockly; Added generator test suites and golden outputs for Blockly; Added multi-playground and updated playground test pages; Added test infrastructure for themes, XML validation, and migration renamings; Added test infrastructure scripts for metadata validation and CI browser testing; Added test playgrounds for shadow DOM and advanced features; Mocha test suite now runs headless under Node.js; New browser-based functional tests for Blockly; Removal of legacy Closure-based test suite and playground.
Written by watchdog.canine.dev from the codebase's own history, inside the signed delivery this page is composed from.
How this codebase got here
Score
- CAI 41 → 44 (+2.5)
- Rubric changed (rubric-2026.09.12 → rubric-2026.09.18) — scores are not directly comparable.
Lenses
- Code Health 64 → 65 (+1.1)
- Architecture 56 → 63 (+6.2)
- Maturity 68 → 68 (+0.0)
- Readiness 53 → 40 (-12.4)
- Security 32 → 41 (+8.4)
- Accessibility 40 → 40 (+0.1)
- Performance 60 (new)
Resolved (27)
- Dependency hygiene PARTLY measured — npm pinning read, dependency currency not (no pnpm-resolved versions to grade)
- Documentation: no installation or build instructions (README.md)
- High CVE: [GHSA redacted] (package-lock.json)
- Hotspot: packages/blockly/core/block.ts (packages/blockly/core/block.ts)
- Hotspot: packages/blockly/core/block_svg.ts (packages/blockly/core/block_svg.ts)
- Hotspot: packages/blockly/core/events/utils.ts (packages/blockly/core/events/utils.ts)
- Hotspot: packages/blockly/core/field.ts (packages/blockly/core/field.ts)
- Hotspot: packages/blockly/core/field_dropdown.ts (packages/blockly/core/field_dropdown.ts)
- Hotspot: packages/blockly/core/field_input.ts (packages/blockly/core/field_input.ts)
- Hotspot: packages/blockly/core/generator.ts (packages/blockly/core/generator.ts)
- Hotspot: packages/blockly/core/renderers/zelos/info.ts (packages/blockly/core/renderers/zelos/info.ts)
- Hotspot: packages/blockly/core/shortcut_items.ts (packages/blockly/core/shortcut_items.ts)
- Hotspot: packages/blockly/core/workspace_svg.ts (packages/blockly/core/workspace_svg.ts)
- Hotspot: packages/blockly/core/xml.ts (packages/blockly/core/xml.ts)
- Hotspot: packages/blockly/tests/mocha/test_helpers/svg_layout_stubs.js (packages/blockly/tests/mocha/test_helpers/svg_layout_stubs.js)
- Hotspot: packages/plugins/field-bitmap/src/field-bitmap.ts (packages/plugins/field-bitmap/src/field-bitmap.ts)
- Hotspot: packages/plugins/field-grid-dropdown/src/grid.ts (packages/plugins/field-grid-dropdown/src/grid.ts)
- Hotspot: packages/plugins/field-multilineinput/src/field_multilineinput.ts (packages/plugins/field-multilineinput/src/field_multilineinput.ts)
- Hotspot: packages/plugins/workspace-backpack/src/backpack.ts (packages/plugins/workspace-backpack/src/backpack.ts)
- Medium CVE: [GHSA redacted] (package-lock.json)
- …and 7 more
New (30)
- Dependency hygiene PARTLY measured — Python dependencies read, no exact pin to grade for currency
- Documentation: no architecture or design documentation (packages/plugins/field-colour-hsv-sliders/README.md)
- Documentation: no project overview (packages/plugins/field-slider/README.md)
- Duplicated block (7 lines × 2) (packages/blockly/scripts/i18n/js_to_json.py)
- High CVE: [GHSA redacted] (package-lock.json)
- High CVE: [GHSA redacted] (package-lock.json)
- High CVE: [GHSA redacted] (package-lock.json)
- High CVE: [GHSA redacted] (package-lock.json)
- High CVE: [GHSA redacted] (package-lock.json)
- High CVE: [GHSA redacted] (package-lock.json)
- High CVE: [GHSA redacted] (package-lock.json)
- High CVE: [GHSA redacted] (package-lock.json)
- High CVE: [GHSA redacted] (package-lock.json)
- Low CVE: [GHSA redacted] (package-lock.json)
- Low cohesion: Block (LCOM4 5) (packages/blockly/core/block.ts)
- Low cohesion: BlockSuggestor (LCOM4 4) (packages/plugins/suggested-blocks/src/index.js)
- Low cohesion: CommentEditor (LCOM4 4) (packages/blockly/core/comments/comment_editor.ts)
- Low cohesion: ConstantProvider (LCOM4 5) (packages/blockly/core/renderers/zelos/constants.ts)
- Low cohesion: TypedVariableModal (LCOM4 4) (packages/plugins/typed-variable-modal/src/TypedVariableModal.js)
- Low cohesion: WorkspaceComment (LCOM4 6) (packages/blockly/core/comments/workspace_comment.ts)
- …and 10 more
Changes since last survey
- 36 commits — 28 feature/other, 8 fixes
By area
- packages/blockly — 16 commits
- (root) — 13 commits
- packages/plugins — 4 commits
- packages/docs — 3 commits
Notable commits
- fix: chore: fix flaky tests (#10545)
- fix: fix: Don't label image fields as "empty" when alt text not set (#10502)
- fix: fix: Fix bugs that caused inaccurate counts of flyout items with Zelos in Safari (#10500)
- fix: fix: Fix positioning of dropdown/widgetdivs in a bordered injection div (#10509)
- fix: fix: Improve keyboard-driven display of workspace context menus (#10505)
- fix: fix: Improve the display of comment focus rings (#10533)
- fix: fix: Make all toolbox blocks searchable (#10508)
- fix: fix: Restore auto-close behavior for standalone flyouts (#10506)
- change: Localisation updates from https://translatewiki.net. (#10523)
- change: Localisation updates from https://translatewiki.net. (#10539)
- change: Localisation updates from https://translatewiki.net. (#10549)
- change: chore(deps): Update field-colour dependency to latest version (#10529)
- change: chore(deps): bump css-loader from 7.1.4 to 7.1.5 (#10512)
- change: chore(deps): bump docusaurus-plugin-typedoc from 1.4.2 to 1.4.3 (#10538)
- change: chore(deps): bump fs-extra from 11.4.0 to 11.4.1 (#10537)
- change: chore(deps): bump ip-address (#10543)
- change: chore(deps): bump puppeteer-core from 25.9.0 to 25.11.0 (#10514)
- change: chore(deps): bump qs in the npm_and_yarn group across 1 directory (#10530)
- change: chore(deps): bump the npm_and_yarn group across 1 directory with 3 updates (#10542)
- change: chore(deps): bump the nx group across 1 directory with 2 updates (#10511)
- …and 16 more
Architecture
- Unchanged — 0 containers · 1 contexts · 0 edges
Written by watchdog.canine.dev from the codebase's own history, inside the signed delivery this page is composed from.
Survey your own repository
RaspberryPiFoundation/blockly was measured the same way every project in this corpus was: the same rubric, at a pinned commit, with the result published in full. Point a surveyor at a repository you know and see whether you agree with it.
About this page
- The score is its most recent published measurement, taken on 1 October 2026 at a pinned commit. It is not a live figure and does not change until the project is measured again.
- Measured at commit 5beb8f12018a00caaf72f5e8f1d40801b689b609 — the exact code this score is about.
- Scored under rubric-2026.09.18 — the same rubric and the same method as every other entry in this index.
- Measured by watchdog.canine.dev using codehealth-analyzer preprod-e569280dd5e2.