Description
When the application is running in a zoneless change detection environment, the Splitter component is not positioned correctly.
Depending on the Splitter orientation, the splitter bar is rendered in the wrong place:
- When the Splitter type is
typeHorizontal, the splitter bar is displayed in the right corner.
- When the Splitter type is
typeVertical, the splitter bar is displayed at the bottom.
This appears to be related to zoneless change detection, as the component layout is not calculated/applied correctly in this environment.
I have created a sample that reproduces the behavior:
https://stackblitz.com/edit/tyacnprm-wrestiuu?file=src%2Fapp%2Fapp.config.ts,package.json
Framework
Angular
Angular Version
21.2
Ignite UI for Angular Version
21.2.0
Component / Area
Splitter
Browser
Chrome
Operating System
Windows
Command Not Working
Steps to Reproduce
- Open the following sample: https://stackblitz.com/edit/tyacnprm-wrestiuu?file=src%2Fapp%2Fapp.config.ts,package.json
- Observe the position of the splitter bar.
Actual Result
The Splitter component is not positioned correctly. For typeHorizontal, the splitter bar is displayed in the right corner. For typeVertical, the splitter bar is displayed at the bottom.
Expected Result
The Splitter should be positioned correctly according to its orientation in a zoneless change detection environment.
Reproduction URL
https://stackblitz.com/edit/tyacnprm-wrestiuu?file=src%2Fapp%2Fapp.config.ts,package.json
Attachments
No response
Description
When the application is running in a zoneless change detection environment, the Splitter component is not positioned correctly.
Depending on the Splitter orientation, the splitter bar is rendered in the wrong place:
typeHorizontal, the splitter bar is displayed in the right corner.typeVertical, the splitter bar is displayed at the bottom.This appears to be related to zoneless change detection, as the component layout is not calculated/applied correctly in this environment.
I have created a sample that reproduces the behavior:
https://stackblitz.com/edit/tyacnprm-wrestiuu?file=src%2Fapp%2Fapp.config.ts,package.json
Framework
Angular
Angular Version
21.2
Ignite UI for Angular Version
21.2.0
Component / Area
Splitter
Browser
Chrome
Operating System
Windows
Command Not Working
Steps to Reproduce
Actual Result
The Splitter component is not positioned correctly. For
typeHorizontal, the splitter bar is displayed in the right corner. FortypeVertical, the splitter bar is displayed at the bottom.Expected Result
The Splitter should be positioned correctly according to its orientation in a zoneless change detection environment.
Reproduction URL
https://stackblitz.com/edit/tyacnprm-wrestiuu?file=src%2Fapp%2Fapp.config.ts,package.json
Attachments
No response