Files
ionic-framework/packages/angular/test/base/e2e/src
Brandy Smith 1d36021c6f feat(textarea): convert to a form associated shadow component (#30785)
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>
2026-02-05 13:35:39 -05:00
..