import assert from 'assert' ;
import React from 'react' ;
import { shallow } from 'enzyme' ;
import { getMessage } from './i18n-helper' ;
describe ( 'i18n helper' , function ( ) {
const TEST _LOCALE _CODE = 'TEST_LOCALE_CODE' ;
const TEST _KEY _1 = 'TEST_KEY_1' ;
const TEST _KEY _2 = 'TEST_KEY_2' ;
const TEST _KEY _3 = 'TEST_KEY_3' ;
const TEST _KEY _4 = 'TEST_KEY_4' ;
const TEST _KEY _5 = 'TEST_KEY_5' ;
const TEST _KEY _6 = 'TEST_KEY_6' ;
const TEST _KEY _6 _HELPER = 'TEST_KEY_6_HELPER' ;
const TEST _KEY _7 = 'TEST_KEY_7' ;
const TEST _KEY _7 _HELPER _1 = 'TEST_KEY_7_HELPER_1' ;
const TEST _KEY _7 _HELPER _2 = 'TEST_KEY_7_HELPER_2' ;
const TEST _KEY _8 = 'TEST_KEY_8' ;
const TEST _KEY _8 _HELPER _1 = 'TEST_KEY_8_HELPER_1' ;
const TEST _KEY _8 _HELPER _2 = 'TEST_KEY_8_HELPER_2' ;
const TEST _SUBSTITUTION _1 = 'TEST_SUBSTITUTION_1' ;
const TEST _SUBSTITUTION _2 = 'TEST_SUBSTITUTION_2' ;
const TEST _SUBSTITUTION _3 = 'TEST_SUBSTITUTION_3' ;
const TEST _SUBSTITUTION _4 = 'TEST_SUBSTITUTION_4' ;
const TEST _SUBSTITUTION _5 = 'TEST_SUBSTITUTION_5' ;
const testLocaleMessages = {
[ TEST _KEY _1 ] : {
message : 'This is a simple message.' ,
expectedResult : 'This is a simple message.' ,
} ,
[ TEST _KEY _2 ] : {
message : 'This is a message with a single non-react substitution $1.' ,
} ,
[ TEST _KEY _3 ] : {
message : 'This is a message with two non-react substitutions $1 and $2.' ,
} ,
[ TEST _KEY _4 ] : {
message : '$1 - $2 - $3 - $4 - $5' ,
} ,
[ TEST _KEY _5 ] : {
message : '$1 - $2 - $3' ,
} ,
[ TEST _KEY _6 ] : {
message : 'Testing a react substitution $1.' ,
} ,
[ TEST _KEY _6 _HELPER ] : {
message : TEST _SUBSTITUTION _1 ,
} ,
[ TEST _KEY _7 ] : {
message : 'Testing a react substitution $1 and another $2.' ,
} ,
[ TEST _KEY _7 _HELPER _1 ] : {
message : TEST _SUBSTITUTION _1 ,
} ,
[ TEST _KEY _7 _HELPER _2 ] : {
message : TEST _SUBSTITUTION _2 ,
} ,
[ TEST _KEY _8 ] : {
message :
'Testing a mix $1 of react substitutions $2 and string substitutions $3 + $4.' ,
} ,
[ TEST _KEY _8 _HELPER _1 ] : {
message : TEST _SUBSTITUTION _3 ,
} ,
[ TEST _KEY _8 _HELPER _2 ] : {
message : TEST _SUBSTITUTION _4 ,
} ,
} ;
const t = getMessage . bind ( null , TEST _LOCALE _CODE , testLocaleMessages ) ;
const TEST _SUBSTITUTION _6 = (
< div style = { { color : 'red' } } key = "test-react-substitutions-1" >
{ t ( TEST _KEY _6 _HELPER ) }
< / d i v >
) ;
const TEST _SUBSTITUTION _7 _1 = (
< div style = { { color : 'red' } } key = "test-react-substitutions-1" >
{ t ( TEST _KEY _7 _HELPER _1 ) }
< / d i v >
) ;
const TEST _SUBSTITUTION _7 _2 = (
< div style = { { color : 'blue' } } key = "test-react-substitutions-1" >
{ t ( TEST _KEY _7 _HELPER _2 ) }
< / d i v >
) ;
const TEST _SUBSTITUTION _8 _1 = (
< div style = { { color : 'orange' } } key = "test-react-substitutions-1" >
{ t ( TEST _KEY _8 _HELPER _1 ) }
< / d i v >
) ;
const TEST _SUBSTITUTION _8 _2 = (
< div style = { { color : 'pink' } } key = "test-react-substitutions-1" >
{ t ( TEST _KEY _8 _HELPER _2 ) }
< / d i v >
) ;
describe ( 'getMessage' , function ( ) {
it ( 'should return the exact message paired with key if there are no substitutions' , function ( ) {
const result = t ( TEST _KEY _1 ) ;
assert . strictEqual ( result , 'This is a simple message.' ) ;
} ) ;
it ( 'should return the correct message when a single non-react substitution is made' , function ( ) {
const result = t ( TEST _KEY _2 , [ TEST _SUBSTITUTION _1 ] ) ;
assert . strictEqual (
result ,
` This is a message with a single non-react substitution ${ TEST _SUBSTITUTION _1 } . ` ,
) ;
} ) ;
it ( 'should return the correct message when two non-react substitutions are made' , function ( ) {
const result = t ( TEST _KEY _3 , [ TEST _SUBSTITUTION _1 , TEST _SUBSTITUTION _2 ] ) ;
assert . strictEqual (
result ,
` This is a message with two non-react substitutions ${ TEST _SUBSTITUTION _1 } and ${ TEST _SUBSTITUTION _2 } . ` ,
) ;
} ) ;
it ( 'should return the correct message when multiple non-react substitutions are made' , function ( ) {
const result = t ( TEST _KEY _4 , [
TEST _SUBSTITUTION _1 ,
TEST _SUBSTITUTION _2 ,
TEST _SUBSTITUTION _3 ,
TEST _SUBSTITUTION _4 ,
TEST _SUBSTITUTION _5 ,
] ) ;
assert . strictEqual (
result ,
` ${ TEST _SUBSTITUTION _1 } - ${ TEST _SUBSTITUTION _2 } - ${ TEST _SUBSTITUTION _3 } - ${ TEST _SUBSTITUTION _4 } - ${ TEST _SUBSTITUTION _5 } ` ,
) ;
} ) ;
it ( 'should correctly render falsey substitutions' , function ( ) {
const result = t ( TEST _KEY _4 , [ 0 , - 0 , '' , false , NaN ] ) ;
assert . strictEqual ( result , '0 - 0 - - false - NaN' ) ;
} ) ;
it ( 'should render nothing for "null" and "undefined" substitutions' , function ( ) {
const result = t ( TEST _KEY _5 , [ null , TEST _SUBSTITUTION _2 ] ) ;
assert . strictEqual ( result , ` - ${ TEST _SUBSTITUTION _2 } - ` ) ;
} ) ;
it ( 'should return the correct message when a single react substitution is made' , function ( ) {
const result = t ( TEST _KEY _6 , [ TEST _SUBSTITUTION _6 ] ) ;
assert . strictEqual (
shallow ( result ) . html ( ) ,
'<span> Testing a react substitution <div style="color:red">TEST_SUBSTITUTION_1</div>. </span>' ,
) ;
} ) ;
it ( 'should return the correct message when two react substitutions are made' , function ( ) {
const result = t ( TEST _KEY _7 , [
TEST _SUBSTITUTION _7 _1 ,
TEST _SUBSTITUTION _7 _2 ,
] ) ;
assert . strictEqual (
shallow ( result ) . html ( ) ,
'<span> Testing a react substitution <div style="color:red">TEST_SUBSTITUTION_1</div> and another <div style="color:blue">TEST_SUBSTITUTION_2</div>. </span>' ,
) ;
} ) ;
it ( 'should return the correct message when substituting a mix of react elements and strings' , function ( ) {
const result = t ( TEST _KEY _8 , [
TEST _SUBSTITUTION _1 ,
TEST _SUBSTITUTION _8 _1 ,
TEST _SUBSTITUTION _2 ,
TEST _SUBSTITUTION _8 _2 ,
] ) ;
assert . strictEqual (
shallow ( result ) . html ( ) ,
'<span> Testing a mix TEST_SUBSTITUTION_1 of react substitutions <div style="color:orange">TEST_SUBSTITUTION_3</div> and string substitutions TEST_SUBSTITUTION_2 + <div style="color:pink">TEST_SUBSTITUTION_4</div>. </span>' ,
) ;
} ) ;
} ) ;
} ) ;