Skip to content

[Bug Report][4.0.4] v-progress-linear: last chunk not filled when model-value equals max with chunk-countΒ #22818

@valn-ilyo

Description

@valn-ilyo

Environment

Vuetify Version: 4.0.4
Vue Version: 3.5.31
OS: Windows 10 (current)

Steps to reproduce

  1. Render
  2. Observe the progress bar β€” the last (3rd) chunk segment appears unfilled despite model-value === max
  3. Resize the browser window a few times β€” the segment may momentarily correct itself, then break again at certain viewport widths

Expected Behavior

All 3 chunk segments are filled when model-value equals max (300/300 = 100%)

Actual Behavior

Only 2 of 3 chunk segments appear filled. The last segment remains empty despite model-value === max. The bug is viewport-size sensitive β€” resizing the browser window a few times may reveal or temporarily fix it, confirming it is a pixel/layout calculation race in the chunk boundary rendering rather than a data issue.

Reproduction Link

https://play.vuetifyjs.com/#...

Other comments

The bug is viewport-size sensitive. At some widths the last chunk renders correctly; at others it stays empty even though the data is correct (300/300 = 100%). Resizing the container triggers a repaint that occasionally fixes it temporarily, confirming this is a pixel/layout calculation race in the chunk boundary math rather than a data or binding issue.

Images

https://cdn.cosmicjs.com/543e9c20-4104-11f1-a067-5f482151093f-WhatsApp-Image-2026-04-26-at-5-40-07-AM.jpeg

Metadata

Metadata

Assignees

Labels

C: VProgressLinearT: bugFunctionality that does not work as intended/expected

Type

No type

Projects

No projects

Relationships

None yet

Development

No branches or pull requests

Issue actions