i18n always null when run unit test

[blackblue2712]

I have a pure function look like this

import { i18n } from "next-i18next";

export function validateUserEmail(email: string): [boolean, string] {
  email = email.trim();

 console.log(i18n); // null when run unit test

  if (!email) {
    return [false, i18n?.t("modallogin.validate.email-required") || ""];
  }

  if (email.length < MIN_LENGTH) {
    return [
      false,
      i18n?.t("modallogin.validate.length", { length: `${MIN_LENGTH}` }) || "",
    ];
  }

  if (!emailRegex.test(email)) {
    return [
      false,
      i18n?.t("modallogin.validate.email-valid") || "",
    ];
  }

  return [true, ""];
}

The test look like:

expect(validateUserEmail("")).toEqual([false, "Email is required."]);

But got [false, ""]

This is my config file:

module.exports = {
  i18n: {
    defaultLocale: "en",
    // otherLanguages: ['ja', 'he'],
    locales: ["en", "ja", "he"],
    defaultNS: "General",
  },
  // localePath: path.resolve('./public/static/locales'),
  localePath: "./public/static/locales",
  interpolation: {
    prefix: "{{",
    suffix: "}}",

    format: (value, format, lng) => {
      if (format === "number") return formatters[lng].format(value);

      const isDate = value instanceof Date;
      if (isDate) {
        const locale = localeMap[lng];
        switch (format) {
          case "en-date":
            return formatDate(value, "MMMM dd, yyyy", { locale });
          case "vi-date":
            return formatDate(value, "dd MMMM yyyy", { locale });
          default:
            return formatDate(value, format);
        }
      }

      return value;
    },
  },
  objectNotation: true,
  keySeparator: ".",
  nsSeparator: ":",
  // use: [
  //   new PhraseInContextEditorPostProcessor({
  //     phraseEnabled: true,
  //     projectId: "XXX",
  //   }),
  //   // LanguageDetector.default
  // ],
  // postProcess: ["phraseInContextEditor"],
};

and I use it in next.config.js file:

import { i18n } from "./i18n";
...
module.exports = withPlugins([i18], config)

When I write unit test for it, I always get i18n is null. How can I fix it?

[aaimio]

The i18n instance won't be initialised since you're purely testing that function (there's no setup of i18n anywhere).

You'll likely just want to test the validateUserEmail function rather than the t function.

Something like below should suffice (assuming you use jest):

jest.mock('next-i18next', () => ({
  i18n: { t: (input: string) => input },
}));

it('validates a user email', () => {
  const result = validateUserEmail(undefined as any);
  expect(result).toEqual([false, 'modallogin.validate.email-required']);
});

This mocks the i18n.t function to return the key instead, allowing you to test the functionality of your function without having to set up any i18n configuration.

As a sidenote, with your current validateUserEmail it will throw an error because if you pass undefined as a parameter, it will error out on the email.trim() function call because email is undefined.

If you're not sure whether email has a value you could make the change below, you'll then have to handle this case in your code too.

- export function validateUserEmail(email: string): [boolean, string] {
+ export function validateUserEmail(email?: string): [boolean, string] {

[blackblue2712]

Thanks for your suggest

I did the same thing before like you said but still not working

The i18n is still null

Sidenote: validateUserEmail(""), the email still empty string not undefined at all which return modallogin.validate.email-required error

[blackblue2712]

OK found the solution..

Added mock in jest config file

// config.ts

jest.mock('next-i18next', () => ({
  i18n: { t: (input: string) => input },
}));

Not sure why mock at test file not working