Commit Graph

629 Commits

Author SHA1 Message Date
Ben Henning
e34a9690ed fix: Ensure selection stays when dragging blocks (#9034)
## The basics

- [x] I [validated my changes](https://developers.google.com/blockly/guides/contribute/core#making_and_verifying_a_change)

## The details
### Resolves

Fixes #9027

### Proposed Changes

Ensure that a block being dragged is properly focused mid-drag.

### Reason for Changes

Focus seems to be lost due to the block being moved to the drag layer, so re-focusing the block ensures that it remains both actively focused and selected while dragging.

The regression was likely caused when block selection was moved to be fully synced based on active focus.

### Test Coverage

This has been manually verified in Core's simple playground. At the time of the PR being opened, this couldn't be tested in the test environment for the experimental keyboard navigation plugin since there's a navigation connection issue there that needs to be resolved to test movement.

It would be helpful to add a new test case for the underlying problem (i.e. ensuring that the block holds focus mid-drag) as part of resolving #8915.

### Documentation

No new documentation should need to be added.

### Additional Information

This was found during the development of https://github.com/google/blockly-keyboard-experimentation/pull/511.
2025-05-13 14:37:58 -07:00
Rachel Fenichel
bb76d6e12c fix!: remove MarkerSvg and uses (#8991)
* fix: delete MarkerSvg (marker drawer)

* fix: delete marker and cursor SVG elements

* chore: format

* chore: lint
2025-05-07 09:28:51 -07:00
Ben Henning
0cbcc3144a feat: Make connections focusable (#8928)
## The basics

- [x] I [validated my changes](https://developers.google.com/blockly/guides/contribute/core#making_and_verifying_a_change)

## The details
### Resolves

Fixes #8930
Fixes part of #8771

### Proposed Changes

This PR introduces support for connections to be focusable (and thus navigable with keyboard navigation when paired with downstream changes to `LineCursor` and the keyboard navigation plugin). This is a largely isolated change in how it fundamentally works:
- `RenderedConnection` has been updated to be an `IFocusableNode` using a new unique ID maintained by `Connection` and automatically enabling/disabling the connection highlight based on whether it's focused (per keyboard navigation).
- The way that rendering works here has changed: rather than recreating the connection's highlight SVG each time, it's only created once and updated thereafter to ensure that it correctly fits block resizes or movements. Visibility of the highlight is controlled entirely through display visibility and can now be done synchronously (which was a requirement for focusability as only displayed elements can be focused).
- This employs the same type of ID schema strategy as fields in #8923.

### Reason for Changes

This is part of an ongoing effort to ensure key components of Blockly are focusable so that they can be keyboard-navigable (with other needed changes yet both in Core Blockly and the keyboard navigation plugin).

### Test Coverage

No new tests have been added. It's certainly possible to add unit tests for the focusable configurations being introduced in this PR, but it may not be highly beneficial. It's largely assumed that the individual implementations should work due to a highly tested FocusManager, and it may be the case that the interactions of the components working together is far more important to verify (that is, the end user flows). The latter is planned to be tackled as part of #8915.

### Documentation

No documentation changes should be needed here.

### Additional Information

This includes changes that have been pulled from #8875.
2025-04-30 16:39:03 -07:00
Ben Henning
d82983f2c6 feat: Make WorkspaceSvg and BlockSvg focusable (roll forward) (#8938)
_Note: This is a roll forward of #8916 that was reverted in #8933. See Additional Information below._

## The basics

- [x] I [validated my changes](https://developers.google.com/blockly/guides/contribute/core#making_and_verifying_a_change)

## The details
### Resolves

Fixes #8913
Fixes #8914
Fixes part of #8771

### Proposed Changes

This updates `WorkspaceSvg` and `BlockSvg` to be focusable, that is, it makes the workspace a `IFocusableTree` and blocks `IFocusableNode`s.

Some important details:
- While this introduces focusable tree support for `Workspace` it doesn't include two other components that are obviously needed by the keyboard navigation plugin's playground: fields and connections. These will be introduced in subsequent PRs.
- Blocks are set up to automatically synchronize their selection state with their focus state. This will eventually help to replace `LineCursor`'s responsibility for managing selection state itself.
- The tabindex property for the workspace and its ARIA label have been moved down to the `.blocklyWorkspace` element itself rather than its wrapper. This helps address some tab stop issues that are already addressed in the plugin (via monkey patches), but also to ensure that the workspace's main SVG group interacts correctly with `FocusManager`.
- `WorkspaceSvg` is being initially set up to default to its first top block when being focused for the first time. This is to match parity with the keyboard navigation plugin, however the latter also has functionality for defaulting to a position when no blocks are present. It's not clear how to actually support this under the new focus-based system (without adding an ephemeral element on which to focus), or if it's even necessary (since the workspace root can hold focus).
- `css.ts` was updated to remove `blocklyActiveFocus` and `blocklyPassiveFocus` since these have unintended highlighting consequences that aren't actually desirable yet. Instead, the exact styling for active/passive focus will be iterated in the keyboard navigation plugin project and moved to Core once finalized.

### Reason for Changes

This is part of an ongoing effort to ensure key components of Blockly are focusable so that they can be keyboard-navigable (with other needed changes yet both in Core Blockly and the keyboard navigation plugin).

### Test Coverage

No new tests have been added. It's certainly possible to add unit tests for the focusable configurations being introduced in this PR, but it may not be highly beneficial. It's largely assumed that the individual implementations should work due to a highly tested FocusManager, and it may be the case that the interactions of the components working together is far more important to verify (that is, the end user flows). The latter is planned to be tackled as part of #8915.

### Documentation

No documentation changes should be needed here.

### Additional Information

This includes changes that have been pulled from #8875.

This was originally merged in #8916 but was reverted in #8933 due to https://github.com/google/blockly-keyboard-experimentation/issues/481. This actually contains no differences from the original PR except for `css.ts` which are documented above. It does employ a new merge strategy: all of the necessary PRs to move both Core and the plugin over to using `FocusManager` will be staged and merged in quick succession as ensuring the plugin works for each constituent change (vs. the final one) is quite complex. Thus, this PR *does* break the plugin, and won't be merged until its subsequent PRs are approved and also ready for merging.

Edit: See https://github.com/google/blockly/pull/8938#issuecomment-2843589525 for why this actually is being merged a bit sooner than originally planned. Keeping the original reasoning above for context.
2025-04-30 15:43:41 -07:00
RoboErikG
c644fe36ef Fix: Revert focus prs (#8933)
* Revert "feat: Make toolbox and flyout focusable (#8920)"

This reverts commit 5bc83808bf.

* Revert "feat: Make WorkspaceSvg and BlockSvg focusable (#8916)"

This reverts commit d7680cf32e.
2025-04-25 15:03:32 -07:00
Ben Henning
d7680cf32e feat: Make WorkspaceSvg and BlockSvg focusable (#8916)
## The basics

- [x] I [validated my changes](https://developers.google.com/blockly/guides/contribute/core#making_and_verifying_a_change)

## The details
### Resolves

Fixes #8913
Fixes #8914
Fixes part of #8771

### Proposed Changes

This updates `WorkspaceSvg` and `BlockSvg` to be focusable, that is, it makes the workspace a `IFocusableTree` and blocks `IFocusableNode`s.

Some important details:
- While this introduces focusable tree support for `Workspace` it doesn't include two other components that are obviously needed by the keyboard navigation plugin's playground: fields and connections. These will be introduced in subsequent PRs.
- Blocks are set up to automatically synchronize their selection state with their focus state. This will eventually help to replace `LineCursor`'s responsibility for managing selection state itself.
- The tabindex property for the workspace and its ARIA label have been moved down to the `.blocklyWorkspace` element itself rather than its wrapper. This helps address some tab stop issues that are already addressed in the plugin (via monkey patches), but also to ensure that the workspace's main SVG group interacts correctly with `FocusManager`.
- `WorkspaceSvg` is being initially set up to default to its first top block when being focused for the first time. This is to match parity with the keyboard navigation plugin, however the latter also has functionality for defaulting to a position when no blocks are present. It's not clear how to actually support this under the new focus-based system (without adding an ephemeral element on which to focus), or if it's even necessary (since the workspace root can hold focus).

### Reason for Changes

This is part of an ongoing effort to ensure key components of Blockly are focusable so that they can be keyboard-navigable (with other needed changes yet both in Core Blockly and the keyboard navigation plugin).

### Test Coverage

No new tests have been added. It's certainly possible to add unit tests for the focusable configurations being introduced in this PR, but it may not be highly beneficial. It's largely assumed that the individual implementations should work due to a highly tested FocusManager, and it may be the case that the interactions of the components working together is far more important to verify (that is, the end user flows). The latter is planned to be tackled as part of #8915.

### Documentation

No documentation changes should be needed here.

### Additional Information

This includes changes that have been pulled from #8875.
2025-04-24 14:48:16 -07:00
Maribeth Moffatt
2c05119ef2 fix: change css class for disabled block pattern (#8864) 2025-04-08 12:06:05 -07:00
Aaron Dodson
ca362725ee refactor!: Backport LineCursor to core. (#8834)
* refactor: Backport LineCursor to core.

* fix: Fix instantiation of LineCursor.

* fix: Fix tests.

* chore: Assauge the linter.

* chore: Fix some typos.

* feat: Make padding configurable for scrollBoundsIntoView.

* chore: Merge in the latest changes from keyboard-experimentation.

* refactor: Clarify name and docs for findSiblingOrParentSibling().

* fix: Improve scrollBoundsIntoView() behavior.

* fix: Export CursorOptions.

* refactor: Further clarify second parameter of setCurNode().

* fix: Revert change that could prevent scrolling bounds into view.
2025-04-03 12:15:17 -07:00
Aaron Dodson
7171350992 fix!: Tighten and correct typings on ASTNode (#8835)
* fix!: Tighten typings on ASTNode.create*Node() methods.

* fix: Restore missing condition.

* fix: Fix unsafe casts, non-null assertions and incorrect types.

* refactor: Simplify parent input checks.
2025-04-01 14:59:40 -07:00
Aaron Dodson
0f07567965 fix: Allow the marker's current node to be null. (#8802) 2025-03-20 09:46:31 -07:00
Aaron Dodson
b8f71b83b7 Merge branch 'rc/v12.0.0' into develop-v12-merge 2025-03-11 09:42:25 -07:00
Clément Contet
a190539bd8 fix: Fix dropdown text color in Zelos (#8741) 2025-01-20 09:29:34 +00:00
Aaron Dodson
c88ebf1ede fix: Don't add padding around zero-width fields. (#8738) 2025-01-16 15:23:55 -08:00
Aaron Dodson
bcdb65c623 release: Merge branch 'develop' into rc/v12.0.0 2025-01-10 10:53:09 -08:00
Aaron Dodson
a42c2d1508 feat: Add a BlockSvg.getStyle() method. (#8722)
* feat: Add a BlockSvg.getStyle() method.

* refactor: Remove direct field access to BlockSvg.style.
2025-01-07 14:44:48 -08:00
Aaron Dodson
151d21e50e refactor: Convert renderer typecheck methods to typeguards. (#8656)
* refactor: Convert renderer typecheck methods to typeguards.

* chore: Revert unintended change.

* chore: Format types.ts.
2025-01-07 14:04:21 -08:00
Aaron Dodson
eeef2edf34 chore!: Fix warnings when generating docs. (#8660) 2025-01-06 10:53:45 -08:00
Aaron Dodson
389dd1a1cb chore: Post-merge fixits. 2024-12-04 12:15:19 -08:00
Aaron Dodson
9fcd5a3037 release: Merge branch 'rc/v11.2.0' into rc/v12.0.0 2024-12-04 12:06:12 -08:00
Aaron Dodson
5870c66cf0 chore: Migrate ESLint configuration file to new flat format. (#8675)
* chore: rename .eslintrc.js to eslint.config.js

* chore: Rename eslint.config.js to eslint.config.mjs.

* refactor: Migrate ESLint config to new flat format.

* chore: Remove old per-directory and global ignore ESLint config files.

* fix: Allowlist JSDoc tag aliases.

* fix: Don't require @license in tests/*.

* fix: Add NodeJS globals to several files that run under Node.

* chore: Remove now-unneeded ESLint directives in core.

* chore: Remove invalid/unneeded ESLint directives.

* fix: Fix invalid use of `await` outside of an `async` function.

* fix: Improve screenshot error message.

* fix: Update ESLint config file to not warn on existing violations.

* chore: Remove suppressions of rules that weren't triggering.

* chore: Fix package-lock.json.
2024-12-03 12:40:48 -08:00
John Nesky
4230956244 fix: Create CSS vars for SVG patterns. (#8671) 2024-12-02 13:34:05 -08:00
Aaron Dodson
8f2228658e feat: Allow customizing GRID_UNIT for the Zelos renderer. (#8636) 2024-11-07 12:16:55 -08:00
Aaron Dodson
2523093cc9 refactor!: Remove the InsertionMarkerManager. (#8649)
* refactor!: Remove the InsertionMarkerManager.

* chore: Remove unused imports.

* chore: Remove import of insertion marker manager test.
2024-11-07 12:15:55 -08:00
Aaron Dodson
9fc693140a fix: Correctly calculate the bounds of hat blocks. (#8616) 2024-10-14 08:19:27 -07:00
Rachel Fenichel
0a6596ce75 feat: mark some marker_svg properties protected instead of private (#8558) 2024-09-03 09:17:42 -07:00
Christopher Allen
7ccdcc5cef refactor(events): introduce EventType enum in separate module (#8530)
* refactor(events): Use "export ... from" where applicable

* refactor(events): Introduce EventType enum

  Introduce an enum for the event .type values.  We can't actually
  use it as the type of the .type property on Abstract events,
  because we want to allow developers to add their own custom
  event types inheriting from this type, but at least this way we
  can be reasonably sure that all of our own event subclasses have
  distinct .type values—plus consistent use of enum syntax
  (EventType.TYPE_NAME) is probably good for readability overall.

  Put it in a separate module from the rest of events/utils.ts
  because it would be helpful if event utils could use

      event instanceof SomeEventType

  for type narrowing but but at the moment most events are in
  modules that depend on events/utils.ts for their .type
  constant, and although circular ESM dependencies should work
  in principle there are various restrictions and this
  particular circularity causes issues at the moment.

  A few of the event classes also depend on utils.ts for fire()
  or other functions, which will be harder to deal with, but at
  least this commit is win in terms of reducing the complexity
  of our dependencies, making most of the Abstract event subclass
  module dependent on type.ts, which has no imports, rather than
  on utils.ts which has multiple imports.
2024-08-20 08:36:33 +01:00
Christopher Allen
ce22f42868 chore: Organise imports (#8527)
* 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
2024-08-15 03:16:14 +01:00
dependabot[bot]
f57ef73aaf chore(deps): bump @typescript-eslint/eslint-plugin from 7.17.0 to 8.0.1 (#8479)
* chore(deps): bump @typescript-eslint/eslint-plugin from 7.17.0 to 8.0.1

Bumps [@typescript-eslint/eslint-plugin](https://github.com/typescript-eslint/typescript-eslint/tree/HEAD/packages/eslint-plugin) from 7.17.0 to 8.0.1.
- [Release notes](https://github.com/typescript-eslint/typescript-eslint/releases)
- [Changelog](https://github.com/typescript-eslint/typescript-eslint/blob/main/packages/eslint-plugin/CHANGELOG.md)
- [Commits](https://github.com/typescript-eslint/typescript-eslint/commits/v8.0.1/packages/eslint-plugin)

---
updated-dependencies:
- dependency-name: "@typescript-eslint/eslint-plugin"
  dependency-type: direct:development
  update-type: version-update:semver-major
...

Signed-off-by: dependabot[bot] <support@github.com>

* fix: lint plugin versions

* chore: fix linting

---------

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Beka Westberg <bwestberg@google.com>
2024-08-14 09:10:34 -07:00
Shreshtha Sharma
64fd9ad89a feat: added blocklyHighlighted CSS class to highlighted block's root… (#8407)
* fix: added 'blocklyHighlighted' CSS class to highlighted block's root svg

* fix: added 'blocklyHighlighted' CSS class to highlighted block's root svg

* fix: added 'blocklyHighlighted' CSS class to highlighted block's root svg

* fix: added 'blocklyHighlighted' CSS class to highlighted block's root svg

* fix: added 'blocklyHighlighted' CSS class to highlighted block's root svg
2024-08-14 09:06:27 -07:00
Adityajaiswal03
59fab944f4 feat: change blocklyEditableText to blocklyEditableField and blocklyNonEditableText to blocklyNonEditableField BREAKING CHANGE: The blocklyEditableText and blocklyNonEditableText identifiers have been renamed to blocklyEditableField and blocklyNonEditableField respectively. This change may require updates to any existing code that references the old identifiers. (#8475) 2024-08-12 13:10:38 -07:00
Chaitanya Yeole
76eebc2f24 feat: Add a blocklyBlock CSS class to the block's root SVG (#8397) 2024-07-22 16:05:19 -07:00
Gabriel Fleury
e29d7abfdb fix!: Rename editing CSS class to blocklyEditing (#8287) (#8301)
* chore!: Rename editing CSS class to blocklyEditing (#8287)

* further changes
2024-07-22 15:38:40 -07:00
Devesh Rahatekar
8cca066bcf feat: Add a blocklyShadow class (#8336)
* feat: Add blockShadow class

* formatted the file
2024-07-17 09:44:24 -07:00
Shashwat Pathak
dd18edd343 fix!: Make IPathObject styling methods optional (#8332) 2024-07-12 09:36:25 -07:00
Aaron Dodson
fa15cda950 feat: allow fetching block bounds not including children. (#8284)
* feat: allow fetching block bounds not including children.

* chore: run formatter.

* chore: run the other formatter.

* fix: don't include subsequent blocks in the childless bounding rect.

* chore: remove logging.
2024-07-10 14:52:07 -07:00
Neil Fraser
5a8969f855 fix: Zelos comments shouldn't be bold (#8141)
Resolves #8061
2024-05-17 21:33:52 +02:00
Maribeth Bottorff
b0c29b8b69 Merge pull request #7993 from google/develop
chore: merge develop into rc/v11
2024-04-04 11:14:18 -07:00
Mike Harvey
9e05d69d2a feat: support keyboard navigation of flyout buttons (#7852)
* feat: support keyboard navigation of flyout buttons

* fix: use FlyoutItem type for flyout contents, rework navigateBetweenStacks for flyouts
2024-04-02 13:40:58 -07:00
Christopher Allen
10ffcb706d release: Merge branch 'develop' into rc/v11.0.0 2024-03-18 19:57:04 +00:00
Neil Fraser
0ecbcde9fc chore: Use .includes and .startsWith, not .indexOf (#7936)
Easier to read than the diverse collection of `=== 0` and `!== -1` and `> -1` tests.
2024-03-15 00:03:55 +01:00
Beka Westberg
b2b12f42fd merge develop into rc/v11.0.0 2024-02-02 22:14:46 +00:00
Beka Westberg
018df03715 chore: deprecate insertion marker manager and related methods (#7797) 2024-02-02 11:55:14 -08:00
Beka Westberg
702eed42db fix: highlighting connections in zelos, also highlight connections moving (#7795)
* fix: remove zelos highlight override

* feat: add isHighlighted to rendered connection

* feat: add refreshing connection highlighting

* chore: remove highlight and unhighlight connection APIs

* chore: PR comments
2024-02-02 11:55:14 -08:00
Beka Westberg
318621d3c0 feat: add connection highlighting to zelos (#7781)
* feat: add connection highlighting to zelos

* fix: drawing outputs

* chore: cleanup
2024-02-02 11:55:14 -08:00
Beka Westberg
461dfac05a feat: connection highlighting in geras and thrasos (#7698)
* chore: move connection highlighting into the geras renderer

* chore: remove IConnectionHighlighter interface

* chore: format

* chore: fixup

* chore: format

* fix: PR comments
2024-02-02 11:55:14 -08:00
Beka Westberg
2c95c4202c feat: connection highlighter interface (#7638)
* feat: add connection highlighter interface

* fix: remove unnecessary method from the path object interface
2024-02-02 11:55:14 -08:00
Beka Westberg
75007a064c chore!: delete deprecations for v11. (#7732)
* chore: delete basic deprecations

* chore: remove deprecated align enum

* chore: remove generator deprecation

* chore: format
2024-01-23 08:48:08 -08:00
Beka Westberg
b2688441fa chore: fix shouldStartNewRow docs and param names (#7558) 2023-10-18 09:29:08 -07:00
Beka Westberg
5151b28e7d fix: color field sizing being incorrect (#7566) 2023-10-02 13:16:03 -07:00
Neil Fraser
61cdbb65d3 chore: Setting style property to make CSP less grumpy. (#7503)
* Setting style property to make CSP less grumpy.

"Content-Security-Policy: The page’s settings blocked the loading of a resource at inline (“style-src”)."

The 'style' property should be set as an object, not as a string, according to CSP rules.

Back-ported from Blockly Games.
2023-09-19 17:01:14 +02:00