From c19eb5847a687bd83d577926048363905c4ce251 Mon Sep 17 00:00:00 2001
From: Cory LaViska <cory@abeautifulsite.net>
Date: Wed, 11 May 2022 10:16:37 -0400
Subject: [PATCH] #751

---
 docs/resources/changelog.md         | 1 +
 src/components/select/select.ts     | 2 +-
 src/components/textarea/textarea.ts | 2 +-
 3 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/docs/resources/changelog.md b/docs/resources/changelog.md
index acb7decc..d3fae9fd 100644
--- a/docs/resources/changelog.md
+++ b/docs/resources/changelog.md
@@ -12,6 +12,7 @@ _During the beta period, these restrictions may be relaxed in the event of a mis
 - Added `blur()`, `click()`, and `focus()` methods as well as `sl-blur` and `sl-focus` events to `<sl-icon-button>` [#730](https://github.com/shoelace-style/shoelace/issues/730)
 - Fixed a bug where updating a menu item's label wouldn't update the display label in `<sl-select>` [#729](https://github.com/shoelace-style/shoelace/issues/729)
 - Fixed a bug where the FormData event polyfill was causing issues with older browsers [#747](https://github.com/shoelace-style/shoelace/issues/747)
+- Fixed a bug that caused a console error when setting `value` to `null` or `undefined` in `<sl-input>`, `<sl-select>`, and `<sl-textarea>` [#751](https://github.com/shoelace-style/shoelace/pull/751)
 - Improved behavior of clearable and password toggle buttons in `<sl-input>` and `<sl-select>` [#745](https://github.com/shoelace-style/shoelace/issues/745)
 - Improved performance of `<sl-select>` by caching menu items instead of traversing for them each time
 - Revert form submit logic [#718](https://github.com/shoelace-style/shoelace/issues/718)
diff --git a/src/components/select/select.ts b/src/components/select/select.ts
index e20d62e8..cd69a40c 100644
--- a/src/components/select/select.ts
+++ b/src/components/select/select.ts
@@ -485,7 +485,7 @@ export default class SlSelect extends LitElement {
             class=${classMap({
               select: true,
               'select--open': this.isOpen,
-              'select--empty': this.value.length === 0,
+              'select--empty': !this.value,
               'select--focused': this.hasFocus,
               'select--clearable': this.clearable,
               'select--disabled': this.disabled,
diff --git a/src/components/textarea/textarea.ts b/src/components/textarea/textarea.ts
index 7ece64b9..23bc5e94 100644
--- a/src/components/textarea/textarea.ts
+++ b/src/components/textarea/textarea.ts
@@ -291,7 +291,7 @@ export default class SlTextarea extends LitElement {
               'textarea--filled': this.filled,
               'textarea--disabled': this.disabled,
               'textarea--focused': this.hasFocus,
-              'textarea--empty': this.value.length === 0,
+              'textarea--empty': !this.value,
               'textarea--invalid': this.invalid,
               'textarea--resize-none': this.resize === 'none',
               'textarea--resize-vertical': this.resize === 'vertical',