fix(VertexHandler): fix top-left resize handle behavior #968

Lockps · 2025-12-08T13:27:48Z

The issue occurred because the condition if (handle) evaluated to false when the handle index was 0.
As a result, the top-left handle incorrectly initiated a move operation.

The condition has been updated from if (handle) to if (handle !== null) to correctly detect a non-null result.

Closes #944

Summary by CodeRabbit

Bug Fixes
- Handle interactions now reliably trigger start and are consumed even when a handle has a falsy value (e.g., index 0), fixing missed or ignored handle presses and moves so dragging/resizing behaves consistently.
Documentation
- Added coding practices guidance on explicit null/undefined checks and examples to clarify handling of falsy values.

_{✏️ Tip: You can customize this high-level summary in your review settings.}

The top-left resize handle (index 0) was triggering a move operation instead of a resize.

coderabbitai · 2025-12-08T13:28:15Z

Walkthrough

Replaced truthiness-based handle checks with explicit nullish checks in VertexHandler so numeric handle values (including 0) are treated as valid; added import of isNullish. Also added documentation in CLAUDE.md describing isNullish usage for null/undefined checks.

Changes

Cohort / File(s)	Summary
Mouse/resize handler fix `packages/core/src/view/handler/VertexHandler.ts`	Added import of `isNullish` and replaced truthiness checks with `!isNullish(...)` in `mouseDown` and `mouseMove`, allowing `0` as a valid handle so `start()` is invoked and events are consumed for non-nullish handles.
Docs: nullish-check guidance `CLAUDE.md`	Added a Coding Practices section documenting `isNullish` usage and examples to prefer explicit null/undefined checks over truthiness for falsy values like `0`, `""`, or `false`.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~5–10 minutes

Check that isNullish correctly treats only null/undefined as nullish.
Verify handle === 0 now triggers start() and that resizing (e.g., top-left) no longer moves the cell.
Run relevant interaction/unit tests and perform quick manual UI validation for all sizer indices.

Pre-merge checks and finishing touches

✅ Passed checks (5 passed)

Check name	Status	Explanation
Title check	✅ Passed	Title accurately describes the fix to the top-left resize handle behavior using proper Conventional Commits format.
Description check	✅ Passed	Description explains the problem, solution, and includes issue reference, but lacks test/documentation confirmation sections required by template.
Linked Issues check	✅ Passed	The code changes correctly fix the top-left resize handle behavior by replacing falsy checks with proper nullish checks, directly addressing issue #944.
Out of Scope Changes check	✅ Passed	CLAUDE.md documentation changes and isNullish utility usage are directly related to improving null/undefined handling practices.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

✨ Finishing touches

🧪 Generate unit tests (beta)

Create PR with unit tests
Post copyable unit tests in a comment

📜 Recent review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between eee326f and e7fd20c.

📒 Files selected for processing (1)

CLAUDE.md (1 hunks)

✅ Files skipped from review due to trivial changes (1)

CLAUDE.md

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

coderabbitai

Actionable comments posted: 0

🧹 Nitpick comments (1)

packages/core/src/view/handler/VertexHandler.ts (1)
634-642: Explicit null check correctly fixes handle index 0; consider aligning related checks

Changing if (handle) to if (handle !== null) is the right fix: it preserves the “no handle” sentinel while allowing index 0 (top‑left sizer) to start resizing and satisfies TypeScript’s number | null narrowing into the start(...) call.

As a minor follow‑up, you might also consider updating the hover/connect‑highlight guard in mouseMove:
// current
else if (!this.graph.isMouseDown && this.getHandleForEvent(me)) {
  me.consume(false);
}

// possible alignment
else if (!this.graph.isMouseDown && this.getHandleForEvent(me) !== null) {
  me.consume(false);
}
so that the top‑left handle is treated consistently as a valid handle in all paths (including disabling connect highlight when hovering over it).

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 9f36e90 and 6b90048.

📒 Files selected for processing (1)

packages/core/src/view/handler/VertexHandler.ts (1 hunks)

🧰 Additional context used

📓 Path-based instructions (3)

packages/core/src/**/*.ts

📄 CodeRabbit inference engine (.github/copilot-instructions.md)

packages/core/src/**/*.ts: Always include '.js' file extensions in import statements within packages/core/src/ to comply with the ESLint import plugin rule 'n/file-extension-in-import: ['error', 'always']'.
No console statements allowed in code (ESLint rule: 'no-console: error'). Use proper logging instead.
No eval() function calls allowed in code (ESLint rule: 'no-eval: error').
Const enums are forbidden. Convert to regular enums instead (ESLint enforcement).
Use single quotes in code formatting (Prettier config: 'singleQuote: true').
Maintain tab width of 2 spaces in code formatting (Prettier config: 'tabWidth: 2').
Keep lines to a maximum of 90 characters (Prettier config: 'printWidth: 90').
Use ES5 trailing commas in code formatting (Prettier config: 'trailingComma: es5').
Follow the existing code structure and patterns when modifying core source files in packages/core/src/.
Maintain strict TypeScript typing in all code modifications.
Use ESM (ECMAScript Module) format as the primary module system. CommonJS is generated as a secondary output via compilation.
Target ES2020 as the TypeScript compiler target for the core package.
Enable strict TypeScript mode including 'noImplicitOverride' and 'noImplicitReturns' in the core package configuration.

