本文整理匯總了TypeScript中@ephox/agar.FocusTools.sTryOnSelector方法的典型用法代碼示例。如果您正苦於以下問題:TypeScript FocusTools.sTryOnSelector方法的具體用法?TypeScript FocusTools.sTryOnSelector怎麽用?TypeScript FocusTools.sTryOnSelector使用的例子?那麽, 這裏精選的方法代碼示例或許可以為您提供幫助。您也可以進一步了解該方法所在類@ephox/agar.FocusTools
的用法示例。
在下文中一共展示了FocusTools.sTryOnSelector方法的8個代碼示例,這些例子默認根據受歡迎程度排序。您可以為喜歡或者感覺有用的代碼點讚,您的評價將有助於係統推薦出更棒的TypeScript代碼示例。
示例1: insertTablePickerApprox
(editor, onSuccess, onFailure) => {
const doc = Element.fromDom(document);
Pipeline.async({ }, Log.steps(
'TBA',
'Check structure of table picker',
[
Mouse.sClickOn(Body.body(), '.tox-toolbar button'),
UiFinder.sWaitForVisible('Waiting for menu', Body.body(), '[role="menu"]'),
Chain.asStep(Body.body(), [
UiFinder.cFindIn('[role="menu"]'),
Assertions.cAssertStructure(
'Checking structure',
ApproxStructure.build((s, str, arr) => insertTablePickerApprox(s, str, arr, 1, 1))
)
]),
FocusTools.sTryOnSelector('Focus should be on first table cell', doc, '.tox-insert-table-picker__selected:last'),
Keyboard.sKeydown(doc, Keys.down(), {}),
Keyboard.sKeydown(doc, Keys.right(), {}),
Chain.asStep(Body.body(), [
UiFinder.cFindIn('[role="menu"]'),
Assertions.cAssertStructure(
'Checking structure',
ApproxStructure.build((s, str, arr) => insertTablePickerApprox(s, str, arr, 2, 2))
)
]),
FocusTools.sTryOnSelector('Focus should be on 2 down, 2 across table cell', doc, '.tox-insert-table-picker__selected:last')
]
), onSuccess, onFailure);
},
示例2: rgb
(editor, onSuccess, onFailure) => {
const doc = Element.fromDom(document);
Pipeline.async({ }, Logger.ts(
'Check structure of grid collection menu',
[
TestHelpers.GuiSetup.mAddStyles(doc, [
':focus { background-color: rgb(222, 224, 226); }'
]),
Mouse.sClickOn(Body.body(), '.tox-split-button__chevron'),
UiFinder.sWaitForVisible('Waiting for menu', Body.body(), '[role="menu"]'),
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--grid') ],
children: [
s.element('div', {
classes: [ arr.has('tox-collection__group') ],
children: Arr.map([ '1', '2', '3', '4', '5', '6', '7', '8' ], (num) => {
return s.element('div', {
classes: [ arr.has('tox-collection__item') ],
attrs: {
title: str.is(num)
},
children: [
// NOTE: The oxide demo page has div, but I think that's just a mistake
s.element('div', {
classes: [ arr.has('tox-collection__item-icon') ],
children: [
s.element('svg', {})
]
})
]
});
})
})
]
});
})
)
]),
// Without layout, the flatgrid cannot be calculated on phantom
navigator.userAgent.indexOf('PhantomJS') > -1 ? Step.pass : GeneralSteps.sequence([
FocusTools.sTryOnSelector('Focus should be on 1', doc, '.tox-collection__item[title="1"]'),
Keyboard.sKeydown(doc, Keys.right(), { }),
FocusTools.sTryOnSelector('Focus should be on 2', doc, '.tox-collection__item[title="2"]'),
Keyboard.sKeydown(doc, Keys.right(), { }),
FocusTools.sTryOnSelector('Focus should be on 3', doc, '.tox-collection__item[title="3"]')
]),
TestHelpers.GuiSetup.mRemoveStyles
]
), onSuccess, onFailure);
},
示例3: TinyApis
TinyLoader.setup(function (editor, onSuccess, onFailure) {
const tinyApis = TinyApis(editor);
const tinyUi = TinyUi(editor);
const doc = Element.fromDom(document);
const body = Body.body();
Pipeline.async({},
Log.steps('TBA', 'Emoticons: Open dialog, verify custom categories listed and search for custom emoticon', [
tinyApis.sFocus,
tinyUi.sClickOnToolbar('click emoticons', 'button'),
Chain.asStep({}, [
tinyUi.cWaitForPopup('wait for popup', 'div[role="dialog"]'),
]),
FocusTools.sTryOnSelector('Focus should start on input', doc, 'input'),
Chain.asStep(body, [
UiFinder.cFindIn('[role="tablist"]'),
Assertions.cAssertStructure('check custom categories are shown', ApproxStructure.build((s, str, arr) => {
return s.element('div', {
children: [
tabElement(s, str, arr)('All'),
tabElement(s, str, arr)('People'),
tabElement(s, str, arr)('User Defined')
]
});
})),
]),
FocusTools.sSetActiveValue(doc, 'clock'),
Chain.asStep(doc, [
FocusTools.cGetFocused,
cFakeEvent('input')
]),
Waiter.sTryUntil(
'Wait until clock is the first choice (search should filter)',
Chain.asStep(body, [
UiFinder.cFindIn('.tox-collection__item:first'),
Chain.mapper((item) => {
return Attr.get(item, 'data-collection-item-value');
}),
Assertions.cAssertEq('Search should show custom clock', '⏲')
]),
100,
1000
),
Keyboard.sKeydown(doc, Keys.tab(), {}),
FocusTools.sTryOnSelector('Focus should have moved to collection', doc, '.tox-collection__item'),
Keyboard.sKeydown(doc, Keys.enter(), {}),
Waiter.sTryUntil(
'Waiting for content update',
tinyApis.sAssertContent('<p>⏲</p>'),
100,
1000
)
])
, onSuccess, onFailure);
}, {
示例4:
const sAssertFocusOnItem = (itemText: string) => {
return FocusTools.sTryOnSelector(
`Focus should be on ${itemText}`,
doc,
`.tox-collection__item:contains("${itemText}")`
);
};
示例5: TinyApis
TinyLoader.setup(function (editor, onSuccess, onFailure) {
const tinyApis = TinyApis(editor);
const doc = TinyDom.fromDom(document);
Pipeline.async({}, [
TestLinkUi.sClearHistory,
Log.stepsAsStep('TBA', 'Checking only choosing link and submitting works', [
Step.sync(() => {
editor.execCommand('mceLink');
}),
UiFinder.sWaitForVisible('wait for link dialog', TinyDom.fromDom(document.body), '[role="dialog"]'),
FocusTools.sTryOnSelector('Selector should be in first field of dialog', doc, '.tox-dialog input'),
FocusTools.sSetActiveValue(doc, 'http://goo'),
Chain.asStep(doc, [
FocusTools.cGetFocused,
TestLinkUi.cFireEvent('input')
]),
Keyboard.sKeydown(doc, Keys.enter(), { }),
Waiter.sTryUntil(
'Waiting for link to be inserted',
tinyApis.sAssertContentPresence({
'a[href="http://goo"]': 1
}),
100,
1000
)
]),
TestLinkUi.sClearHistory,
], onSuccess, onFailure);
}, {
示例6:
const sAssertFocusOnItem = (doc, text) => {
return FocusTools.sTryOnSelector(
'Focus should be on: ' + text,
doc,
`.tox-collection__item:contains(${text})`
);
};
示例7:
const sAssertFocusOnItem = (label, selector) => {
return FocusTools.sTryOnSelector(
`Focus should be on: ${label}`,
doc,
selector
);
};
示例8: TinyApis
TinyLoader.setup(function (editor, onSuccess, onFailure) {
const tinyApis = TinyApis(editor);
const tinyUi = TinyUi(editor);
const doc = Element.fromDom(document);
Pipeline.async({},
Log.steps('TBA', 'Charmap: Open dialog, Search for "euro", Euro should be first option', [
tinyApis.sFocus,
tinyUi.sClickOnToolbar('click charmap', 'button[aria-label="Special character"]'),
Chain.asStep({}, [
tinyUi.cWaitForPopup('wait for popup', 'div[role="dialog"]'),
]),
FocusTools.sTryOnSelector('Focus should start on', doc, '[role="tab"]'), // TODO: Remove duped startup of these tests
Keyboard.sKeydown(doc, Keys.tab(), { }),
FocusTools.sTryOnSelector('Focus should have moved to input', doc, 'input'),
FocusTools.sSetActiveValue(doc, 'euro'),
Chain.asStep(doc, [
FocusTools.cGetFocused,
cFakeEvent('input')
]),
Waiter.sTryUntil(
'Wait until Euro is the first choice (search should filter)',
Chain.asStep(Body.body(), [
UiFinder.cFindIn('.tox-collection__item:first'),
Chain.mapper((item) => {
return Attr.get(item, 'data-collection-item-value');
}),
Assertions.cAssertEq('Search should show euro', '€')
]),
100,
1000
),
Keyboard.sKeydown(doc, Keys.tab(), { }),
FocusTools.sTryOnSelector('Focus should have moved to collection', doc, '.tox-collection__item'),
Keyboard.sKeydown(doc, Keys.enter(), { }),
Waiter.sTryUntil(
'Waiting for content update',
tinyApis.sAssertContent('<p>€</p>'),
100,
1000
)
])
, onSuccess, onFailure);
}, {