angular
angular copied to clipboard
Translations provided for form builder affect the rendered form [BUG]
Environment
Please provide as many details as you can:
- Hosting type
- [] Form.io
- [x ] Local deployment
- Version:
- Formio.js version: 4.13.5
- Frontend framework: Angular
- Formio Angular version: 5.1.1
Steps to reproduce
- Provide initial form builder options (
<form-builder [options]="{}">which do not containlanguage: 'de'property yet - Lazy load current locale and i18n translations for that locale and create a new form builder options object
- Apply the form builder options containing
{language: 'de', i18n: { de: {{ 'Placeholder': 'Platzhalter'}}lazy via the form builder rebuild emitter (<form-builder [rebuild]="...">) - Add a form renderer to the view with
<formio>and provide custom translations for the renderer - Within the form builder, add a form component and assign a label that matches a translation key, that is both contained within the form builder as well as the form renderer translations (while having a different translation on each side)
Expected behavior
The translations which are provided for the form builder may not bleed through to affect the rendered form. The form must be rendered using the translations which are provided for the form renderer.
Also I would expect that the form preview within the form builder exactly matches the form preview that is generated with <formio> when rendering the same JSON, but this is not the case: The preview renderer within the builder always uses the translations from the form builder (which should not be the case).
Observed behavior
- In the above described case where the
language: 'myLocale'property is being applied lazy for the form builder, the translations for the builder are also used to translate the rendered form. Whereas the translations which are provided for the form renderer are being ignored. - There are two options to prevent that the form rendered with
<formio>is being affected by the translations from the builder: Either by providing the form builder option language upfront (eager) or by manually creating and assigning a new i18next instance to the form renderer. This is inconsistent: depending whether you provide the language for the form builder lazy or eager, you may or may not need to create and assign a dedicated i18next instance for the form renderer. - The form preview that is rendered within the form builder is always affected by the translations, which instead should only affect the builder components itself (no matter if language in form builder options is lazy loaded or not)
- I suspect that form builder and form renderer in some cases share the same i18next instance or their instances are both initialised with the translations which are only meant for the builder
Example
Repo: https://github.com/bfoese/formio-i18n-bug-report
