@tolgee/core 4.9.2 → 4.9.3-rc.04b22e6.0

package/src/FormatSimple/formatter.test.ts

@@ -0,0 +1,190 @@
+import { TranslateParams } from '../types';
+import IntlMessageFormat from 'intl-messageformat';
+import { formatter } from './formatter';
+import {
+  ErrorCode,
+  ERROR_PARAM_EMPTY,
+  ERROR_UNEXPECTED_CHAR,
+  ERROR_UNEXPECTED_END,
+  FormatError,
+} from './FormatError';
+
+function icu(text: string, params?: TranslateParams) {
+  return new IntlMessageFormat(text, 'en', undefined, {
+    ignoreTag: true,
+  }).format(params);
+}
+
+function getText() {
+  return expect.getState().currentTestName.replace('simple formatter ', '');
+}
+
+function matchIcu(params?: TranslateParams) {
+  const text = getText();
+  expect(formatter(text, params)).toEqual(icu(text, params));
+}
+
+function expectToThrow(
+  text: string,
+  code?: ErrorCode,
+  params?: TranslateParams
+) {
+  let error: FormatError | undefined = undefined;
+  try {
+    formatter(text, params);
+  } catch (e) {
+    error = e as FormatError;
+  }
+  expect(error).toBeInstanceOf(FormatError);
+  expect(error?.code).toEqual(code);
+}
+
+function expectToThrowWithIcu(code?: ErrorCode, params?: TranslateParams) {
+  const text = getText();
+  expect(() => icu(text, params)).toThrow();
+  expectToThrow(text, code, params);
+}
+
+function unsupported(code?: ErrorCode, params?: TranslateParams) {
+  const text = getText();
+  expect(() => icu(text, params)).not.toThrow();
+  expectToThrow(text, code, params);
+}
+
+function combineChars(chars: string[]) {
+  const result: string[] = [];
+  chars.forEach((char) => {
+    [`start${char}`, `${char}end`, `mid${char}dle`, char].forEach((param) => {
+      result.push(param);
+    });
+  });
+  return result;
+}
+
+function characterInParamSupported(chars: string[]) {
+  combineChars(chars).forEach((param) => {
+    const text = `test { ${param} } param`;
+    it(`works with: ${text}`, () => {
+      const params = { [param]: 'valid' };
+      expect(icu(text, params)).toEqual('test valid param');
+      expect(formatter(text, params)).toEqual('test valid param');
+    });
+  });
+}
+
+function characterInParamFailWithIcu(chars: string[]) {
+  combineChars(chars).forEach((param) => {
+    const text = `test { ${param} } param`;
+    it(`fails with: ${text}`, () => {
+      const params = { [param]: 'test' };
+      expect(() => icu(text, params)).toThrow();
+      expectToThrow(text, ERROR_UNEXPECTED_CHAR, params);
+    });
+  });
+}
+
+function characterInParamFail(chars: string[]) {
+  combineChars(chars).forEach((param) => {
+    const text = `test { ${param} } param`;
+    it(`works with: ${text}`, () => {
+      const params = { [param]: 'valid' };
+      expectToThrow(text, ERROR_UNEXPECTED_CHAR, params);
+    });
+  });
+}
+
+describe('simple formatter', () => {
+  test('test test', () => {
+    expect(getText()).toEqual('test test');
+  });
+
+  test('simple test', () => {
+    matchIcu();
+  });
+
+  test('this is {name}', () => {
+    matchIcu({ name: 'Bob' });
+  });
+
+  test('this is {  name  }', () => {
+    matchIcu({ name: 'Bob' });
+  });
+
+  test('{ user } has { num } apples.', () => {
+    matchIcu({ user: 'John', num: 2 });
+  });
+
+  test('passing params, but no params here', () => {
+    matchIcu({ user: 'John', num: 2 });
+  });
+
+  test('{ user } has { user } apples.', () => {
+    matchIcu({ user: 'John', num: 2 });
+  });
+
+  test("ICU: '{ parameter '} format", () => {
+    matchIcu();
+  });
+
+  test("this '{ escaped }' well", () => {
+    matchIcu();
+  });
+
+  test("this is '{ weird } but valid", () => {
+    matchIcu();
+  });
+
+  test("edge case '", () => {
+    matchIcu();
+  });
+
+  test("What's {subject}?", () => {
+    matchIcu({ subject: 'that' });
+  });
+
+  test('this is also } right', () => {
+    matchIcu();
+  });
+
+  test('this is just {} wrong', () => {
+    expectToThrowWithIcu(ERROR_PARAM_EMPTY);
+  });
+
+  test('this also { } wrong', () => {
+    expectToThrowWithIcu(ERROR_PARAM_EMPTY);
+  });
+
+  test('this plain { , } wrong', () => {
+    expectToThrowWithIcu(ERROR_UNEXPECTED_CHAR);
+  });
+
+  test('this is { unexpected', () => {
+    expectToThrowWithIcu(ERROR_UNEXPECTED_END);
+  });
+
+  test('this is obviously bad { yo yo }', () => {
+    expectToThrowWithIcu(ERROR_UNEXPECTED_CHAR);
+  });
+
+  test('this is obviously bad { yo, }', () => {
+    expectToThrowWithIcu(ERROR_UNEXPECTED_CHAR);
+  });
+
+  test('good for icu { yo, number } not for me', () => {
+    unsupported(ERROR_UNEXPECTED_CHAR, { yo: 6 });
+  });
+
+  describe('supported characters in params', () => {
+    characterInParamSupported(Array.from('019_axAX'));
+  });
+
+  describe('invalid characters in params', () => {
+    characterInParamFailWithIcu('[+-@#$~^&*{%)(§\'"`!?:.;<>[]\\=|☺'.split(''));
+  });
+
+  describe('unsupported characters which are supported in ICU', () => {
+    characterInParamFail(Array.from('šřýíéúůĚŽÝÁÍÉůú¨ˇ'));
+    characterInParamFail(['汉字', '字', 'हि', 'हिन्दी']);
+    characterInParamFail(['😊']);
+  });
+});

