TypeScript EditorManager.addI18n函数代码示例

  suite.asyncTest('Do not reload language pack if it was already loaded or registered manually.', function (_, done) {
    const langCode = 'mce_lang';
    const langUrl = 'http://example.com/language/' + langCode + '.js';

    EditorManager.addI18n(langCode, {
      from: 'to'
    });

    viewBlock.update('<textarea></textarea>');

    EditorManager.init({
      selector: 'textarea',
      skin_url: '/project/js/tinymce/skins/lightgray',
      language: langCode,
      language_url: langUrl,
      init_instance_callback (ed) {
        const scripts = Tools.grep(document.getElementsByTagName('script'), function (script) {
          return script.src === langUrl;
        });

        LegacyUnit.equal(scripts.length, 0);

        teardown(done);
      }
    });
  });

UnitTest.asynctest('browser.tinymce.core.init.InitContentBodyDirectionalityTest', (success, failure) => {
  Theme();

  EditorManager.addI18n('ar', {
    Bold: 'Bold test',
    _dir: 'rtl'
  });

  const cGetBodyDir = Chain.mapper((editor: any) => editor.getBody().dir);

  const cSetContent = (content: string) => Chain.mapper(function (editor: Editor) {
    return editor.editorCommands.execCommand('mceSetContent', false, content);
  });

  const makeStep = (config, label, expected) => {
    return Chain.asStep({}, [
      McEditor.cFromSettings(config),
      NamedChain.asChain([
        NamedChain.direct(NamedChain.inputName(), Chain.identity, 'editor'),
        NamedChain.direct('editor', cSetContent('<p>Hello world!</p>'), ''),
        NamedChain.direct('editor', cGetBodyDir, 'editorBodyDirectionality'),
        NamedChain.direct('editorBodyDirectionality', Assertions.cAssertEq(label, expected), 'assertion'),
        NamedChain.output('editor')
      ]),
      McEditor.cRemove
    ]);
  };

  Pipeline.async({}, [
    Log.step('TBA', 'Test default directionality of the editor when set to use a rtl language', makeStep(
      {
        base_url: '/project/tinymce/js/tinymce',
        language: 'ar'
      },
      'Directionality should be set to `rtl` by default if the editor is set to a rtl language',
      'rtl'
    )),

    Log.step('TBA', 'Test directionality of the editor when set using the config option while localized using a rtl language', makeStep(
      {
        base_url: '/project/tinymce/js/tinymce',
        language: 'ar',
        directionality: 'ltr'
      },
      'Directionality should be set to `ltr` as per the config option setting',
      'ltr'
    )),

    Log.step('TBA', 'Test directionality of editor when using a language with no directionality set', makeStep(
      {
        base_url: '/project/tinymce/js/tinymce',
        language: 'en'
      },
      'Directionality should not be set if the editor language does not have a directionality',
      ''
    )),
  ], success, failure);
});

  suite.test('translate', function (editor) {
    EditorManager.addI18n('en_US', {
      'input i18n': 'output i18n',
      'value:{0}{1}': 'value translation:{0}{1}'
    });

    LegacyUnit.equal(editor.translate('input i18n'), 'output i18n');
    LegacyUnit.equal(editor.translate(['value:{0}{1}', 'a', 'b']), 'value translation:ab');
  });

UnitTest.asynctest('browser.tinymce.core.EditorRtlTest', function () {
  const success = arguments[arguments.length - 2];
  const failure = arguments[arguments.length - 1];
  const suite = LegacyUnit.createSuite();

  Theme();

  const teardown = function () {
    I18n.rtl = false;
    I18n.setCode('en');
    Factory.get('Control').rtl = false;
  };

  suite.test('UI rendered in RTL mode', function () {
    LegacyUnit.equal(EditorManager.activeEditor.getContainer().className.indexOf('mce-rtl') !== -1, true, 'Should have a mce-rtl class');
    LegacyUnit.equal(EditorManager.activeEditor.rtl, true, 'Should have the rtl property set');
  });

  EditorManager.addI18n('ar', {
    Bold: 'Bold test',
    _dir: 'rtl'
  });

  // Prevents the arabic language pack from being loaded
  EditorManager.overrideDefaults({
    base_url: '/project/tinymce'
  });
  ScriptLoader.ScriptLoader.markDone('http://' + document.location.host + '/project/tinymce/langs/ar.js');

  TinyLoader.setup(function (editor, onSuccess, onFailure) {
    Pipeline.async({}, suite.toSteps(editor), function () {
      teardown();
      onSuccess();
    }, onFailure);
  }, {
    language: 'ar',
    selector: 'textarea',
    add_unload_trigger: false,
    disable_nodechange: true,
    entities: 'raw',
    indent: false,
    skin_url: '/project/js/tinymce/skins/lightgray'
  }, success, failure);
});

