本文整理匯總了TypeScript中@ephox/agar.ApproxStructure.fromHtml方法的典型用法代碼示例。如果您正苦於以下問題：TypeScript ApproxStructure.fromHtml方法的具體用法？TypeScript ApproxStructure.fromHtml怎麽用？TypeScript ApproxStructure.fromHtml使用的例子？那麽, 這裏精選的方法代碼示例或許可以為您提供幫助。您也可以進一步了解該方法所在類@ephox/agar.ApproxStructure的用法示例。
在下文中一共展示了ApproxStructure.fromHtml方法的7個代碼示例，這些例子默認根據受歡迎程度排序。您可以為喜歡或者感覺有用的代碼點讚，您的評價將有助於係統推薦出更棒的TypeScript代碼示例。
示例1:
}, (doc, body, gui, component, store) => {
return [
Assertions.sAssertStructure(
'Assert table structure',
ApproxStructure.fromHtml((
'<table class="tox-dialog__table">' +
'<thead>' +
'<tr>' +
'<th>one</th>' +
'<th>two</th>' +
'<th>three</th>' +
'</tr>' +
'</thead>' +
'<tbody>' +
'<tr>' +
'<td>a</td>' +
'<td>b</td>' +
'<td>c</td>' +
'</tr>' +
'<tr>' +
'<td>d</td>' +
'<td>e</td>' +
'<td>f</td>' +
'</tr>' +
'</tbody>' +
'</table>'
)),
component.element()
)
];
},示例2:
Assertions.sAssertStructure('Content should only have one bookmark span', ApproxStructure.build((s, str) => {
return s.element('body', {
children: [
s.element('p', {
children: [
ApproxStructure.fromHtml(bookmarkSpan),
s.element('br', {
attrs: {
'data-mce-bogus': str.is('1')
}
})
]
}),
s.element('p', {
children: [
s.element('br', {
attrs: {
'data-mce-bogus': str.is('1')
}
})
]
})
]
});
}), body),示例3:
const sAssertHtmlStructure = (label: string, expectedHtml: string) => Assertions.sAssertStructure(label, ApproxStructure.build((s) => {
return s.element('body', {
children: [
ApproxStructure.fromHtml(expectedHtml),
s.theRest()
]
});
}), editorBody);示例4:
return Step.sync(function () {
const body = editor.getBody();
body.normalize(); // consolidate text nodes
Assertions.assertStructure(
'Asserting HTML structure of the element: ' + selector,
ApproxStructure.fromHtml(expected),
SelectorFind.descendant(Element.fromDom(body), selector).getOrDie('Nothing in the Editor matches selector: ' + selector)
);
});示例5: function
const sInsertTableTests = function (editor, tinyApis) {
return GeneralSteps.sequence([
tinyApis.sSetContent('<p><br></p><p>b</p>'),
tinyApis.sSetCursor([0], 0),
Toolbar.sClickButton('Insert table'),
sAssertTableStructure(editor, ApproxStructure.fromHtml([
'<table style="border-collapse: collapse; width: 100%;" border="1">',
'<tbody>',
'<tr>',
'<td style="width: 50%;"><br></td>',
'<td style="width: 50%;"><br></td>',
'</tr>',
'<tr>',
'<td style="width: 50%;"><br></td>',
'<td style="width: 50%;"><br></td>',
'</tr>',
'</tbody>',
'</table>'
].join(''))
)
]);
};示例6: ModernTheme
UnitTest.asynctest('browser.tinymce.core.keyboard.ArrowKeysTableTest', (success, failure) => {
const browser = PlatformDetection.detect().browser;
ModernTheme();
const table = (html: string) => ApproxStructure.fromHtml('<table><tbody><tr><td>' + html + '</td></tr></tbody></table>');
const block = ApproxStructure.fromHtml('<p><br></p>');
const caret = (type: string) => {
return ApproxStructure.fromHtml(`<p data-mce-caret="${type}" data-mce-bogus="all"><br data-mce-bogus="1"></p>`);
};
const visualCaret = (before: boolean) => {
const caretClass = before ? 'mce-visual-caret-before' : 'mce-visual-caret';
return ApproxStructure.fromHtml(`<div class="mce-visual-caret ${caretClass}" data-mce-bogus="all"></div>`);
};
const caretBefore = Fun.curry(caret, 'before');
const caretAfter = Fun.curry(caret, 'after');
const visualCaretBefore = Fun.curry(visualCaret, true);
const visualCaretAfter = Fun.curry(visualCaret, false);
const buildBody = (children) => ApproxStructure.build((s, str, arr) => s.element('body', { children }));
TinyLoader.setup(function (editor, onSuccess, onFailure) {
Pipeline.async({}, [
Logger.t('FakeCaret before/after table', GeneralSteps.sequence(browser.isEdge() || browser.isFirefox() ? [
Logger.t('Move fake caret left before table', Chain.asStep(editor, [
ApiChains.cFocus,
ApiChains.cSetContent('<table><tbody><tr><td>1</td></tr></tbody></table>'),
ApiChains.cSetCursor([0, 0, 0, 0, 0], 0),
ApiChains.cAssertContentStructure(buildBody([ table('1') ])),
ActionChains.cContentKeystroke(Keys.left()),
ApiChains.cAssertContentStructure(buildBody([ caretBefore(), table('1'), visualCaretBefore() ])),
ApiChains.cAssertSelection([0], 0, [0], 0)
])),
Logger.t('Move fake caret right after table', Chain.asStep(editor, [
ApiChains.cFocus,
ApiChains.cSetContent('<table><tbody><tr><td>1</td></tr></tbody></table>'),
ApiChains.cSetCursor([0, 0, 0, 0, 0], 1),
ApiChains.cAssertContentStructure(buildBody([ table('1') ])),
ActionChains.cContentKeystroke(Keys.right()),
ApiChains.cAssertContentStructure(buildBody([ table('1'), caretAfter(), visualCaretAfter() ])),
ApiChains.cAssertSelection([1], 0, [1], 0)
])),
Logger.t('Move fake caret right after table then right again before other table', Chain.asStep(editor, [
ApiChains.cFocus,
ApiChains.cSetContent('<table><tbody><tr><td>1</td></tr></tbody></table><table><tbody><tr><td>2</td></tr></tbody></table>'),
ApiChains.cSetCursor([0, 0, 0, 0, 0], 1),
ApiChains.cAssertContentStructure(buildBody([ table('1'), table('2') ])),
ActionChains.cContentKeystroke(Keys.right()),
ApiChains.cAssertContentStructure(buildBody([ table('1'), caretAfter(), table('2'), visualCaretAfter() ])),
ApiChains.cAssertSelection([1], 0, [1], 0),
ActionChains.cContentKeystroke(Keys.right()),
ApiChains.cAssertContentStructure(buildBody([ table('1'), caretBefore(), table('2'), visualCaretBefore() ])),
ApiChains.cAssertSelection([1], 0, [1], 0)
])),
Logger.t('Move fake caret left before table then left again after other table', Chain.asStep(editor, [
ApiChains.cFocus,
ApiChains.cSetContent('<table><tbody><tr><td>1</td></tr></tbody></table><table><tbody><tr><td>2</td></tr></tbody></table>'),
ApiChains.cSetCursor([1, 0, 0, 0, 0], 0),
ApiChains.cAssertContentStructure(buildBody([ table('1'), table('2') ])),
ActionChains.cContentKeystroke(Keys.left()),
ApiChains.cAssertContentStructure(buildBody([ table('1'), caretBefore(), table('2'), visualCaretBefore() ])),
ApiChains.cAssertSelection([1], 0, [1], 0),
ActionChains.cContentKeystroke(Keys.left()),
ApiChains.cAssertContentStructure(buildBody([ table('1'), caretAfter(), table('2'), visualCaretAfter() ])),
ApiChains.cAssertSelection([1], 0, [1], 0)
])),
Logger.t('Move fake up for when table is first element', Chain.asStep(editor, [
ApiChains.cFocus,
ApiChains.cSetContent('<table><tbody><tr><td>1</td></tr></tbody></table>'),
ApiChains.cSetCursor([0, 0, 0, 0, 0], 0),
ApiChains.cAssertContentStructure(buildBody([ table('1') ])),
ActionChains.cContentKeystroke(Keys.up()),
ApiChains.cAssertContentStructure(buildBody([ block, table('1') ])),
ApiChains.cAssertSelection([0], 0, [0], 0)
])),
Logger.t('Move fake down for when table is last element', Chain.asStep(editor, [
ApiChains.cFocus,
ApiChains.cSetContent('<table><tbody><tr><td>1</td></tr></tbody></table>'),
ApiChains.cSetCursor([0, 0, 0, 0, 0], 1),
ApiChains.cAssertContentStructure(buildBody([ table('1') ])),
ActionChains.cContentKeystroke(Keys.down()),
ApiChains.cAssertContentStructure(buildBody([ table('1'), block ])),
ApiChains.cAssertSelection([1], 0, [1], 0)
])),
Logger.t('Move fake up for when table is first element but not when caret is not as start', Chain.asStep(editor, [
ApiChains.cFocus,
ApiChains.cSetContent('<table><tbody><tr><td>1</td></tr></tbody></table>'),
ApiChains.cSetCursor([0, 0, 0, 0, 0], 1),
ApiChains.cAssertContentStructure(buildBody([ table('1') ])),
ActionChains.cContentKeystroke(Keys.up()),
ApiChains.cAssertContentStructure(buildBody([ block, table('1') ])),
ApiChains.cAssertSelection([0], 0, [0], 0)
])),
Logger.t('Move fake down for when table is last element but not when caret is not as end', Chain.asStep(editor, [
ApiChains.cFocus,
ApiChains.cSetContent('<table><tbody><tr><td>1</td></tr></tbody></table>'),
ApiChains.cSetCursor([0, 0, 0, 0, 0], 0),
ApiChains.cAssertContentStructure(buildBody([ table('1') ])),
ActionChains.cContentKeystroke(Keys.down()),
ApiChains.cAssertContentStructure(buildBody([ table('1'), block ])),
//.........這裏部分代碼省略.........
示例7:
const visualCaret = (before: boolean) => {
const caretClass = before ? 'mce-visual-caret-before' : 'mce-visual-caret';
return ApproxStructure.fromHtml(`<div class="mce-visual-caret ${caretClass}" data-mce-bogus="all"></div>`);
};