From 62417ed1d13672f9f490810a73b627d41e5f1468 Mon Sep 17 00:00:00 2001
From: Cory LaViska <cory@abeautifulsite.net>
Date: Fri, 1 Dec 2023 10:15:20 -0500
Subject: [PATCH] backport PR 1752

---
 docs/pages/resources/changelog.md             |  3 ++-
 src/components/input/input.component.ts       |  8 +++++---
 src/components/input/input.test.ts            | 12 ++++++++++++
 src/components/textarea/textarea.component.ts | 10 ++++------
 src/components/textarea/textarea.test.ts      | 12 ++++++++++++
 5 files changed, 35 insertions(+), 10 deletions(-)

diff --git a/docs/pages/resources/changelog.md b/docs/pages/resources/changelog.md
index 9d0fdb36c..929c55a20 100644
--- a/docs/pages/resources/changelog.md
+++ b/docs/pages/resources/changelog.md
@@ -20,8 +20,9 @@ New versions of Web Awesome are released as-needed and generally occur when a cr
 - Removed `default` from `<wa-button>` and made `neutral` the new default
 - Removed the `circle` modifier from `<wa-button>` because button's no longer have a set height
 
-## Next
+## 2.12.0
 
+- Added the Italian translation [#1727]
 - Added the ability to call `form.checkValidity()` and it will use Shoelace's custom `checkValidity()` handler. [#1708]
 - Fixed a bug where nested dialogs were not properly trapping focus. [#1711]
 - Fixed a bug with form controls removing the custom validity handlers from the form. [#1708]
diff --git a/src/components/input/input.component.ts b/src/components/input/input.component.ts
index d0524da86..80a1884ec 100644
--- a/src/components/input/input.component.ts
+++ b/src/components/input/input.component.ts
@@ -354,10 +354,12 @@ export default class WaInput extends WebAwesomeElement implements WebAwesomeForm
     replacement: string,
     start?: number,
     end?: number,
-    selectMode?: 'select' | 'start' | 'end' | 'preserve'
+    selectMode: 'select' | 'start' | 'end' | 'preserve' = 'preserve'
   ) {
-    // @ts-expect-error - start, end, and selectMode are optional
-    this.input.setRangeText(replacement, start, end, selectMode);
+    const selectionStart = start ?? this.input.selectionStart!;
+    const selectionEnd = end ?? this.input.selectionEnd!;
+
+    this.input.setRangeText(replacement, selectionStart, selectionEnd, selectMode);
 
     if (this.value !== this.input.value) {
       this.value = this.input.value;
diff --git a/src/components/input/input.test.ts b/src/components/input/input.test.ts
index 91ec32617..0b1bfbb82 100644
--- a/src/components/input/input.test.ts
+++ b/src/components/input/input.test.ts
@@ -545,5 +545,17 @@ describe('<wa-input>', () => {
     });
   });
 
+  describe('when using the setRangeText() function', () => {
+    it('should set replacement text in the correct location', async () => {
+      const el = await fixture<WaInput>(html` <wa-input value="test"></wa-input> `);
+
+      el.focus();
+      el.setSelectionRange(1, 3);
+      el.setRangeText('boom');
+      await el.updateComplete;
+      expect(el.value).to.equal('tboomt'); // cspell:disable-line
+    });
+  });
+
   runFormControlBaseTests('wa-input');
 });
diff --git a/src/components/textarea/textarea.component.ts b/src/components/textarea/textarea.component.ts
index 1016e8ad8..97ed4581c 100644
--- a/src/components/textarea/textarea.component.ts
+++ b/src/components/textarea/textarea.component.ts
@@ -267,14 +267,12 @@ export default class WaTextarea extends WebAwesomeElement implements WebAwesomeF
     replacement: string,
     start?: number,
     end?: number,
-    selectMode?: 'select' | 'start' | 'end' | 'preserve'
+    selectMode: 'select' | 'start' | 'end' | 'preserve' = 'preserve'
   ) {
-    // @ts-expect-error - start, end, and selectMode are optional
-    this.input.setRangeText(replacement, start, end, selectMode);
+    const selectionStart = start ?? this.input.selectionStart;
+    const selectionEnd = end ?? this.input.selectionEnd;
 
-    if (this.value !== this.input.value) {
-      this.value = this.input.value;
-    }
+    this.input.setRangeText(replacement, selectionStart, selectionEnd, selectMode);
 
     if (this.value !== this.input.value) {
       this.value = this.input.value;
diff --git a/src/components/textarea/textarea.test.ts b/src/components/textarea/textarea.test.ts
index a8c620c0c..aaba57eee 100644
--- a/src/components/textarea/textarea.test.ts
+++ b/src/components/textarea/textarea.test.ts
@@ -295,5 +295,17 @@ describe('<wa-textarea>', () => {
     });
   });
 
+  describe('when using the setRangeText() function', () => {
+    it('should set replacement text in the correct location', async () => {
+      const el = await fixture<WaTextarea>(html` <wa-textarea value="test"></wa-textarea> `);
+
+      el.focus();
+      el.setSelectionRange(1, 3);
+      el.setRangeText('boom');
+      await el.updateComplete;
+      expect(el.value).to.equal('tboomt'); // cspell:disable-line
+    });
+  });
+
   runFormControlBaseTests('wa-textarea');
 });