addons/isl/src/__tests__/i18n.test.tsxblame
View source
b69ab311/**
b69ab312 * Copyright (c) Meta Platforms, Inc. and affiliates.
b69ab313 *
b69ab314 * This source code is licensed under the MIT license found in the
b69ab315 * LICENSE file in the root directory of this source tree.
b69ab316 */
b69ab317
b69ab318import {render, screen} from '@testing-library/react';
b69ab319import {I18nSupport, t, T} from '../i18n';
b69ab3110import '../i18n/en/common.json';
b69ab3111
b69ab3112jest.mock(
b69ab3113 '../i18n/en/common.json',
b69ab3114 () => ({
b69ab3115 translate_me: 'this was translated',
b69ab3116 plural_one: 'There is one apple',
b69ab3117 plural_other: 'There are $count apples',
b69ab3118 replace_and_plural_one: 'There is one $type apple',
b69ab3119 replace_and_plural_other: 'There are $count $type apples',
b69ab3120 }),
b69ab3121 {virtual: true},
b69ab3122);
b69ab3123
b69ab3124describe('i18n', () => {
b69ab3125 describe('<T>', () => {
b69ab3126 it('can render translations', () => {
b69ab3127 render(
b69ab3128 <I18nSupport>
b69ab3129 <T>translate_me</T>
b69ab3130 </I18nSupport>,
b69ab3131 );
b69ab3132
b69ab3133 expect(screen.getByText('this was translated')).toBeInTheDocument();
b69ab3134 expect(screen.queryByText('translate_me')).not.toBeInTheDocument();
b69ab3135 });
b69ab3136
b69ab3137 it('can render plurals: singular', () => {
b69ab3138 render(
b69ab3139 <I18nSupport>
b69ab3140 <T count={1}>plural</T>
b69ab3141 </I18nSupport>,
b69ab3142 );
b69ab3143
b69ab3144 expect(screen.getByText('There is one apple')).toBeInTheDocument();
b69ab3145 expect(screen.queryByText('plural')).not.toBeInTheDocument();
b69ab3146 });
b69ab3147
b69ab3148 it('can render plurals: plural', () => {
b69ab3149 render(
b69ab3150 <I18nSupport>
b69ab3151 <T count={2}>plural</T>
b69ab3152 </I18nSupport>,
b69ab3153 );
b69ab3154
b69ab3155 expect(screen.getByText('There are 2 apples')).toBeInTheDocument();
b69ab3156 expect(screen.queryByText('plural')).not.toBeInTheDocument();
b69ab3157 });
b69ab3158
b69ab3159 it('can replace with strings', () => {
b69ab3160 render(
b69ab3161 <I18nSupport>
b69ab3162 <T replace={{apples: 'oranges'}}>compare apples and bananas</T>
b69ab3163 </I18nSupport>,
b69ab3164 );
b69ab3165
b69ab3166 expect(screen.getByText('oranges and bananas', {exact: false})).toBeInTheDocument();
b69ab3167 expect(screen.queryByText('apples', {exact: false})).not.toBeInTheDocument();
b69ab3168 });
b69ab3169
b69ab3170 it('can replace with components', () => {
b69ab3171 render(
b69ab3172 <I18nSupport>
b69ab3173 <T replace={{apples: <b data-testid="orange">oranges</b>}}>compare apples and bananas</T>
b69ab3174 </I18nSupport>,
b69ab3175 );
b69ab3176
b69ab3177 expect(screen.getByTestId('orange')).toBeInTheDocument();
b69ab3178 expect(screen.queryByText('apples', {exact: false})).not.toBeInTheDocument();
b69ab3179 });
b69ab3180
b69ab3181 it('can replace multiple times', () => {
b69ab3182 render(
b69ab3183 <I18nSupport>
b69ab3184 <T replace={{apples: <b data-testid="orange">oranges</b>, bananas: 'grapefruit'}}>
b69ab3185 compare apples and bananas
b69ab3186 </T>
b69ab3187 </I18nSupport>,
b69ab3188 );
b69ab3189
b69ab3190 expect(screen.getByTestId('orange')).toBeInTheDocument();
b69ab3191 expect(screen.getByText('and grapefruit', {exact: false})).toBeInTheDocument();
b69ab3192 expect(screen.queryByText('apples', {exact: false})).not.toBeInTheDocument();
b69ab3193 expect(screen.queryByText('bananas', {exact: false})).not.toBeInTheDocument();
b69ab3194 });
b69ab3195
b69ab3196 it('can replace with plurals: singular', () => {
b69ab3197 render(
b69ab3198 <I18nSupport>
b69ab3199 <T replace={{$type: 'cool'}} count={1}>
b69ab31100 replace_and_plural
b69ab31101 </T>
b69ab31102 </I18nSupport>,
b69ab31103 );
b69ab31104
b69ab31105 expect(screen.queryByText('There is one cool apple')).toBeInTheDocument();
b69ab31106 });
b69ab31107
b69ab31108 it('can replace with plurals: plural', () => {
b69ab31109 render(
b69ab31110 <I18nSupport>
b69ab31111 <T replace={{$type: 'cool'}} count={2}>
b69ab31112 replace_and_plural
b69ab31113 </T>
b69ab31114 </I18nSupport>,
b69ab31115 );
b69ab31116
b69ab31117 expect(screen.queryByText('There are 2 cool apples')).toBeInTheDocument();
b69ab31118 });
b69ab31119 });
b69ab31120
b69ab31121 describe('t()', () => {
b69ab31122 it('can render translations', () => {
b69ab31123 expect(t('translate_me')).toEqual('this was translated');
b69ab31124 });
b69ab31125
b69ab31126 it('can render plurals: singular', () => {
b69ab31127 expect(t('plural', {count: 1})).toEqual('There is one apple');
b69ab31128 });
b69ab31129
b69ab31130 it('can render plurals: plural', () => {
b69ab31131 expect(t('plural', {count: 2})).toEqual('There are 2 apples');
b69ab31132 });
b69ab31133
b69ab31134 it('can replace with strings', () => {
b69ab31135 expect(t('compare apples and bananas', {replace: {apples: 'oranges'}})).toEqual(
b69ab31136 'compare oranges and bananas',
b69ab31137 );
b69ab31138 });
b69ab31139
b69ab31140 it('can replace multiple times', () => {
b69ab31141 expect(
b69ab31142 t('compare apples and bananas', {replace: {apples: 'oranges', bananas: 'grapefruit'}}),
b69ab31143 ).toEqual('compare oranges and grapefruit');
b69ab31144 });
b69ab31145
b69ab31146 it('can replace with plurals: singular', () => {
b69ab31147 expect(t('replace_and_plural', {replace: {$type: 'cool'}, count: 1})).toEqual(
b69ab31148 'There is one cool apple',
b69ab31149 );
b69ab31150 });
b69ab31151
b69ab31152 it('can replace with plurals: plural', () => {
b69ab31153 expect(t('replace_and_plural', {replace: {$type: 'cool'}, count: 2})).toEqual(
b69ab31154 'There are 2 cool apples',
b69ab31155 );
b69ab31156 });
b69ab31157 });
b69ab31158});