package/src/FormatSimple/formatter.ts

@@ -0,0 +1,19 @@
+import { DefaultParamType, TranslateParams } from '../types';
+import { formatParser } from './formatParser';
+
+export function formatter(
+  translation: string,
+  params?: TranslateParams<DefaultParamType>
+) {
+  const [texts, pars] = formatParser(translation);
+  const result = [texts[0]];
+  for (let i = 1; i < texts.length; i++) {
+    const parameter = params?.[pars[i - 1]];
+    if (parameter === undefined) {
+      throw new Error(`Missing parameter "${pars[i - 1]}" in "${translation}"`);
+    }
+    result.push(String(parameter));
+    result.push(texts[i]);
+  }
+  return result.join('');
+}

package/src/Tolgee.ts

@@ -1,335 +1,84 @@
-import { TolgeeConfig } from './TolgeeConfig';
+import { Controller } from './Controller/Controller';
 import {
-  InstantProps,
-  InstantPropsTags,
-  TolgeeModule,
-  TranslateProps,
-  TranslatePropsTags,
-  TranslationTags,
-  TranslationParams,
-  TranslationParamsTags,
+  Options,
+  TolgeeInstance,
+  TolgeePlugin,
+  ObserverOptions,
 } from './types';
 
-import { EventEmitterImpl } from './services/EventEmitter';
-import { DependencyService } from './services/DependencyService';
-
-export class Tolgee {
-  private dependencyService: DependencyService;
-
-  private constructor() {
-    this.dependencyService = new DependencyService();
-  }
-
-  get properties() {
-    return this.dependencyService.properties;
-  }
-
-  public get lang() {
-    return this.properties.currentLanguage;
-  }
-
-  /**
-   * This sets a new language.
-   *
-   * Using this setter can behave buggy when you change languages
-   * too fast, since it changes the language property before
-   * translations are actually loaded.
-   * @deprecated use asynchronous changeLanguage method.
-   */
-  public set lang(newLanguage) {
-    this.properties.currentLanguage = newLanguage;
-
-    this.dependencyService.translationService
-      .loadTranslations(newLanguage)
-      .then(() => {
-        this.emitLangChangeEvent(newLanguage);
-      });
-  }
-
-  public get defaultLanguage() {
-    return this.properties.config.defaultLanguage;
-  }
-
-  public get onLangChange() {
-    return this.dependencyService.eventService.LANGUAGE_CHANGED;
-  }
-
-  public get onTranslationChange() {
-    return this.dependencyService.eventService.TRANSLATION_CHANGED;
-  }
-
-  /**
-   * Is emitted when language is loaded for the first time
-   */
-  public get onLangLoaded() {
-    return this.dependencyService.eventService.LANGUAGE_LOADED;
-  }
-
-  /**
-   * True if loading is needed to wait for Tolgee init.
-   * When translation data are provided statically (using import
-   * as staticData config property) then there is no need for translation
-   * fetching so initial loading is not needed at all.
-   */
-  get initialLoading(): boolean {
-    const currentLang = this.properties.currentLanguage;
-    const fallbackLang = this.properties.config.fallbackLanguage;
-    const fallbackPreloading = this.properties.config.preloadFallback;
-    const isStaticDataProvided = (data?: any) => {
-      return data !== undefined && typeof data !== 'function';
-    };
-
-    return (
-      !isStaticDataProvided(this.properties.config.staticData?.[currentLang]) ||
-      (!!fallbackPreloading &&
-        !isStaticDataProvided(
-          this.properties.config.staticData?.[fallbackLang]
-        ))
-    );
-  }
-
-  private get coreService() {
-    return this.dependencyService.coreService;
-  }
-
-  static use(module: TolgeeModule) {
-    return new Tolgee().use(module);
-  }
-
-  static init(config: TolgeeConfig) {
-    return new Tolgee().init(config);
-  }
-
-  /**
-   * Sets the new language.
-   *
-   * Emits the onLangChange and onLangChangeAndLoad events after
-   * the translations are loaded.
-   *
-   * @return Promise<void> Resolves when translations are loaded
-   */
-  public async changeLanguage(newLanguage: string): Promise<void> {
-    await this.dependencyService.translationService.loadTranslations(
-      newLanguage
-    );
-    this.properties.currentLanguage = newLanguage;
-    this.emitLangChangeEvent(newLanguage);
-  }
-
-  use(module: TolgeeModule) {
-    this.dependencyService.moduleService.addModule(module);
-    return this;
-  }
-
-  init(config: TolgeeConfig) {
-    this.dependencyService.init(config);
-    const { apiKey, apiUrl } = this.dependencyService.properties.config;
-    this.dependencyService.properties.mode =
-      apiKey && apiUrl ? 'development' : 'production';
-
-    return this;
-  }
-
-  public async run(): Promise<void> {
-    this.dependencyService.run();
-    if (this.properties.mode === 'development') {
-      try {
-        await this.coreService.loadApiKeyDetails();
-      } catch (e) {
-        // eslint-disable-next-line no-console
-        console.error("Couldn't connect to Tolgee");
-        // eslint-disable-next-line no-console
-        console.error(e);
-        this.properties.mode = 'production';
-      }
-    }
-
-    await this.dependencyService.translationService.loadTranslations();
-    await this.dependencyService.pluginManager.run();
-
-    if (this.properties.config.preloadFallback) {
-      await this.dependencyService.translationService.loadTranslations(
-        this.properties.config.fallbackLanguage
-      );
-    }
-
-    await this.refresh();
-
-    if (this.properties.config.watch) {
-      this.dependencyService.observer.observe();
-    }
-  }
-
-  public async refresh() {
-    return this.dependencyService.wrapper.handleSubtree(
-      this.properties.config.targetElement
-    );
-  }
-
-  async translate(props: TranslateProps): Promise<string>;
-  async translate<T>(props: TranslatePropsTags<T>): Promise<TranslationTags<T>>;
-
-  async translate(
-    key: string,
-    params?: TranslationParams,
-    noWrap?: boolean,
-    defaultValue?: string
-  ): Promise<string>;
-  async translate<T>(
-    key: string,
-    params?: TranslationParamsTags<T>,
-    noWrap?: boolean,
-    defaultValue?: string
-  ): Promise<TranslationTags<T>>;
-
-  async translate(
-    keyOrProps: string | TranslatePropsTags<any>,
-    params: TranslationParamsTags<any> = {},
-    noWrap = false,
-    defaultValue: string | undefined = undefined
-  ): Promise<TranslationTags<any>> {
-    const key = typeof keyOrProps === 'string' ? keyOrProps : keyOrProps.key;
-    let orEmpty = undefined;
-    if (typeof keyOrProps === 'object') {
-      const props = keyOrProps as TranslateProps;
-      // if values are not provided in props object, get them from function
-      // params defaults
-      params = props.params !== undefined ? props.params : params;
-      noWrap = props.noWrap !== undefined ? props.noWrap : noWrap;
-      defaultValue =
-        props.defaultValue !== undefined ? props.defaultValue : defaultValue;
-      orEmpty = props.orEmpty;
-    }
-
-    const translation = await this.dependencyService.textService.translate(
-      key,
-      params,
-      undefined,
-      orEmpty,
-      defaultValue
-    );
-
-    if (this.properties.mode === 'development' && !noWrap) {
-      await this.coreService.loadApiKeyDetails();
-      return this.dependencyService.wrapper.wrap(
-        key,
-        params,
-        defaultValue,
-        translation
-      );
-    }
-
-    return translation;
-  }
-
-  wrap(
-    key: string,
-    params?: TranslationParams,
-    defaultValue?: string | undefined,
-    translation?: string
-  ): string;
-  wrap<T>(
-    key: string,
-    params?: TranslationTags<T>,
-    defaultValue?: string | undefined,
-    translation?: TranslationTags<T>
-  ): TranslationTags<T>;
-
-  wrap(
-    key: string,
-    params?: any,
-    defaultValue?: string | undefined,
-    translation?: TranslationTags<any>
-  ): TranslationTags<any> {
-    if (this.properties.mode === 'development') {
-      return this.dependencyService.wrapper.wrap(
-        key,
-        params,
-        defaultValue,
-        translation
-      );
-    } else {
-      return translation || defaultValue;
-    }
-  }
-
-  instant(
-    key: string,
-    params?: TranslationParams,
-    noWrap?: boolean,
-    orEmpty?: boolean,
-    defaultValue?: string
-  ): string;
-  instant<T>(
-    key: string,
-    params?: TranslationParamsTags<T>,
-    noWrap?: boolean,
-    orEmpty?: boolean,
-    defaultValue?: string
-  ): TranslationTags<T>;
-
-  instant(props: InstantProps): string;
-  instant<T>(props: InstantPropsTags<T>): TranslationTags<T>;
-
-  instant(
-    keyOrProps: string | InstantPropsTags<any>,
-    params: TranslationParams = {},
-    noWrap = false,
-    orEmpty?: boolean,
-    defaultValue?: string
-  ) {
-    const key = typeof keyOrProps === 'string' ? keyOrProps : keyOrProps.key;
-    if (typeof keyOrProps === 'object') {
-      const props = keyOrProps as InstantProps;
-      // if values are not provided in props object, get them from function
-      // params defaults
-      params = props.params !== undefined ? props.params : params;
-      noWrap = props.noWrap !== undefined ? props.noWrap : noWrap;
-      defaultValue =
-        props.defaultValue !== undefined ? props.defaultValue : defaultValue;
-      orEmpty = props.orEmpty !== undefined ? props.orEmpty : orEmpty;
-    }
-
-    const translation = this.dependencyService.textService.instant(
-      key,
-      params,
-      undefined,
-      orEmpty,
-      defaultValue
-    );
-
-    if (this.properties.mode === 'development' && !noWrap) {
-      return this.dependencyService.wrapper.wrap(
-        key,
-        params,
-        defaultValue,
-        translation
-      );
-    }
-    return translation;
-  }
-
-  /**
-   * Get currently cached translations for all languages
-   */
-  public getCachedTranslations() {
-    return this.dependencyService.translationService.getCachedTranslations();
-  }
-
-  /**
-   * Loads translations for given language or returns them from cache
-   * @returns Loaded translations
-   */
-  public loadTranslations(lang: string) {
-    return this.dependencyService.translationService.loadTranslations(lang);
-  }
-
-  public stop = () => {
-    this.dependencyService.stop();
+export const Tolgee = (options?: Partial<Options>): TolgeeInstance => {
+  const controller = Controller({
+    options,
+  });
+
+  const pluginTools = Object.freeze({
+    setFinalFormatter: controller.setFinalFormatter,
+    addFormatter: controller.addFormatter,
+    setObserver: controller.setObserver,
+    hasObserver: controller.hasObserver,
+    setUi: controller.setUi,
+    hasUi: controller.hasUi,
+    setDevBackend: controller.setDevBackend,
+    addBackend: controller.addBackend,
+    setLanguageDetector: controller.setLanguageDetector,
+    setLanguageStorage: controller.setLanguageStorage,
+    overrideCredentials: controller.overrideCredentials,
+  });
+
+  const withRestart = (callback: () => void) => {
+    const wasRunning = controller.isRunning();
+    wasRunning && controller.stop();
+    callback();
+    wasRunning && controller.run();
   };
 
-  private emitLangChangeEvent(value: string) {
-    const langChangedEmitter = this.onLangChange as EventEmitterImpl<any>;
-    langChangedEmitter.emit(value);
-  }
-}
+  const tolgee: TolgeeInstance = Object.freeze({
+    // event listeners
+    on: controller.on,
+    onKeyUpdate: controller.onKeyUpdate.listenSome,
+
+    // state
+    getLanguage: controller.getLanguage,
+    getPendingLanguage: controller.getPendingLanguage,
+    changeLanguage: controller.changeLanguage,
+    changeTranslation: controller.changeTranslation,
+    addActiveNs: controller.addActiveNs,
+    removeActiveNs: controller.removeActiveNs,
+    loadRecords: controller.loadRecords,
+    loadRecord: controller.loadRecord,
+    addStaticData: controller.addStaticData,
+    getRecord: controller.getRecord,
+    getAllRecords: controller.getAllRecords,
+    isLoaded: controller.isLoaded,
+    isInitialLoading: controller.isInitialLoading,
+    isLoading: controller.isLoading,
+    isFetching: controller.isFetching,
+    isRunning: controller.isRunning,
+    run: controller.run,
+    stop: controller.stop,
+    t: controller.t,
+    highlight: controller.highlight,
+    getInitialOptions: controller.getInitialOptions,
+    isDev: controller.isDev,
+    wrap: controller.wrap,
+    unwrap: controller.unwrap,
+
+    // plugins
+    setObserverOptions: (options: Partial<ObserverOptions>) => {
+      controller.setObserverOptions(options);
+      return tolgee;
+    },
+    use: (plugin: TolgeePlugin | undefined) => {
+      if (plugin) {
+        withRestart(() => plugin(tolgee, pluginTools));
+      }
+      return tolgee;
+    },
+    init: (options: Partial<Options>) => {
+      withRestart(() => controller.init(options));
+      return tolgee;
+    },
+  });
+
+  return tolgee;
+};

package/src/TranslateParams.test.ts

@@ -0,0 +1,41 @@
+import { getTranslateParams } from './TranslateParams';
+import { TranslateProps } from './types';
+
+const testParams: TranslateProps = {
+  key: 'test',
+  defaultValue: 'Test',
+  noWrap: true,
+  ns: [],
+  orEmpty: true,
+  params: { yo: 'yo', ns: '(this is param not namespace)' },
+};
+
+describe('getTranslateParams', () => {
+  it('manages regular params', () => {
+    const result = getTranslateParams(testParams);
+    expect(result).toEqual(testParams);
+  });
+
+  it('manages key with default value', () => {
+    const result = getTranslateParams('test', 'Test');
+    expect(result).toEqual({ key: 'test', defaultValue: 'Test' });
+  });
+
+  it('manages key with options', () => {
+    const result = getTranslateParams('test', { noWrap: true, yo: 'yo' });
+    expect(result).toEqual({ key: 'test', noWrap: true, params: { yo: 'yo' } });
+  });
+
+  it('manages key default and options', () => {
+    const result = getTranslateParams('test', 'Test', {
+      noWrap: true,
+      ns: [],
+      orEmpty: true,
+      yo: 'yo',
+      params: {
+        ns: '(this is param not namespace)',
+      },
+    });
+    expect(result).toEqual(testParams);
+  });
+});