Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix firefox styling of textarea element #512

Merged
merged 3 commits into from
May 11, 2021
Merged

Conversation

timmydoza
Copy link
Contributor

@timmydoza timmydoza commented May 10, 2021

Contributing to Twilio

All third party contributors acknowledge that any contributions they provide will be made under the same open source license that the open source project is provided under.

  • I acknowledge that all my contributions will be made under the project's license.

Pull Request Details

JIRA link(s):

  • N/A

Description

This PR fixes the styling of the chat input in firefox. The input now has a consistent appearance across all browsers. In Chrome and Safari, the appearance has not changed from how it looked previously.

Firefox:
image

To see what it looked like previously, see this issue: #498

Burndown

Before review

  • Updated CHANGELOG.md if necessary
  • Added unit tests if necessary
  • Updated affected documentation
  • Verified locally with npm test
  • Manually sanity tested running locally
  • Included screenshot as PR comment (if needed)
  • Ready for review

Before merge

  • Got one or more +1s
  • Re-tested if necessary

@timmydoza timmydoza requested a review from olipyskoty May 10, 2021 15:51
olipyskoty
olipyskoty previously approved these changes May 10, 2021
Copy link
Contributor

@olipyskoty olipyskoty left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This looks good to me. Excited that we figured this one out!

Here we add the "isTextareaFocused" class when the user is focused on the TextareaAutosize component.
This helps to ensure a consistent appearance across all browsers. Adding padding to the TextareaAutosize
component does not work well in Firefox. See: https://github.com/twilio/twilio-video-app-react/issues/498
*/}
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is a very helpful comment!

@timmydoza
Copy link
Contributor Author

It looks like this PR may have broken a Cypress test. I'll look into it.

@timmydoza timmydoza merged commit 85be841 into master May 11, 2021
@timmydoza timmydoza deleted the fix-firefox-styling branch May 11, 2021 16:25
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants