formio.js icon indicating copy to clipboard operation
formio.js copied to clipboard

[BUG] Form Builder i18n translations affecting components' labels

Open mm-dsibinski opened this issue 4 years ago • 8 comments

Environment

Please provide as many details as you can:

  • Hosting type: only FormIO JS components
  • Formio.js version: 4.12.1
  • Frontend framework: React
  • Browser: Google Chrome
  • Browser version: Version 86.0.4240.198 (Official Build) (64-bit)

Steps to Reproduce

  1. Define i18n translation for 'pl' language, which translates the word 'Display' to 'Wyświetl'
  2. Render FormBuilder and in options set the language to 'pl' and provide i18n translations JSON created in step 1.
  3. Drag any component (e.g. Text field) onto the form builder. In the component's edit window the first tab (Display) is correctly translated to 'Wyświetl':

image

  1. Change the Label of just-inserted component to "Display". See the issue - label's value is also translated to 'Wyświetl': image

Expected behavior

The component's fields (values, labels etc.) are not translated. Only FormIO builder itself is translated.

Observed behavior

Both Form Builder elements (like tabs) and form components are translated. This is not desired. User entered value 'Display' and FormIO changed it to 'Wyświel'. The meaning of "Display" entered by the user might be totally different.

Example

JSFiddle example: https://jsfiddle.net/dsibinski/bLfnda3y/12/

Is it possible to make Form Builder translations be taken into account only for the builder itself, but not for the components' content? If not, what would be the easiest way to achieve that? The goal would be to somehow override rendering all components labels and tell it to not use translations, but its value directly.

mm-dsibinski avatar Nov 30 '20 07:11 mm-dsibinski