fix(components): [tree] respect check-strictly on lazy load by ruguoba · Pull Request #24267 · element-plus/element-plus

ruguoba · 2026-05-18T03:09:00Z

What is the bug?

When using el-tree with lazy loading and check-strictly: true, checking a parent node causes subsequently lazy-loaded child nodes to be automatically checked. With check-strictly enabled, parent and child check states should be independent.

Root Cause

In node.ts expand() method, after lazy-loading children, the code checked if (this.checked) and called this.setChecked(true, true) with deep=true before checking checkStrictly. The checkStrictly guard was only in the else branch.

Fix

Restructured the conditions so checkStrictly is checked first. When checkStrictly: true, no check propagation happens after lazy load:

- if (this.checked) {
-   this.setChecked(true, true)
- } else if (!this.store.checkStrictly) {
-   reInitChecked(this)
- }
+ if (!this.store.checkStrictly) {
+   if (this.checked) {
+     this.setChecked(true, true)
+   } else {
+     reInitChecked(this)
+   }
+ }

All 73 existing tree component tests pass.

Summary by CodeRabbit

Bug Fixes
- Fixed inconsistent checkbox behavior in the tree: when lazy loading with strict-check mode enabled, expanding a node no longer auto-checks newly loaded children — only the node explicitly checked remains selected.
Tests
- Added a test to verify lazy-loading checkbox behavior under strict-check mode to prevent regressions.

…heck-strictly

pull-request-triage · 2026-05-18T03:09:07Z

👋 @ruguoba, seems like this is your first time contribution to element-plus.
Please make sure that you have read our guidelines and code of conduct before making a contribution.

github-actions · 2026-05-18T03:09:09Z

coderabbitai · 2026-05-18T03:09:17Z

Note

Reviews paused

It looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the reviews.auto_review.auto_pause_after_reviewed_commits setting.

Use the following commands to manage reviews:

@coderabbitai resume to resume automatic reviews.
@coderabbitai review to trigger a single review.

Use the checkboxes below for quick actions:

▶️ Resume reviews
🔍 Trigger review

📝 Walkthrough

Walkthrough

Guards Node's post-lazy-load checked-state actions so both setChecked(true, true) and reInitChecked(this) run only when store.checkStrictly is false; adds a Vitest verifying lazy-loaded children remain unchecked when check-strictly is enabled.

Changes

Lazy-loaded node checked-state handling under strict mode

Layer / File(s)	Summary
Guard post-load checked-state init `packages/components/tree/src/model/node.ts`	After lazy-load completion, both `setChecked(true, true)` and `reInitChecked(this)` are executed only when `store.checkStrictly` is `false`, preventing automatic parent-to-child checking in strict mode.
Test: lazy load with check-strictly `packages/components/tree/__tests__/tree.test.ts`	Adds a test that selects a parent in lazy + checkbox + `check-strictly` mode, triggers lazy loading, and asserts newly loaded children are not auto-checked (checked keys remain the parent only).

Sequence Diagram(s)

sequenceDiagram
  participant User
  participant Node
  participant Store
  participant CheckedInit
  User->>Node: click parent checkbox
  Node->>Store: read checkStrictly
  Store-->>Node: return checkStrictly
  Node->>Node: mark parent checked
  Node->>Node: lazy load children
  Node->>Store: on children loaded -> read checkStrictly
  alt checkStrictly == false
    Node->>CheckedInit: setChecked(true, true) / reInitChecked(this)
  else checkStrictly == true
    Node-->>CheckedInit: skip setChecked/reInitChecked
  end

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Possibly related PRs

element-plus/element-plus#23591: Prior changes around checkStrictly gating and checked propagation in Node/setChecked.

Suggested reviewers

rzzf
Dsaquel
btea

Poem

🐰 I nudged a checkbox on a lazy tree,
Parent hops checked, children wander free,
They load on demand and keep their lane,
No surprise ticks hop in with the rain,
Happy hops — neat trees, carrots for tea! 🥕

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title 'fix(components): [tree] respect check-strictly on lazy load' clearly and concisely describes the main fix: ensuring check-strictly mode is respected during lazy loading in the tree component.
Description check	✅ Passed	The PR description comprehensively explains the bug, root cause, fix implementation with code diff, test coverage, and closes a linked issue, meeting the repository template requirements.
Linked Issues check	✅ Passed	The PR fixes the exact issue described in `#24255`: ensuring lazy-loaded child nodes respect check-strictly mode and are not auto-checked when a parent is checked.
Out of Scope Changes check	✅ Passed	All changes directly address the lazy-load check-strictly bug: one fix to node.ts conditional logic and one test addition to verify the fix behavior; no extraneous changes detected.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

🧪 Generate unit tests (beta)

Create PR with unit tests

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.}

pkg-pr-new · 2026-05-18T03:35:46Z

Open in StackBlitz

pnpm add https://pkg.pr.new/element-plus@24267

npm i https://pkg.pr.new/element-plus@24267

yarn add https://pkg.pr.new/[email protected]

commit: c707da2

rzzf

Please add tese cases.

github-actions · 2026-05-18T03:42:01Z

