import { Trans, useTranslation } from 'react-i18next' describe('i18n', function () { describe('t', function () { it('translates a plain string', function () { const Test = () => { const { t } = useTranslation() return
{t('accept')}
} cy.mount() cy.findByText('Accept') }) it('uses defaultValues', function () { const Test = () => { const { t } = useTranslation() return
{t('welcome_to_sl')}
} cy.mount() cy.findByText('Welcome to Overleaf') }) it('uses values', function () { const Test = () => { const { t } = useTranslation() return
{t('sort_by_x', { x: 'name' })}
} cy.mount() cy.findByText('Sort by name') }) }) describe('Trans', function () { it('uses values', function () { const Test = () => { return (
) } cy.mount() cy.findByText('Sort by name') }) it('uses an object of components', function () { const Test = () => { return (
}} values={{ email: 'test@example.com' }} shouldUnescape tOptions={{ interpolation: { escapeValue: true } }} />
) } cy.mount() cy.findByTestId('container') .should( 'have.text', 'In order to match your institutional metadata, your account is associated with the email test@example.com.' ) .find('b') .should('have.length', 1) .should('have.text', 'test@example.com') }) it('uses an array of components', function () { const Test = () => { return (
]} // eslint-disable-line react/jsx-key values={{ institutionName: 'Test' }} shouldUnescape tOptions={{ interpolation: { escapeValue: true } }} />
) } cy.mount() cy.findByTestId('container') .should('have.text', 'Are you still at Test?') .find('b') .should('have.length', 1) .should('have.text', 'Test') }) it('escapes special characters', function () { const Test = () => { return (
]} // eslint-disable-line react/jsx-key values={{ institutionName: "T&e'sting" }} shouldUnescape tOptions={{ interpolation: { escapeValue: true } }} />
) } cy.mount() cy.findByTestId('container') .should('have.text', "Are you still at T&e'sting?") .find('b') .should('have.length', 1) .should('have.text', "T&e'sting") }) it('does not convert markup in values to components', function () { const Test = () => { return (
]} // eslint-disable-line react/jsx-key values={{ institutionName: "T&e'sting", }} shouldUnescape tOptions={{ interpolation: { escapeValue: true } }} />
) } cy.mount() cy.findByTestId('container') .should( 'have.text', "Are you still at T&e'sting?" ) .find('b') .should('have.length', 1) .should('have.text', "T&e'sting") }) }) })