TypeScript tinymce-plugins-table-Plugin.default类(方法)实例源码

UnitTest.asynctest('browser.tinymce.plugins.table.DefaultTableToolbarTest', (success, failure) => {
  TablePlugin();
  Theme();

  const tableHtml = '<table><tbody><tr><td>x</td></tr></tbody></table>';

  TinyLoader.setup(function (editor, onSuccess, onFailure) {
    const tinyApis = TinyApis(editor);
    const tinyUi = TinyUi(editor);

    Pipeline.async({}, [
      Logger.t('test default count of toolbar buttons', GeneralSteps.sequence([
        tinyApis.sFocus,
        tinyApis.sSetContent(tableHtml),
        TableTestUtils.sOpenToolbarOn(editor, 'table td', [0]),
        Chain.asStep({}, [
          tinyUi.cWaitForUi('no context found', 'div.tox-pop div.tox-toolbar'),
          Chain.mapper(function (x) {
            return SelectorFilter.descendants(x, 'button').length;
          }),
          Assertions.cAssertEq('has correct count', 8)
        ])
      ]))
    ], onSuccess, onFailure);
  }, {
    plugins: 'table',
    base_url: '/project/tinymce/js/tinymce'
  }, success, failure);
});

UnitTest.asynctest('browser.tinymce.plugins.table.TableGridFalse', function () {
  const success = arguments[arguments.length - 2];
  const failure = arguments[arguments.length - 1];

  ModernTheme();
  TablePlugin();

  TinyLoader.setup(function (editor, onSuccess, onFailure) {
    const tinyApis = TinyApis(editor);
    const tinyUi = TinyUi(editor);

    Pipeline.async({}, [
      Logger.t('test table grid disabled', GeneralSteps.sequence([
        tinyApis.sFocus,
        tinyUi.sClickOnMenu('click table menu', 'span:contains("Table")'),
        tinyUi.sClickOnUi('click table menu', 'div[role="menu"] span:contains("Table")'),
        Chain.asStep({}, [
          tinyUi.cWaitForPopup('wait for popup', 'div[aria-label="Table properties"][role="dialog"]'),
          Chain.op(function (x) {
            Assertions.assertPresence(
              'assert presence of col and row input',
              {
                'label:contains("Cols")': 1,
                'label:contains("Rows")': 1
              }, x);
          })
        ])
      ]))
    ], onSuccess, onFailure);
  }, {
    plugins: 'table',
    table_grid: false,
    skin_url: '/project/js/tinymce/skins/lightgray'
  }, success, failure);
});