UnitTest.asynctest('browser.tinymce.core.EditorRtlTest', (success, failure) => {
  Theme();

  const sAssertRtl = (label: string, rtl: boolean) => Step.sync(() => {
    RawAssertions.assertEq(label, rtl, I18n.isRtl());
  });

  const sSetLangCode = (code: string) => Step.sync(() => {
    I18n.setCode(code);
  });

  EditorManager.addI18n('ar', {
    Bold: 'Bold test',
    _dir: 'rtl'
  });

  I18n.setCode('en');

  TinyLoader.setup(function (editor, onSuccess, onFailure) {
    Pipeline.async({}, [
      sAssertRtl('Should be in rtl mode after creating an editor in arabic', true),
      sSetLangCode('en'),
      sAssertRtl('Should not be in rtl mode when switching back to english', false),
      sSetLangCode('ar'),
      sAssertRtl('Should be in rtl mode after switching back to arabic', true),
      sSetLangCode('en')
    ], function () {
      onSuccess();
    }, onFailure);
  }, {
    language: 'ar',
    selector: 'textarea',
    add_unload_trigger: false,
    disable_nodechange: true,
    entities: 'raw',
    indent: false,
    base_url: '/project/tinymce/js/tinymce'
  }, success, failure);
});

UnitTest.asynctest('Editor (Silver) directionality test', (success, failure) => {
  Theme();

  EditorManager.addI18n('ar', {
    Bold: 'Bold test',
    _dir: 'rtl'
  });

  const cGetEditorContainer = Chain.mapper((editor: Editor) => Element.fromDom(editor.getContainer()));

  const cSetContent = (content: string) => Chain.mapper(function (editor: any) {
    return editor.editorCommands.execCommand('mceSetContent', false, content);
  });

  const makeStep = (config, label, editorStructure) => {
    return Chain.asStep({}, [
      McEditor.cFromSettings(config),
      NamedChain.asChain([
        NamedChain.direct(NamedChain.inputName(), Chain.identity, 'editor'),
        NamedChain.direct('editor', cSetContent('<p>Hello world!</p>'), ''),
        NamedChain.direct('editor', cGetEditorContainer, 'editorContainer'),
        NamedChain.direct('editorContainer', Assertions.cAssertStructure(
          label,
          editorStructure
        ), 'assertion'),
        NamedChain.output('editor')
      ]),
      McEditor.cRemove
    ]);
  };

  Pipeline.async({}, [
    Log.step('TBA', 'Test directionality of the editor UI when set to use a rtl language', makeStep(
      {
        theme: 'silver',
        language: 'ar',
        base_url: '/project/tinymce/js/tinymce'
      },
      'Directionality of the editor UI should be `rtl` when using a rtl language',
      ApproxStructure.build((s, str, arr) => {
        return s.element('div', {
          classes: [ arr.has('tox-tinymce') ],
          attrs: { dir: str.is('rtl') }
        });
      })
    )),

    Log.step('TBA', 'Test directionality of the editor UI when set to use a language without directionality', makeStep(
      {
        theme: 'silver',
        language: 'en',
        base_url: '/project/tinymce/js/tinymce'
      },
      'Directionality of the editor UI should not be set when using a language without directionality',
      ApproxStructure.build((s, str, arr) => {
        return s.element('div', {
          classes: [ arr.has('tox-tinymce') ],
          attrs: { dir: str.none() }
        });
      })
    ))
  ], success, failure);
});