• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

TypeScript sugar.Element类代码示例

原作者: [db:作者] 来自: [db:来源] 收藏 邀请

本文整理汇总了TypeScript中@ephox/sugar.Element的典型用法代码示例。如果您正苦于以下问题:TypeScript Element类的具体用法?TypeScript Element怎么用?TypeScript Element使用的例子?那么恭喜您, 这里精选的类代码示例或许可以为您提供帮助。



在下文中一共展示了Element类的10个代码示例,这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞,您的评价将有助于我们的系统推荐出更棒的TypeScript代码示例。

示例1:

 return Chain.op(function (cellOption: Option<any>) {
   const cell = cellOption.getOrDie('x');
   const expectedContainer = Hierarchy.follow(Element.fromDom(viewBlock.get()), path).getOrDie();
   Assertions.assertDomEq('Should be the expected element', expectedContainer, Element.fromDom(cell));
 });
开发者ID:danielpunkass,项目名称:tinymce,代码行数:5,代码来源:TableCellsTest.ts


示例2: getter

    return Chain.on(function (editor, next, die) {
      const container = editor.iframeElement;
      const getter = dimension === 'width' ? Width.get : Height.get;
      const actualValue = typeof value === 'string' ? container.style[dimension] : getter(Element.fromDom(container));

      Assertions.assertEq('Editors content area has expected ' + dimension, value, actualValue);

      next(Chain.wrap(editor));
    });
开发者ID:aha-app,项目名称:tinymce-word-paste-filter,代码行数:9,代码来源:DimensionsTest.ts


示例3: function

const nativeRangeToSelectionRange = function (r) {
  return Selection.range(Element.fromDom(r.startContainer), r.startOffset, Element.fromDom(r.endContainer), r.endOffset);
};
开发者ID:tinymce,项目名称:tinymce,代码行数:3,代码来源:SelectionBookmark.ts


示例4: function

const insertBrBefore = function (editor, inline) {
  const br = Element.fromTag('br');
  Insert.before(Element.fromDom(inline), br);
  editor.undoManager.add();
};
开发者ID:abstask,项目名称:tinymce,代码行数:5,代码来源:InsertBr.ts


