fix: Inconsistent use of accents in Safari #16

[blacktail]

…s enabled

[codecov]

Codecov Report

Merging #18 (8ee80c4) into master (12dc37f) will increase coverage by 0.02%.
The diff coverage is 100.00%.

❗ Current head 8ee80c4 differs from pull request most recent head 8f41453. Consider uploading reports for the commit 8f41453 to get more accurate results

@@            Coverage Diff             @@
##           master      #18      +/-   ##
==========================================
+ Coverage   98.02%   98.05%   +0.02%     
==========================================
  Files           3        3              
  Lines         152      154       +2     
  Branches       45       47       +2     
==========================================
+ Hits          149      151       +2     
  Misses          3        3              

Impacted Files	Coverage Δ
src/ResizableTextArea.tsx	98.41% <100.00%> (+0.05%)	⬆️

📣 Codecov can now indicate which changes are the most critical in Pull Requests. Learn more

[blacktail]

Root cause:
This MR fix a problem in firefox about two years ago:
ant-design/ant-design#21870

Added this code block:

fixFirefoxAutoScroll = () => {
    try {
      if (document.activeElement === this.textArea) {
        const currentStart = this.textArea.selectionStart;
        const currentEnd = this.textArea.selectionEnd;
        this.textArea.setSelectionRange(currentStart, currentEnd);
      }
    } catch (e) {}
  };

This code will cause many safari problems regard of composition event. the fixFirefoxAutoScroll should only be called when the browser is firefox. But currently, it will also be called in safari or other browsers

[afc163]

Don't use UA but feature detection.

[afc163]

Safari or Firefox.

[blacktail]

Fixed,

use window.hasOwnProperty('mozInnerScreenX') instead

[LFDanLu]

QQ, is this accents stuff not a problem in Firefox as well? Was wondering if you've tried doing something like

      if (inputValue?.startsWith(lastInputValue.current)) {
        input.scrollTop = input.scrollHeight;
      }

instead of using the selectionStart/selectionEnd approach for FF autoscroll. Just ran into a similar problem in React Spectrum and was curious on any prior discoveries you've made when testing here.

EDIT: Never mind, did some more testing and the above is buggy, breaks if you are typing in the middle and your cursor then exits the visible area and some other cases.