abinavseelan / react-input-trigger

React component for handling character triggers inside textareas and input fields. 🐼
MIT License
88 stars 20 forks source link

Fix TypeError: Argument 1 of Window.getComputedStyle does not implement interface Element. #15

Open TonisPiip opened 5 years ago

TonisPiip commented 5 years ago

Fix for issue #12 and likely #10

The issue is that if textarea / input isn't a direct child to the component it will send a react component to getCaretCoordinates

Solution for getting the correct element, 1st: with prop getter method getElement, 2nd: Already existing method of children maping / cloning, do check for it being either a input text area 3ed: finding first occurrence of an input or textarea element.

I wanted to have some warning in case there's multple, but linting forbade it. Also linting didn't like Element being used before it was Defined, despite it being a preexisting definition...,

Also Why the timeouts with 0ms? With my fork where I'm using quill, I need to add ~1-5 ms to have quill update the cursor positon before the triger evaluates the position, but I don't get a reason for it now.

TonisPiip commented 5 years ago

https://codesandbox.io/s/primereact-test-i1fxh

I made this codebox to test with a component that has an input inside.. however it seems codesandbox isn't loading the right fork... might be getting it form npm still... very odd... I need to get to sleep...

UPDATE: Tried again to have codesandbox run off my branch but it always seems t error out or used some cached version of the current NPM build. If you save it as a zip and run npm install; npm run start you can see that it works if you open the console.