mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2026-03-13 10:22:08 +08:00
1d36021c6f
Issue number: internal --------- ## What is the current behavior? Textarea uses `scoped` encapsulation. This causes issues with CSP compatibility and is inconsistent with our goal of having all components use Shadow DOM. ## What is the new behavior? - Converts `ion-textarea` to `shadow` with `formAssociated: true` - Adds shadow parts for inner elements - Adds and updates existing e2e tests in core for textarea - Updated Angular test app to target textarea shadowRoot and updated lazy forms test to include textarea (standalone already has these) - Updated React & Vue test apps to target textarea shadowRoot and added validation tests - Improves focus behavior inside of a popover so that it is no longer required to tab twice to get to the textarea in any browser ## Does this introduce a breaking change? - [x] Yes - [ ] No BREAKING CHANGE: Textarea has been converted to use [Shadow DOM](https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_shadow_DOM). If you were targeting the internals of `ion-textarea` in your CSS, you will need to target the `container`, `label`, `native`, `supporting-text`, `helper-text`, `error-text`, `counter`, or `bottom` [Shadow Parts](https://ionicframework.com/docs/theming/css-shadow-parts) instead, or use the provided CSS Variables. --------- Co-authored-by: Brandy Smith <6577830+brandyscarney@users.noreply.github.com>