## The basics
- [x] I [validated my changes](https://developers.google.com/blockly/guides/contribute/core#making_and_verifying_a_change)
## The details
### Resolves
Fixes https://github.com/google/blockly-keyboard-experimentation/issues/578
Fixes part of #8915
### Proposed Changes
Ensures fields update focus to the next field when tabbing between field editors. The old behavior can be observed in [#578](https://github.com/google/blockly-keyboard-experimentation/issues/578) and the new behavior can be observed here:
[Screen recording 2025-06-25 1.39.28 PM.webm](https://github.com/user-attachments/assets/e00fcb55-5c20-4d5c-81a8-be9049cc0d7e)
### Reason for Changes
Having focus reset back to the original field editor that was opened is an unexpected experience for users. This approach is better.
Note that there are some separate changes added here, as well:
- Connections and fields now check if their block IDs contain their indicator prefixes since this will all-but-guarantee focus breaks for those nodes. This is an excellent example of why #9171 is needed.
- Some minor naming updates for `FieldInput`: it was incorrectly implying that key events are sent for changes to the `input` element used by the field editor, but they are actually `InputEvent`s per https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event.
### Test Coverage
New tests were added for field editing in general (since this seems to be missing), including tabbing support to ensure the fixes originally introduced in #9049.
One new test has been added specifically for verifying that focus updates with tabbing. This has been verified to fail with the fix removed (as have all tabbing tests with the tabbing code from #9049 removed).
Some specific notes for the test changes:
- There's a slight test dependency inversion happening here. `FieldInput` is being tested with a specific `FieldNumber` class via real block loading. This isn't ideal, but it seems fine given the circumstances (otherwise a lot of extra setup would be necessary for the tests).
- The workspace actually needs to be made visible during tests in order for focus to work correctly (though it's reset at the end of each test, but this may cause some flickering while the tests are running).
- It's the case that a bunch of tests were actually setting up blocks incorrectly (i.e. not defining a must-have `id` property which caused some issues with the new field and connection ID validation checks). These tests have been corrected, but it's worth noting that the blocks are likely still technically wrong since they are not conforming to their TypeScript contracts.
- Similar to the previous point, one test was incorrectly setting the first ID to be returned by the ID generator as `undefined` since (presumably due to a copy-and-paste error when the test was introduced) it was referencing a `TEST_BLOCK_ID` property that hadn't been defined for that test suite. This has been corrected as, without it, there are failures due to the new validation checks.
- For the connection database checks, a new ID is generated instead of fixing the block ID to ensure that it's always unique even if called multiple times (otherwise a block ID would need to be piped through from the calling tests, or an invalid situation would need to be introduced where multiple blocks shared an ID; the former seemed unnecessary and the latter seemed nonideal).
- There are distinct Geras/Zelos tests to validate the case where a full-block field should have its parent block, rather than the field itself, focused on tabbing. See this conversation for more context: https://github.com/google/blockly/pull/9173#discussion_r2172921455.
### Documentation
No documentation changes should be needed here.
### Additional Information
Nothing to add.
* chore(deps): Add pretter-plugin-organize-imports
* chore: Remove insignificant blank lines in import sections
Since prettier-plugin-organize-imports sorts imports within
sections separated by blank lines, but preserves the section
divisions, remove any blank lines that are not dividing imports
into meaningful sections.
Do not remove blank lines separating side-effect-only imports
from main imports.
* chore: Remove unneded eslint-disable directives
* chore: Organise imports
* chore(deps): Bump chai from 4.3.10 to 5.1.1
Bumps [chai](https://github.com/chaijs/chai) from 4.3.10 to 5.1.1.
- [Release notes](https://github.com/chaijs/chai/releases)
- [Changelog](https://github.com/chaijs/chai/blob/main/History.md)
- [Commits](https://github.com/chaijs/chai/compare/v4.3.10...v5.1.1)
---
updated-dependencies:
- dependency-name: chai
dependency-type: direct:development
update-type: version-update:semver-major
...
Signed-off-by: dependabot[bot] <support@github.com>
* fix(tests): Migrate all usage of chai to ESM (#8216)
* fix(tests): Migrate node tests from CJS to ESM
This allows us to import (rather than require) chai, fixing failures
caused by that package dropping suppport for CJS in chai v5.0.0.
* fix(tests): Have mocha tests directly import chai
Previously they relied on obtaining it from the global scope, but it's
better if imports are explicit.
* fix(tests): Remove broken load of chai as script
Chai v5.0.0 no longer supports being loaded as a script, so this did
nothing but emit an syntax error message on the console.
* fix(tests): Migrate browser tests from CJS to ESM
This allows us to import (rather than require) chai, fixing failures
caused by chai no longer supporting CJS.
* chore(tests): format
---------
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Christopher Allen <cpcallen+git@google.com>
* fix(build): Have buildShims clean up up after itself
We need to create a build/package.json file to allow node.js to
load build/src/core/blockly.js and the other chunk entry points
as ES modules (it forcibly assumes .js means CJS even if one is
trying to import, unless package.json says {"type": "module"}),
but this interferes with scripts/migration/js2ts doing a
require('build/deps.js'), which is _not_ an ES module.
Specific error message was:
/Users/cpcallen/src/blockly/scripts/migration/js2ts:56
require(path.resolve(__dirname, '../../build/deps.js'));
^
Error [ERR_REQUIRE_ESM]: require() of ES Module
/Users/cpcallen/src/blockly/build/deps.js from /Users/cpcallen/src/blockly/scripts/migration/js2ts
not supported.
deps.js is treated as an ES module file as it is a .js file whose
nearest parent package.json contains "type": "module" which
declares all .js files in that package scope as ES modules.
Instead rename deps.js to end in .cjs, change the requiring code
to use dynamic import() which is available in all CommonJS
modules, or change "type": "module" to "type": "commonjs" in
/Users/cpcallen/src/blockly/build/package.json to treat all .js
files as CommonJS (using .mjs for all ES modules instead).
at Object.<anonymous> (/Users/cpcallen/src/blockly/scripts/migration/js2ts:56:1) {
code: 'ERR_REQUIRE_ESM'
}
* chore(tests): Reorder to put interesting script nearer top of file
* chore(tests): Add missing imports of closure/goog/goog.js
These modules were depending on being loaded via the
debug module loader, which cannot be used without first loading
base.js as a script, and thereby defining goog.declareModuleId
as a side effect—but if they are to be loaded via direct import
statements then they need to actually import their own
dependencies.
This is a temporary measure as soon the goog.declareMouleId
calls can themselves be deleted.
* refactor(tests): Use import instead of bootstrap to load Blockly
* chores(build): Stop generating deps.mocha.js
This file was only needed by tests/mocha/index.html's use of
the debug module loader (via bootstrap.js), which has now been
removed.
* chore(tests): Remove unneeded goog.declareModuleId calls
These were only needed because these modules were previously
being loaded by goog.require and/or goog.bootstrap.
* chores(tests): Remove dead code
We are fully committed to proper modules now.
* chore: change goog.module to goog.declareModuleId
* chore: change test helper exports to esmod exports
* chore: change test helpers to use esmodule imports
* chore: convert imports of test helpers to esmodule imports
* chore: convert other imports in tests to esm imports
* fix: make imports use built files
* chore: add blockly imports to a bunch of tests
* fix: reference Blockly.Blocks instead of Blocks'
* fix: properly import generators
* chore: fix lint
* chore: cleanup from rebase
* chore: cleanup from rebase
* chore: fix blocks tests
* fix: Fix errors under strict compilation.
* fix: Fix tests that referenced properties converted to data attributes.
* fix: Incorporate feedback on resolving compiler errors.
* refactor: Revert changes to skew and translate attributes.
* refactor: Introduce LegacyContextMenuOption type to correspond to documented fields.
* refactor: Introduce PathLeftShape and PathDownShape vs casting to PuzzleTab/Notch.
* chore: Added nullability modifiers to type annotations.
* refactor: Export FlyoutItem directly.
* chore: clang-format renderers/zelos/drawer.js.
* fix: move core test helpers into new directory
* fix: add test helpers to core and convert to goog modules
* fix: change tests to use local helpers
* fix: change local tests to use chai asserts
* fix: skip field tests in serializer b/c test blocks are unavailable
* fix: rename some helper files
* fix: rename some helper modules
* fix: split block helpers into code gen and serialization
* fix: split block defs into new helper file
* fix: split warning helpers into new file
* fix: split user input helpers into new file
* fix: split event helpers into a new file
* fix: split variable helper into new file
* fix: move remaining test helpers to new setup-teardown file
* fix: rename setup and teardown module
* fix: cleanup from rebase
* fix: undo accidental rename
* fix: lint?
* fix: bad toolbox definitions namespace
* fix: fixup warning helpers
* fix: remove inclusion of dev-tools in mocha tests
* move to modules, but break mocha
* fix: run mocha as a module
* fix: lint
* Upgrade field angle to use new serialization
* Upgrade field checkbox to use new serialization
* Upgrade field colour to use new serialization
* Upgrade field dropdown to use new serialization
* Upgrade serializable label field to use new serialization
* Upgrade field multiline input to use new serialization
* Upgrade field number to use new serialization
* Upgrade field text input to use new serialization
* Upgrade variable field to use new serialization
* Fix type casts
* Feedback from PR
* Switch to use getValue()
* Migrate core/blockly.js to ES6 const/let
* Migrate core/blockly.js to goog.module
* Migrate core/blockly.js to named requires
* clang-format core/blockly.js
* Consolidate accessors in core/blockly.js
* Use goog.module in mocha tests
* Fix compiler warnings
* Make test helpers a module
* Name test modules Blockly.test.*
This is to be more consistent with how non-test modules are named.
Also remove top-level goog.require of TestHelpers (now
Blockly.test.helpers) since requiring a side-effect-less module does
nothing.
* Convert block_test.js and comment_test.js to goog.module syntax
* Address PR comments
* Goog modulify tests
* Goog modulify toolbox helpers
* Fixes imports and moves common tests from workspace_test.js to a helper file.
* Update test deps after rebase
Co-authored-by: Christopher Allen <cpcallen+git@google.com>
* Migrate core/widgetdiv.js to ES6 const/let
* Migrate core/widgetdiv.js to goog.module
* Migrate core/widgetdiv.js to named requires
* clang-format core/widgetdiv.js
* Mark WidgetDiv.DIV as deprecated and refactor callers to use setters/getters
* Fix deprecation date
* Refactor tests to make setDiv() in core/widgetdiv.js test-only
* Fix type annotations for WidgetDiv.DIV and move test cleanup into sharedTestTeardown
* Update logic for field default values.
* Fix bugs
* Use contant for default value.
* Fix FieldColour
* Update field number tests.
* Update field angle test.
* Minor update.
* Update field checkbox test.
* Undo enabling logging
* Remove only.
* Update field colour test.
* Update invalid test cases for field colour
* Update field label tests
* Update field textinput test.
* Minor cleanup
* Make lint happy.
* Google changed from an Inc to an LLC.
This happened back in 2017 but we didn’t notice. Officially we should update files from Inc to LLC when they are changed as part of regular edits, but this is a nightmare to remember for the next decade.
* Remove project description/titles from licenses
This is no longer part of Google’s header requirements. Our existing descriptions were useless (“Visual Blocks Editor”) or grossly obselete (“Visual Blocks Language”).
* License no longer requires URL.
* Fix license regexps.
Null is explicitly disallowed in most field constructors. Thus the random results of passing null are undefined and may change. These changes should not be tested against.
Exceptions: Variable and serializable lable fields acually do take null.
This commit is due to the upcoming parseInt->Number commit which happens to change how null behaves.
Also added missing ‘empty’ test for checkboxes.
* Added field value tests.
* Fixed field image src param.
* Fixed falsy values with label fields.
* Fixed falsy values with text input fields.
* Fixed some angle field tests.
* Fixed other text input when editing tests.
* Fixed colour tests.
* Cleaned up some number and variable field tests.
* Added angle field > 360 degrees tests.
* Fixed variable validator tests.
* Split setValue tests into sub-suites.
* Fixed angle >360 tests
* Changed var declarations to property declarations.
