|
2 | 2 |
|
3 | 3 | Node.js is a global platform and so this site has many translations. We use [Crowdin](https://crowdin.com) to translate the Node.js Website |
4 | 4 |
|
5 | | -The translation of the site into languages other than English is handled by [Crowdin translators](https://support.crowdin.com/translation-process-overview/). |
| 5 | +The site's translation into languages other than English is handled by [Crowdin translators](https://support.crowdin.com/translation-process-overview/). |
| 6 | + |
| 7 | +We use [`next-intl`](https://next-intl-docs.vercel.app/) as our Internationalization Library. We recommend reading its documentation for API usage. |
6 | 8 |
|
7 | 9 | ## How to translate |
8 | 10 |
|
@@ -55,11 +57,29 @@ If you're making a new Component and adding Translation Keys for your Component, |
55 | 57 | - The values of each Translation Key should follow the [ICU Message Syntax](https://formatjs.io/docs/core-concepts/icu-syntax/) |
56 | 58 | - All new Translation keys should be added at the bottom of the `i18n/locales/en.json` file. Since this makes it easier for Translators to notice that there are new Translation keys to be translated. |
57 | 59 |
|
| 60 | +#### Notes about Translation Keys |
| 61 | + |
| 62 | +It's important to mention that we use nested translation keys within the Locale files. This means that if your translation key is `components.common.myComponent.something`, you should actually define the key and value within: |
| 63 | + |
| 64 | +```json |
| 65 | +{ |
| 66 | + "components": { |
| 67 | + ..., |
| 68 | + "common": { |
| 69 | + ..., |
| 70 | + "myComponent": { |
| 71 | + "something": "value of translation key" |
| 72 | + } |
| 73 | + } |
| 74 | + } |
| 75 | +} |
| 76 | +``` |
| 77 | + |
58 | 78 | ### Translations and Unit Testing |
59 | 79 |
|
60 | | -Translation Keys should not be translated during Unit Testing. If your Component uses, for example `FormattedMessage`, you should provide the `<IntlProvider>` surrounding your `testing-library` render logic, or you can create a wrapper for your test. Note that you should not import the English messages to your Unit Test as: |
| 80 | +Translation Keys should not be translated during Unit Testing. If your Component uses, for example `usTranslations`, you should provide the `<NextIntlProvider>` surrounding your `testing-library` render logic, or you can create a wrapper for your test. Note that you should not import the English messages to your Unit Test as: |
61 | 81 |
|
62 | 82 | - Unit Testing should test a Component functionality. |
63 | 83 | - Unit Tests should not rely on text, titles, or string bags, as these texts will change arbitrarily and make the test suite fail. |
64 | 84 | - In this case, you should test your component by aria-text, or other `aria-*` attributes or even by class names or other artifacts. |
65 | | -- If you want to test how different languages and text appear within a Component, Visual Regression Testing is recommended. |
| 85 | +- Visual Regression Testing is recommended to test how different languages and text appear within a Component. |
0 commit comments