search

Semantic-Org / Semantic-UI-React

The official Semantic-UI-React integration
https://react.semantic-ui.com
MIT License
13.21k stars 4.05k forks source link

Dropdown breaks with Chrome's built-in translator / Google Translate API #4375

Open brunohq opened 2 years ago

brunohq commented 2 years ago

Bug Report

When using Chrome's built-in feature or the Google Translate API to translate forms everything works fine except Dropdowns. The option selected by the user doesn't match what is shown in the dropdown field.

Steps

  1. Add the Google Translate script to a form (easier to reproduce, otherwise you'll have to write the form page in another language)
  2. Select a different language in the Google Translate dropdown (ex: Spanish)
  3. Select an option from the Dropdown field

Expected Result

The text shown in the dropdown field should be the one just selected (or at least the original text without translation corresponding to the option selected)

Actual Result

The input value changes to the correct one, but the text shown in doesn't change.

Version

2.1.3

Testcase

https://codesandbox.io/s/dropwdown-google-translate-q9pghu?file=/example.js

welcome[bot] commented 2 years ago

👋 Thanks for opening your first issue here! If you're reporting a 🐞 bug, please make sure you've completed all the fields in the issue template so we can best help.

We get a lot of issues on this repo, so please be patient and we will get back to you as soon as we can.

brunohq commented 2 years ago

As a sidenote, Multiple Selections work fine, which is interesting.