🧪 Playground Preview: https://element-plus.run/?pr=24267
Please comment the example via this playground if needed.

coderabbitai

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@packages/components/tree/__tests__/tree.test.ts`:
- Around line 2479-2486: Move the fake-timer setup so timers are controlled
before the async load is scheduled: call vi.useFakeTimers() prior to triggering
the click on nodeContent[0] (which causes the setTimeout in loadNode to be
scheduled), then trigger the click, call vi.runAllTimers(), vi.useRealTimers(),
and await nextTick(); also remove the redundant extra nextTick() to match the
established pattern used elsewhere in the test file.

🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

Push a commit to this branch (recommended)
Create a new PR with the fixes

ℹ️ Review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: 5dcd4707-f84e-4013-b694-e5f0fc1bb0f4

📥 Commits

Reviewing files that changed from the base of the PR and between 24cf939 and d91b371.

📒 Files selected for processing (1)

packages/components/tree/__tests__/tree.test.ts

ruguoba · 2026-05-18T06:06:12Z

Hi @rzzf, I've added test cases and fixed the timer issue in the test. All CI checks are passing. Could you please review again? Thanks!

ruguoba · 2026-05-18T08:19:59Z

The latest requested change has been applied in c707da2. Local tree tests and lint pass on my side. The required workflows are currently awaiting maintainer approval to run. Could you please approve the workflow run when convenient? Thanks!

keeplearning66

Thank you!

github-actions · 2026-05-18T13:34:51Z

@ruguoba Thanks for your contribution! ❤️

fix(components): [tree] prevent check propagation on lazy load with c…

24cf939

…heck-strictly

pull-request-triage Bot assigned ruguoba May 18, 2026

pull-request-triage Bot added 1st contribution Their very first contribution Needs Review labels May 18, 2026

github-actions Bot added the Contribution::Community label May 18, 2026

github-actions Bot added the CommitMessage::Unqualified Unqualified commit message label May 18, 2026

rzzf requested changes May 18, 2026

View reviewed changes

test(components): [tree] add test case for check-strictly with lazy load

d91b371

coderabbitai Bot reviewed May 18, 2026

View reviewed changes

Comment thread packages/components/tree/__tests__/tree.test.ts Outdated

test(components): [tree] fix lazy strict timer test

9c5224d

ruguoba changed the title ~~fix(components): [tree] prevent check propagation on lazy load with check-strictly~~ fix(components): [tree] respect check-strictly on lazy load May 18, 2026

Merge branch 'element-plus:dev' into fix/tree-lazy-check-strictly

1ab3d27

rzzf reviewed May 18, 2026

View reviewed changes

Comment thread packages/components/tree/__tests__/tree.test.ts Outdated

test(components): [tree] adjust lazy strict test timers

be419c0

github-actions Bot removed the CommitMessage::Unqualified Unqualified commit message label May 18, 2026

rzzf approved these changes May 18, 2026

View reviewed changes

keeplearning66 reviewed May 18, 2026

View reviewed changes

Comment thread packages/components/tree/__tests__/tree.test.ts Outdated

Comment thread packages/components/tree/__tests__/tree.test.ts Outdated

test(components): [tree] simplify lazy strict test

3a6bd88

keeplearning66 reviewed May 18, 2026

View reviewed changes

Comment thread packages/components/tree/__tests__/tree.test.ts Outdated

Update packages/components/tree/__tests__/tree.test.ts

c707da2

ruguoba force-pushed the fix/tree-lazy-check-strictly branch from 73b3dd0 to c707da2 Compare May 18, 2026 08:13

keeplearning66 approved these changes May 18, 2026

View reviewed changes

btea merged commit 5b323c1 into element-plus:dev May 18, 2026
28 checks passed

element-bot mentioned this pull request May 29, 2026

D2M #24346

Merged

3 tasks

coderabbitai Bot mentioned this pull request Jun 4, 2026

fix(components): [cascader] fix select-all not working with lazy load #24387

Open

Uh oh!

Conversation

ruguoba commented May 18, 2026 • edited by coderabbitai Bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

What is the bug?

Root Cause

Fix

Summary by CodeRabbit

Uh oh!

pull-request-triage Bot commented May 18, 2026

Uh oh!

github-actions Bot commented May 18, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

coderabbitai Bot commented May 18, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Reviews paused

Walkthrough

Changes

Sequence Diagram(s)

Estimated code review effort

Possibly related PRs

Suggested reviewers

Poem

Uh oh!

pkg-pr-new Bot commented May 18, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

rzzf left a comment

Choose a reason for hiding this comment

Uh oh!

github-actions Bot commented May 18, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

coderabbitai Bot left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

ruguoba commented May 18, 2026

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

ruguoba commented May 18, 2026

Uh oh!

keeplearning66 left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

github-actions Bot commented May 18, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

ruguoba commented May 18, 2026 •

edited by coderabbitai Bot

Loading

github-actions Bot commented May 18, 2026 •

edited

Loading

coderabbitai Bot commented May 18, 2026 •

edited

Loading

pkg-pr-new Bot commented May 18, 2026 •

edited

Loading

github-actions Bot commented May 18, 2026 •

edited

Loading