angular / angular/components

bug(slider): Slider doesn't render values in SSR (Universal)

Open
#27,226 7 comments 0 reactions 0 assignees View on GitHub
area: material/slider P2
Dominant language
TypeScript
Stars
25k
Forks
6.8k
Avg merge
1d 8h
Merged PRs (30d)
91

Description

### Is this a regression?

- [ ] Yes, this behavior used to work in the previous version

### The previous version in which this bug was not present was

_No response_

### Description

- When rendered on the server with Angular Universal, the slider thumb always renders at the left-most position, regardless on the actual value
- What's more, a range slider only shows the "start" thumb, but not the "end" thumb.

### Reproduction

(don't know where to host a Universal app)

### Expected Behavior

- Two thumbs are rendered in SSR for a range slider
- Slider thumbs positions in SSR reflect the actual slider values

### Actual Behavior

- Only the "start" thumb is rendered in SSR
- The the start thumb is rendered in the left-most position in SSR, regardless on the actual value

### Environment

- Angular: 15
- CDK/Material: 15
- Browser(s):
- Operating System (e.g. Windows, macOS, Ubuntu):

Contributor guide

Open the contributing guide

Research direction

No repository files or tests are named. Start by reproducing the slider with Angular Universal using a range value, then verify that SSR renders both thumbs at their configured positions; those rendering results define done.

Written by the indexing model from the issue text.

Assessment

Tech stack
angular, typescript
Domain
frontend
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.