示例5: TinyApis

    (editor, onSuccess, onFailure) => {
      const doc = Element.fromDom(document);

      const apis = TinyApis(editor);

      Pipeline.async({}, [
        Log.step('TBA', 'Check structure of font format', GeneralSteps.sequence([
          Step.label('Add styles to the editor', TestHelpers.GuiSetup.mAddStyles(doc, [
            ':focus { background-color: rgb(222, 224, 226); }',
            '.tox-collection__item-label > * { margin: 0px; }'
          ])),

          Step.label('Set editor content', apis.sSetContent('<blockquote>Text</blockquote>')),
          Step.label('Set cursor position', apis.sSetCursor([0, 0], 'Te'.length)),

          Step.label('Click on the style select button', Mouse.sClickOn(Body.body(), '.tox-toolbar button')),
          Step.label('Wait for the style select menu', UiFinder.sWaitForVisible('Waiting for menu', Body.body(), '[role="menu"]')),
          Step.label('Checking menu structure', Chain.asStep(Body.body(), [
            UiFinder.cFindIn('[role="menu"]'),
            Assertions.cAssertStructure(
              'Checking structure',
              ApproxStructure.build((s, str, arr) => {
                return s.element('div', {
                  classes: [arr.has('tox-menu'), arr.has('tox-collection'), arr.has('tox-collection--list')],
                  children: [
                    s.element('div', {
                      classes: [arr.has('tox-collection__group')],
                      children: [
                        s.element('div', {
                          classes: [arr.has('tox-collection__item')],
                          children: [
                            s.element('div', { classes: [arr.has('tox-collection__item-icon')] }),
                            s.element('div', {
                              classes: [arr.has('tox-collection__item-label')],
                              children: [
                                s.element('h1', { html: str.is('Title') })
                              ]
                            })
                          ]
                        }),
                        s.element('div', {
                          classes: [arr.has('tox-collection__item')],
                          children: [
                            s.element('div', { classes: [arr.has('tox-collection__item-icon')] }),
                            s.element('div', {
                              classes: [arr.has('tox-collection__item-label')],
                              children: [
                                s.element('h2', { html: str.is('Main heading') })
                              ]
                            })
                          ]
                        }),
                        s.element('div', {
                          classes: [arr.has('tox-collection__item')],
                          children: [
                            s.element('div', { classes: [arr.has('tox-collection__item-icon')] }),
                            s.element('div', {
                              classes: [arr.has('tox-collection__item-label')],
                              children: [
                                s.element('h3', { html: str.is('Sub heading') })
                              ]
                            })
                          ]
                        })
                      ]
                    }),

                    s.element('div', {
                      classes: [arr.has('tox-collection__group')],
                      children: [
                        s.element('div', {
                          classes: [ arr.has('tox-collection__item'), arr.has('tox-collection__group-heading') ],
                          children: [ s.text(str.is('Example Separator')) ]
                        }),
                        s.element('div', {
                          classes: [ arr.has('tox-collection__item') ],
                          children: [
                            s.element('div', { classes: [arr.has('tox-collection__item-icon')] }),
                            s.element('div', {
                              classes: [arr.has('tox-collection__item-label')],
                              children: [
                                s.element('p', { html: str.is('Paragraph') })
                              ]
                            })
                          ]
                        }),
                        s.element('div', {
                          classes: [arr.has('tox-collection__item')],
                          children: [
                            s.element('div', { classes: [arr.has('tox-collection__item-icon')] }),
                            s.element('div', {
                              classes: [arr.has('tox-collection__item-label')],
                              children: [
                                s.element('blockquote', { html: str.is('Blockquote') })
                              ]
                            })
                          ]
                        }),
                        s.element('div', {
                          classes: [arr.has('tox-collection__item')],
//.........这里部分代码省略.........
开发者ID:tinymce,项目名称:tinymce,代码行数:101,代码来源:OxideFontFormatMenuTest.ts


示例6: TinyApis

  TinyLoader.setup(function (editor, onSuccess, onFailure) {
    const tinyApis = TinyApis(editor);
    const tinyUi = TinyUi(editor);
    const doc = Element.fromDom(document);
    const body = Body.body();

    const tableHtml = '<table style = "width: 5%;">' +
    '<tbody>' +
      '<tr>' +
        '<td></td>' +
      '</tr>' +
    '</tbody>' +
    '</table>';

    const sAddTableAndOpenContextToolbar = (html: string) => GeneralSteps.sequence([
      tinyApis.sSetContent(html),
      tinyUi.sWaitForUi('Wait for table context toolbar', '.tox-toolbar button[aria-label="Table properties"]'),
    ]);

    // Use keyboard shortcut ctrl+F9 to navigate to the context toolbar
    const sPressKeyboardShortcutKey = Keyboard.sKeydown(Element.fromDom(editor.getDoc()), 120, { ctrl: true });
    const sPressRightArrowKey = Keyboard.sKeydown(doc, Keys.right(), { });
    const sPressTabKey = Keyboard.sKeydown(doc, Keys.tab(), { });

    // Assert focus is on the expected toolbar button
    const sAssertFocusOnItem = (label: string, selector: string) => {
      return FocusTools.sTryOnSelector(`Focus should be on: ${label}`, doc, selector);
    };

    const sAssertButtonDisabled = (label: string, selector: string) => {
      return tinyUi.sWaitForUi(label, `.tox-pop__dialog ${selector}:disabled`);
    };

    const sClickOnToolbarButton = (selector: string) => {
      return Chain.asStep({}, [
        Chain.fromParent(tinyUi.cWaitForPopup('wait for context toolbar', '.tox-pop__dialog div'), [
          Chain.fromChains([
            UiFinder.cFindIn(selector),
            Mouse.cClick
          ])
        ])
      ]);
    };

    const sAssertHtmlStructure = (label, expectedHtml) => Chain.asStep({editor}, [ NamedChain.read('editor', Chain.op((editor) => {
      const elm = Replication.deep(Element.fromDom(editor.getBody()));
      Arr.each(SelectorFilter.descendants(elm, '*[data-mce-bogus="all"]'), Remove.remove);
      const actualHtml = Html.get(elm);
      Assertions.assertHtmlStructure(label, `<body>${expectedHtml}</body>`, `<body>${actualHtml}</body>`);
    }))]);

    const sOpenAndCloseDialog = GeneralSteps.sequence([
      Chain.asStep(editor, [
        tinyUi.cWaitForPopup('wait for dialog', 'div[role="dialog"]'),
        UiChains.cCloseDialog('div[role="dialog"]')
      ]),
      Waiter.sTryUntil('Wait for dialog to close', UiFinder.sNotExists(body, 'div[role="dialog"]'), 50, 5000)
    ]);

    Pipeline.async({}, [
      tinyApis.sFocus,
      Log.stepsAsStep('TBA', 'Table: context toolbar keyboard navigation test', [
        sAddTableAndOpenContextToolbar(tableHtml),
        sPressKeyboardShortcutKey,
        sAssertFocusOnItem('Table properties button', 'button[aria-label="Table properties"]'),
        sPressRightArrowKey,
        sAssertFocusOnItem('Delete table button', 'button[aria-label="Delete table"]'),
        sPressTabKey,
        sAssertFocusOnItem('Insert row above button', 'button[aria-label="Insert row before"]'),
        sPressRightArrowKey,
        sAssertFocusOnItem('Insert row below button', 'button[aria-label="Insert row after"]'),
        sPressRightArrowKey,
        sAssertFocusOnItem('Delete row button', 'button[aria-label="Delete row"]'),
        sPressTabKey,
        sAssertFocusOnItem('Insert column before button', 'button[aria-label="Insert column before"]'),
        sPressRightArrowKey,
        sAssertFocusOnItem('Insert column after button', 'button[aria-label="Insert column after"]'),
        sPressRightArrowKey,
        sAssertFocusOnItem('Delete column button', 'button[aria-label="Delete column"]'),
        sPressTabKey,
        sAssertFocusOnItem('Table properties button', 'button[aria-label="Table properties"]'),
        sClickOnToolbarButton('button[aria-label="Delete table"]'),
        sAssertHtmlStructure('Assert delete table', '<p><br></p>')
      ]),
      Log.stepsAsStep('TBA', 'Table: context toolbar functionality test', [
        sAddTableAndOpenContextToolbar(tableHtml),

        sClickOnToolbarButton('button[aria-label="Table properties"]'),
        sOpenAndCloseDialog,

        sClickOnToolbarButton('button[aria-label="Insert row before"]'),
        sAssertHtmlStructure('Assert insert row before', '<table><tbody><tr><td><br></td></tr><tr><td><br></td></tr></tbody></table>'),

        sClickOnToolbarButton('button[aria-label="Insert row after"]'),
        sAssertHtmlStructure('Assert insert row after', '<table><tbody><tr><td><br></td></tr><tr><td><br></td></tr><tr><td><br></td></tr></tbody></table>'),

        sClickOnToolbarButton('button[aria-label="Delete row"]'),
        sAssertHtmlStructure('Assert delete row', '<table><tbody><tr><td><br></td></tr><tr><td><br></td></tr></tbody></table>'),

        sClickOnToolbarButton('button[aria-label="Insert column before"]'),
//.........这里部分代码省略.........
开发者ID:tinymce,项目名称:tinymce,代码行数:101,代码来源:ContextToolbarTest.ts


示例7:

 return Step.sync(function () {
   const actual = Element.fromHtml(editor.getBody().innerHTML);
   return Assertions.assertStructure('Should be the same structure', expected, actual);
 });
开发者ID:aha-app,项目名称:tinymce-word-paste-filter,代码行数:4,代码来源:ArrowKeysAnchorTest.ts


示例8: IosRealm


//.........这里部分代码省略.........
    Keyboard.sKeydown(doc, Keys.tab(), { }),
    sAssertTextFocused,
    Keyboard.sKeydown(doc, Keys.tab(), { }),
    sAssertTitleFocused,
    Keyboard.sKeydown(doc, Keys.tab(), { }),
    sAssertTargetFocused,
    Keyboard.sKeydown(doc, Keys.tab(), { shift: true }),
    sAssertTitleFocused,
    Keyboard.sKeydown(doc, Keys.tab(), { shift: false }),
    sAssertTargetFocused,
    Keyboard.sKeydown(doc, Keys.tab(), { }),

    Step.wait(1000),
    Logger.t('Checking pressing tab at the end should not move focus', sAssertTargetFocused),

    sClickPrev,
    sAssertTitleFocused,
    sClickNext,
    sAssertTargetFocused,
    sClickPrev,
    sAssertTitleFocused,
    sClickPrev,
    sAssertTextFocused,
    sClickPrev,
    sAssertUrlFocused
  ]);

  const sClickLink = Mouse.sClickOn(realm.element(), TestSelectors.link());

  const sTestScenario = function (rawScenario) {
    const scenario = ValueSchema.asRawOrDie('Checking scenario', ValueSchema.objOf([
      FieldSchema.strict('label'),
      FieldSchema.defaulted('content', ''),
      FieldSchema.defaulted('node', Element.fromText('')),
      FieldSchema.strictObjOf('fields', [
        FieldSchema.option('url'),
        FieldSchema.option('text'),
        FieldSchema.option('title'),
        FieldSchema.option('target')
      ]),
      FieldSchema.strict('expected'),
      FieldSchema.defaulted('beforeExecute', Step.pass),
      FieldSchema.defaulted('mutations', Fun.constant(Step.pass))
    ]), rawScenario);

    return Logger.t(
      scenario.label,
      GeneralSteps.sequence([
        tEditor.sPrepareState(scenario.node.dom(), scenario.content),
        sClickLink,
        TestUi.sSetFieldOptValue(scenario.fields.url),
        sClickNext,
        sAssertTextFocused,
        TestUi.sSetFieldOptValue(scenario.fields.text),
        sClickNext,
        sAssertTitleFocused,
        TestUi.sSetFieldOptValue(scenario.fields.title),
        sClickNext,
        sAssertTargetFocused,
        TestUi.sSetFieldOptValue(scenario.fields.target),
        sClickPrev,
        sAssertTitleFocused,
        sClickPrev,
        sAssertTextFocused,
        sClickPrev,
        sAssertUrlFocused,
开发者ID:tinymce,项目名称:tinymce,代码行数:67,代码来源:SerialisedLinkTest.ts


示例9: function

const removeStyles = function () {
  const head = Element.fromDom(document.head);
  SelectorFind.descendant(head, '.' + styleClass).each(Remove.remove);
};
开发者ID:danielpunkass,项目名称:tinymce,代码行数:4,代码来源:TestStyles.ts


示例10: function

 const assertSelection = function (editor, startPath, soffset, finishPath, foffset) {
   const actual = editor.selection.getRng();
   const root = Element.fromDom(editor.getBody());
   assertPath('start', root, startPath, soffset, actual.startContainer, actual.startOffset);
   assertPath('finish', root, finishPath, foffset, actual.endContainer, actual.endOffset);
 };
开发者ID:danielpunkass,项目名称:tinymce,代码行数:6,代码来源:SelectionBookmarkInlineEditorTest.ts



注:本文中的@ephox/sugar.Element类示例由纯净天空整理自Github/MSDocs等源码及文档管理平台,相关代码片段筛选自各路编程大神贡献的开源项目,源码版权归原作者所有,传播和使用请参考对应项目的License;未经允许,请勿转载。


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
TypeScript sugar.Elements类代码示例发布时间:2022-05-28
下一篇:
TypeScript sugar.DomEvent类代码示例发布时间:2022-05-28
热门推荐
热门话题
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap