Skip to content
This repository has been archived by the owner on Mar 1, 2024. It is now read-only.

IE11 getComputedStyle prevention #70

Open
wants to merge 2 commits into
base: master
Choose a base branch
from
Open

IE11 getComputedStyle prevention #70

wants to merge 2 commits into from

Conversation

eek
Copy link
Contributor

@eek eek commented Oct 18, 2017

There's this weird bug in IE11 and below, if there is a React Component with ReactAutosizeTextarea, the component will no longer trigger componentDidMount because window.getComputedStyle(ta, null); throws an access denied.

Should be fixed in autosize repo, but until then, added autosize in a try catch to prevent the error from disrupting the whole application

Also updated package.json to autosize v.4 (thought that will fix it), apparently not.

…in `window.getComputedStyle(ta, null);`

Update: Autosize to v4
@nemobot nemobot added the WIP label Oct 18, 2017
@eek
Copy link
Contributor Author

eek commented Oct 18, 2017

@FrancescoCioria can you check this out, and maybe push it? 😁

@FrancescoCioria
Copy link
Contributor

weird, I never had this bug in IE11. are you rendering the textarea inside an iframe?

@eek
Copy link
Contributor Author

eek commented Oct 23, 2017

Nope, just a normal TextareaAutosize element.

The weird part is that sometimes worked and sometimes didn't and it all started since we updated to React 16

@FrancescoCioria
Copy link
Contributor

FrancescoCioria commented Oct 24, 2017

can we replicate it via a fiddle?

I'm not fond of adding a try catch for a bug that can't be reproduced :)

PS: if you're using React16 you could fallback to a plain <textarea> when it fails using the new componentDidCatch method

// AutosizeTextarea.js
import _TextareaAutosize from 'react-autosize-textarea'

export default class TextareaAutosize extends React.Component {

  state = {
    autosizeCrashed: false
  }

  componentDidCatch(error, info) {
    // Display fallback <textarea>
    this.setState({ autosizeCrashed: true });
  }

  render() {
    if (this.state.autosizeCrashed) {
      return <textarea {...this.props} />;
    }
    return <_TextareaAutosize {...this.props} />;
  }
}

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants