Skip to content

Commit

Permalink
align context handling of Trans component with t function, fixes #1729
Browse files Browse the repository at this point in the history
  • Loading branch information
adrai committed Mar 6, 2024
1 parent ea0c6e5 commit 9684fab
Show file tree
Hide file tree
Showing 6 changed files with 85 additions and 3 deletions.
4 changes: 4 additions & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
@@ -1,3 +1,7 @@
### 14.0.6

- align context handling of Trans component with t function, fixes [1729](https://github.com/i18next/react-i18next/issues/1729)

### 14.0.5

- Fix [1691](https://github.com/i18next/react-i18next/issues/1691) for strict mode, by preserving change language binding [1720](https://github.com/i18next/react-i18next/pull/1720)
Expand Down
2 changes: 1 addition & 1 deletion react-i18next.js
Original file line number Diff line number Diff line change
Expand Up @@ -459,7 +459,7 @@
return children;
}
const t = tFromProps || i18n.t.bind(i18n) || (k => k);
if (context) tOptions.context = context;
tOptions.context = context;
const reactI18nextOptions = {
...getDefaults(),
...(i18n.options && i18n.options.react)
Expand Down
2 changes: 1 addition & 1 deletion react-i18next.min.js

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion src/TransWithoutContext.js
Original file line number Diff line number Diff line change
Expand Up @@ -329,7 +329,7 @@ export function Trans({

const t = tFromProps || i18n.t.bind(i18n) || ((k) => k);

if (context) tOptions.context = context;
tOptions.context = context;

const reactI18nextOptions = { ...getDefaults(), ...(i18n.options && i18n.options.react) };

Expand Down
2 changes: 2 additions & 0 deletions test/i18n.js
Original file line number Diff line number Diff line change
Expand Up @@ -48,6 +48,8 @@ i18n.init({
transTestCustomUnescapeSecond: 'Vertrauens­kennwert',
testTransWithCtx: 'Go <1>there</1>.',
testTransWithCtx_home: 'Go <1>home</1>.',
testTransNoChildrenWithCtx: 'Go {{context}}.',
testTransNoChildrenWithCtx_home: 'Go to Switzerland.',
'You have {{count}} message_one': 'You have {{count}} message',
'You have {{count}} message_other': 'You have {{count}} messages',
deepPath: {
Expand Down
76 changes: 76 additions & 0 deletions test/trans.render.spec.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -835,6 +835,82 @@ describe('trans with context property', () => {
});
});

describe('trans with undefined context property', () => {
function TestComponent({ parent }) {
return (
<Trans i18nKey="testTransWithCtx" context={undefined} parent={parent}>
Open <Link to="/msgs">here</Link>.
</Trans>
);
}

it('should render correct content', () => {
const { container } = render(<TestComponent />);
expect(container.firstChild).toMatchInlineSnapshot(`
<div>
Go
<a
href="/msgs"
>
there
</a>
.
</div>
`);
});
});

describe('trans with context property but no children', () => {
function TestComponent({ parent }) {
return (
<Trans i18nKey="testTransNoChildrenWithCtx" context="home" parent={parent} />
);
}

it('should render correct content', () => {
const { container } = render(<TestComponent />);
expect(container.firstChild).toMatchInlineSnapshot(`
<div>
Go to Switzerland.
</div>
`);
});
});

describe('trans with undefined context property but no children', () => {
function TestComponent({ parent }) {
return (
<Trans i18nKey="testTransNoChildrenWithCtx" context={undefined} parent={parent} />
);
}

it('should render correct content', () => {
const { container } = render(<TestComponent />);
expect(container.firstChild).toMatchInlineSnapshot(`
<div>
Go .
</div>
`);
});
});

describe('trans with different context property but no children', () => {
function TestComponent({ parent }) {
return (
<Trans i18nKey="testTransNoChildrenWithCtx" context="somewhere" parent={parent} />
);
}

it('should render correct content', () => {
const { container } = render(<TestComponent />);
expect(container.firstChild).toMatchInlineSnapshot(`
<div>
Go somewhere.
</div>
`);
});
});

describe('trans with defaults property and children', () => {
function TestComponent() {
return (
Expand Down

0 comments on commit 9684fab

Please sign in to comment.