packages/core/src/**/*.ts: Use camelCase for naming in TypeScript files
Code must conform to ES2020 standard for browser compatibility
Target modern browsers (Chrome, Edge, Firefox, Safari, Chromium-based) with no IE support

Files:

packages/core/src/view/handler/VertexHandler.ts

packages/core/src/view/**/*.ts

📄 CodeRabbit inference engine (CLAUDE.md)

Wrap multiple model changes in batchUpdate() to ensure efficient updates

Files:

packages/core/src/view/handler/VertexHandler.ts

packages/*/src/**/*.ts

📄 CodeRabbit inference engine (CLAUDE.md)

packages/*/src/**/*.ts: Register shapes via registries (e.g., ShapeRegistry) before use in BaseGraph
Use BaseGraph with explicit feature registration for production use
Use Graph class for prototyping and evaluation where automatic default registration is needed
To minimize bundle size, use BaseGraph and import only required features

Files:

packages/core/src/view/handler/VertexHandler.ts

tbouffard · 2025-12-08T13:57:07Z

Hi and thanks for this PR.
This problem seems to have been introduced by mistake in 648e324.

I will review the PR soon.

…ndefined)

tbouffard

Thanks for this contribution and good catch.
This problem seems to have been introduced by mistake in 648e324.

Checking falsy number is a common regression introduced during the code simplification as part of the TypeScript migration. We already had to fix similar problems like in #592.

I took the liberty of pushing forward the use of the internal isNullish function to prepare for the future. This function also tests undefined values, and since we want to gradually remove or limit null values in the codebase, this is a step in the right direction.
I also took the opportunity to fix another falsy check issue instead of nullish.

sonarqubecloud · 2025-12-11T08:40:49Z

Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud

fix: top-left resize handle not working

6b90048

The top-left resize handle (index 0) was triggering a move operation instead of a resize.

Lockps mentioned this pull request Dec 8, 2025

[BUG] resize top left doesn't work #944

Closed

coderabbitai bot reviewed Dec 8, 2025

View reviewed changes

tbouffard added the bug Something isn't working label Dec 8, 2025

tbouffard changed the title ~~fix: top-left resize handle not working~~ fix(VertexHandler): make the top-left resize handle resize instead of move Dec 10, 2025

tbouffard changed the title ~~fix(VertexHandler): make the top-left resize handle resize instead of move~~ fix(VertexHandler): make the top-left handle resize instead of move Dec 10, 2025

tbouffard added 2 commits December 10, 2025 10:50

Use the nullish internal function to prepare the future (also check u…

7a70f3f

…ndefined)

apply the same fix in mouseMove()

eee326f

tbouffard approved these changes Dec 10, 2025

View reviewed changes

tbouffard changed the title ~~fix(VertexHandler): make the top-left handle resize instead of move~~ fix(VertexHandler): fix top-left resize handle behavior Dec 10, 2025

Lockps and others added 2 commits December 11, 2025 02:34

Merge branch 'main' into fixResizeTopLeft

1c0bc07

claude config: use isNullish when appropriate [skip ci]

e7fd20c

tbouffard merged commit 0b9d1dd into maxGraph:main Dec 11, 2025
2 checks passed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

fix(VertexHandler): fix top-left resize handle behavior #968

fix(VertexHandler): fix top-left resize handle behavior #968

Uh oh!

Lockps commented Dec 8, 2025 •

edited by coderabbitai bot

Loading

Uh oh!

coderabbitai bot commented Dec 8, 2025 •

edited

Loading

Uh oh!

coderabbitai bot left a comment

Uh oh!

tbouffard commented Dec 8, 2025

Uh oh!

tbouffard left a comment

Uh oh!

sonarqubecloud bot commented Dec 11, 2025

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

fix(VertexHandler): fix top-left resize handle behavior #968

fix(VertexHandler): fix top-left resize handle behavior #968

Uh oh!

Conversation

Lockps commented Dec 8, 2025 • edited by coderabbitai bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary by CodeRabbit

Uh oh!

coderabbitai bot commented Dec 8, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Walkthrough

Changes

Estimated code review effort

Pre-merge checks and finishing touches

Uh oh!

coderabbitai bot left a comment

Choose a reason for hiding this comment

Uh oh!

tbouffard commented Dec 8, 2025

Uh oh!

tbouffard left a comment

Choose a reason for hiding this comment

Uh oh!

sonarqubecloud bot commented Dec 11, 2025

Quality Gate passed

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Lockps commented Dec 8, 2025 •

edited by coderabbitai bot

Loading

coderabbitai bot commented Dec 8, 2025 •

edited

Loading