UnitTest.asynctest('browser.tinymce.plugins.table.TableTablNavigationDisabledTest', (success, failure) => {
    TablePlugin();
    SilverTheme();

    const tableHtml = '<table><tbody><tr><td>a</td></tr><tr><td>a</td></tr></tbody></table>';

    TinyLoader.setup(function (editor, onSuccess, onFailure) {
      const tinyApis = TinyApis(editor);
      const tinyActions = TinyActions(editor);

      Pipeline.async({},
        Log.steps('TBA', 'Table: test table grid disabled', [
          tinyApis.sFocus,
          tinyApis.sSetContent(tableHtml),
          // NOTE: This isn't really testing anything because this does not exist yet.
          TableTestUtils.sOpenToolbarOn(editor, 'td', [0]),
          tinyActions.sContentKeystroke(Keys.tab(), {}),
          tinyApis.sAssertSelection([0, 0, 0, 0], 0, [0, 0, 0, 0], 1)
        ])
      , onSuccess, onFailure);
    }, {
      plugins: 'table',
      table_tab_navigation: false,
      theme: 'silver',
      base_url: '/project/tinymce/js/tinymce',
    }, success, failure);
  }

UnitTest.asynctest('browser.tinymce.themes.mobile.ThemeTest', (success, failure) => {

  mobileTheme();
  ImagePlugin();
  TablePlugin();
  LinkPlugin();
  PastePlugin();
  ContextMenuPlugin();
  TextPatternPlugin();

  TinyLoader.setup(function (editor, onSuccess, onFailure) {
    const ui = TinyUi(editor);

    Pipeline.async({}, [
      UiFinder.sExists(Element.fromDom(document.body), `.${Styles.resolve('mask-tap-icon')}`),
      ui.sClickOnUi('Click the tap to edit button', `.${Styles.resolve('mask-tap-icon')}`),
      ui.sWaitForUi('Wait mobile Toolbar', `.${Styles.resolve('toolbar')}`),
      ui.sWaitForUi('Check for The first group', '[aria-label="The first group"]'),
      ui.sWaitForUi('Check for the action group', '[aria-label="the action group"]'),
      UiFinder.sNotExists(Element.fromDom(document.body), '[aria-label="The read only mode group"]'),
      UiFinder.sNotExists(Element.fromDom(document.body), `.${Styles.resolve('mask-edit-icon')}`),
      ui.sClickOnUi('Click back to Tap to Edit screen', `.${Styles.resolve('icon-back')}`),
      UiFinder.sExists(Element.fromDom(document.body), `.${Styles.resolve('mask-tap-icon')}`),
    ], onSuccess, onFailure);
  }, {
    theme: 'mobile',
    plugins: 'image table link paste textpattern',
    insert_toolbar: 'quickimage media quicktable',
    selection_toolbar: 'bold italic | quicklink h1 h2 blockquote',
    inline: false,
    base_url: '/project/tinymce/js/tinymce'
  }, success, failure);
});

UnitTest.asynctest('browser.tinymce.plugins.table.TableGridFalse', (success, failure) => {
  TablePlugin();
  SilverTheme();

  TinyLoader.setup(function (editor, onSuccess, onFailure) {
    const tinyApis = TinyApis(editor);
    const tinyUi = TinyUi(editor);

    Pipeline.async({}, [
      Logger.t('test table grid disabled', GeneralSteps.sequence([
        tinyApis.sFocus,
        tinyUi.sClickOnMenu('click table menu', 'span:contains("Table")'),
        Waiter.sTryUntil('click table menu', tinyUi.sClickOnUi('click table menu', 'div.tox-menu div.tox-collection__item .tox-collection__item-label:contains("Table")'), 10, 1000),
        Chain.asStep({}, [
          tinyUi.cWaitForPopup('wait for popup', 'div.tox-dialog:has(div.tox-dialog__title:contains("Table Properties"))'),
          Chain.op(function (x) {
            Assertions.assertPresence(
              'assert presence of col and row input',
              {
                'label:contains("Cols")': 1,
                'label:contains("Rows")': 1
              }, x);
          })
        ])
      ]))
    ], onSuccess, onFailure);
  }, {
    plugins: 'table',
    table_grid: false,
    theme: 'silver',
    base_url: '/project/tinymce/js/tinymce',
  }, success, failure);
});

UnitTest.asynctest('browser.tinymce.plugins.table.DisableTableToolbarTest', function () {
  const success = arguments[arguments.length - 2];
  const failure = arguments[arguments.length - 1];

  ModernTheme();
  TablePlugin();

  const tableHtml = '<table><tbody><tr><td>x</td></tr></tbody></table>';

  TinyLoader.setup(function (editor, onSuccess, onFailure) {
    const tinyApis = TinyApis(editor);

    Pipeline.async({}, [
      Logger.t('test that table toolbar can be disabled', GeneralSteps.sequence([
        tinyApis.sFocus,
        tinyApis.sSetSetting('table_toolbar', 'tableprops tabledelete'),
        tinyApis.sSetContent(tableHtml),
        tinyApis.sSetSelection([0, 0, 0, 0, 0], 0, [0, 0, 0, 0, 0], 1),
        Step.wait(100), // How should I do this better?
                        // I want to check that the inline toolbar does not appear,
                        // but I have to wait unless it won't exist any way because it's too fast
        UiFinder.sNotExists(TinyDom.fromDom(document.body), 'div[aria-label="Inline toolbar"]')
      ]))
    ], onSuccess, onFailure);
  }, {
    plugins: 'table',
    table_toolbar: '',
    skin_url: '/project/js/tinymce/skins/lightgray'
  }, success, failure);
});

UnitTest.asynctest('browser.tinymce.plugins.table.CustomTableToolbarTest', function () {
  const success = arguments[arguments.length - 2];
  const failure = arguments[arguments.length - 1];

  ModernTheme();
  TablePlugin();

  const tableHtml = '<table><tbody><tr><td>x</td></tr></tbody></table>';

  TinyLoader.setup(function (editor, onSuccess, onFailure) {
    const tinyApis = TinyApis(editor);
    const tinyUi = TinyUi(editor);

    Pipeline.async({}, [
      Logger.t('test custom count of toolbar buttons', GeneralSteps.sequence([
        tinyApis.sFocus,
        tinyApis.sSetContent(tableHtml),
        TableTestUtils.sOpenToolbarOn(editor, 'table td', [0]),
        Chain.asStep({}, [
          tinyUi.cWaitForUi('no context found', 'div[aria-label="Inline toolbar"]'),
          Chain.mapper(function (x) {
            return SelectorFilter.descendants(x, 'button').length;
          }),
          Assertions.cAssertEq('has correct count', 2)
        ])
      ]))
    ], onSuccess, onFailure);
  }, {
    plugins: 'table',
    table_toolbar: 'tableprops tabledelete',
    skin_url: '/project/js/tinymce/skins/lightgray'
  }, success, failure);
});

function () {
    const success = arguments[arguments.length - 2];
    const failure = arguments[arguments.length - 1];

    ModernTheme();
    TablePlugin();

    const tableHtml = '<table><tbody><tr><td>a</td></tr><tr><td>a</td></tr></tbody></table>';

    TinyLoader.setup(function (editor, onSuccess, onFailure) {
      const tinyApis = TinyApis(editor);
      const tinyActions = TinyActions(editor);

      Pipeline.async({}, [
        Logger.t('test table grid disabled', GeneralSteps.sequence([
          tinyApis.sFocus,
          tinyApis.sSetContent(tableHtml),
          TableTestUtils.sOpenToolbarOn(editor, 'td', [0]),
          tinyActions.sContentKeystroke(Keys.tab(), {}),
          tinyApis.sAssertSelection([0, 0, 0, 0], 0, [0, 0, 0, 0], 1)
        ]))
      ], onSuccess, onFailure);
    }, {
      plugins: 'table',
      table_tab_navigation: false,
      skin_url: '/project/js/tinymce/skins/lightgray'
    }, success, failure);
  }

UnitTest.asynctest('browser.tinymce.plugins.table.TableCellPropsStyleTest', (success, failure) => {
  Plugin();
  Theme();

  TinyLoader.setup(function (editor: Editor, onSuccess, onFailure) {
    const tinyApis = TinyApis(editor);
    const tinyUi = TinyUi(editor);

    Pipeline.async({}, [
      Logger.t('change background color on selected table cells', GeneralSteps.sequence([
        tinyApis.sSetContent(
          '<table style="border-collapse: collapse;" border="1"><tbody><tr><td style="background-color: blue;" data-mce-selected="1">a</td><td style="background-color: blue;" data-mce-selected="1">b</td></tr></tbody></table>'
        ),
        tinyApis.sSetSelection([0, 0, 0, 1, 0], 1, [0, 0, 0, 1, 0], 1),
        tinyApis.sExecCommand('mceTableCellProps'),
        Chain.asStep({}, [
          tinyUi.cWaitForPopup('cell prop popup', 'div[aria-label="Cell properties"]'),
          tinyUi.cFillDialogWith({ backgroundColor: 'red'}),
          UiFinder.cFindIn('button:contains("Ok")'),
          Mouse.cClick
        ]),
        tinyApis.sAssertContent(
          '<table style="border-collapse: collapse;" border="1"><tbody><tr><td style="background-color: red;">a</td><td style="background-color: red;">b</td></tr></tbody></table>'
        ),
      ]))
    ], onSuccess, onFailure);
  }, {
    plugins: 'table',
    indent: false,
    skin_url: '/project/js/tinymce/skins/lightgray'
  }, success, failure);
});

UnitTest.asynctest('browser.tinymce.plugins.table.DisableTableToolbarTest', (success, failure) => {
  TablePlugin();
  Theme();

  const tableHtml = '<table><tbody><tr><td>x</td></tr></tbody></table>';

  TinyLoader.setup(function (editor, onSuccess, onFailure) {
    const tinyApis = TinyApis(editor);

    Pipeline.async({},
     Log.steps('TBA', 'Table: test that table toolbar can be disabled', [
        tinyApis.sFocus,
        tinyApis.sSetSetting('table_toolbar', 'tableprops tabledelete'),
        tinyApis.sSetContent(tableHtml),
        tinyApis.sSetSelection([0, 0, 0, 0, 0], 0, [0, 0, 0, 0, 0], 1),
        Step.wait(100), // How should I do this better?
                        // I want to check that the inline toolbar does not appear,
                        // but I have to wait unless it won't exist any way because it's too fast
        UiFinder.sNotExists(TinyDom.fromDom(document.body), 'div.tox-pop div.tox-toolbar')
      ])
    , onSuccess, onFailure);
  }, {
    plugins: 'table',
    table_toolbar: '',
    base_url: '/project/tinymce/js/tinymce'
  }, success, failure);
});