diff --git a/packages/react/src/Trans.test.tsx b/packages/react/src/Trans.test.tsx index 1cfb730f4..e3c13b96d 100644 --- a/packages/react/src/Trans.test.tsx +++ b/packages/react/src/Trans.test.tsx @@ -44,10 +44,10 @@ describe("Trans component", function () { const originalConsole = console.error console.error = jest.fn() - renderWithI18n() + renderWithI18n() expect(console.error).toHaveBeenCalled() - renderWithI18n() + renderWithI18n() expect(console.error).toHaveBeenCalledTimes(2) console.error = originalConsole }) @@ -56,7 +56,7 @@ describe("Trans component", function () { const originalConsole = console.error console.error = jest.fn() - renderWithI18n() + renderWithI18n() expect(console.error).toHaveBeenCalled() console.error = originalConsole }) @@ -137,9 +137,9 @@ describe("Trans component", function () { }) describe("rendering", function () { - it("should render just a text without wrapping element", function () { - const txt = html() - expect(txt).toEqual("Just a text") + it("should render a text node with no wrapper element", function () { + const txt = html() + expect(txt).toEqual("Some text") }) it("should render custom element", function () { @@ -173,10 +173,34 @@ describe("Trans component", function () { } const span = render( - + ).container.innerHTML - expect(span).toEqual(`
Just a text
`) + expect(span).toEqual(`
Some text
`) + }) + + it("should ignore defaultComponent when render is null", function () { + const ComponentFC: React.FunctionComponent = (props: { children?: React.ReactNode }) => { + return (
{props.children}
) + } + const translation = render( + + + + ).container.innerHTML + expect(translation).toEqual("Some text") + }) + + it("should ignore defaultComponent when component is null", function () { + const ComponentFC: React.FunctionComponent = (props: { children?: React.ReactNode }) => { + return (
{props.children}
) + } + const translation = render( + + + + ).container.innerHTML + expect(translation).toEqual("Some text") }) }) diff --git a/packages/react/src/Trans.tsx b/packages/react/src/Trans.tsx index 454dbfac7..7809aa826 100644 --- a/packages/react/src/Trans.tsx +++ b/packages/react/src/Trans.tsx @@ -65,6 +65,10 @@ export function Trans(props: TransProps) { ? formatElements(_translation, components) : null + if (render === null || component === null) { + return translation + } + const FallbackComponent = defaultComponent || React.Fragment // Validation of `render` and `component` props