本文整理匯總了TypeScript中@ephox/agar.Keys.right方法的典型用法代碼示例。如果您正苦於以下問題:TypeScript Keys.right方法的具體用法?TypeScript Keys.right怎麽用?TypeScript Keys.right使用的例子?那麽, 這裏精選的方法代碼示例或許可以為您提供幫助。您也可以進一步了解該方法所在類@ephox/agar.Keys
的用法示例。
在下文中一共展示了Keys.right方法的9個代碼示例,這些例子默認根據受歡迎程度排序。您可以為喜歡或者感覺有用的代碼點讚,您的評價將有助於係統推薦出更棒的TypeScript代碼示例。
示例1: sAssertFocusOnItem
return Arr.bind(navigation.concat(navigation.slice(0, 1)), (nav, i) => {
const exploration = (nav.subitems.length > 0) ? [
Keyboard.sKeydown(doc, Keys.right(), { }),
sAssertFocusOnItem(doc, nav.subitems[0])
].concat(
Arr.bind(
nav.subitems.slice(1).concat(nav.subitems.slice(0, 1)),
(si) => [
Keyboard.sKeydown(doc, Keys.down(), { }),
sDelay,
sAssertFocusOnItem(doc, si)
]
)
).concat([
Keyboard.sKeydown(doc, Keys.escape(), { })
]) : [
// Should do nothing
Keyboard.sKeydown(doc, Keys.right(), { })
];
return Arr.flatten([
[ sAssertFocusOnItem(doc, nav.item) ],
exploration,
[ sAssertFocusOnItem(doc, nav.item) ],
[ sDelay ],
// Move to the next one
i < navigation.length ? [ Keyboard.sKeydown(doc, Keys.down(), { }) ] : [ ]
]);
});
示例2: function
const sTestArrowsSingleAnchor = function (tinyApis, tinyActions, editor) {
return Logger.t('sTestArrowsSingleAnchor', GeneralSteps.sequence([
tinyApis.sSetContent('<p><a href="#">b</a></p>'),
tinyApis.sSetCursor([0, 0, 0], 0),
tinyApis.sNodeChanged,
sAssertCursor(tinyApis, [0, 0, 0], 1),
sAssertContentStructure(editor, anchorsZwspInside(['b'], START, 0)),
tinyActions.sContentKeystroke(Keys.left(), { }),
sAssertCursor(tinyApis, [0, 0], 0),
sAssertContentStructure(editor, anchorsZwspOutside(['b'], BEFORE, 0)),
tinyActions.sContentKeystroke(Keys.left(), { }),
sAssertCursor(tinyApis, [0, 0], 0),
sAssertContentStructure(editor, anchorsZwspOutside(['b'], BEFORE, 0)),
tinyActions.sContentKeystroke(Keys.right(), { }),
sAssertCursor(tinyApis, [0, 0, 0], 1),
sAssertContentStructure(editor, anchorsZwspInside(['b'], START, 0)),
tinyActions.sContentKeystroke(Keys.right(), { }),
sAssertCursor(tinyApis, [0, 0, 0], 1),
sAssertContentStructure(editor, anchorsZwspInside(['b'], END, 0)),
tinyActions.sContentKeystroke(Keys.right(), { }),
sAssertCursor(tinyApis, [0, 1], 1),
sAssertContentStructure(editor, anchorsZwspOutside(['b'], AFTER, 0)),
tinyActions.sContentKeystroke(Keys.right(), { }),
sAssertCursor(tinyApis, [0, 1], 1),
sAssertContentStructure(editor, anchorsZwspOutside(['b'], AFTER, 0))
]));
};
示例3: 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);
},
示例4: 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);
},
示例5: TinyApis
TinyLoader.setup(function (editor, onSuccess, onFailure) {
const tinyApis = TinyApis(editor);
const tinyActions = TinyActions(editor);
Pipeline.async({}, [
tinyApis.sFocus,
Logger.t('Type text before cef inline element', GeneralSteps.sequence([
tinyApis.sSetContent('<p><span contenteditable="false">a</span></p>'),
tinyApis.sSelect('p', [1]),
tinyActions.sContentKeystroke(Keys.left(), {}),
TypeText.sTypeContentAtSelection(Element.fromDom(editor.getDoc()), 'bc'),
tinyApis.sAssertSelection([0, 0], 2, [0, 0], 2),
tinyApis.sAssertContent('<p>bc<span contenteditable="false">a</span></p>')
])),
Logger.t('Type after cef inline element', GeneralSteps.sequence([
tinyApis.sSetContent('<p><span contenteditable="false">a</span></p>'),
tinyApis.sSelect('p', [1]),
tinyActions.sContentKeystroke(Keys.right(), {}),
TypeText.sTypeContentAtSelection(Element.fromDom(editor.getDoc()), 'bc'),
tinyApis.sAssertSelection([0, 1], 3, [0, 1], 3),
tinyApis.sAssertContent('<p><span contenteditable="false">a</span>bc</p>')
])),
Logger.t('Type between cef inline elements', GeneralSteps.sequence([
tinyApis.sSetContent('<p><span contenteditable="false">a</span> <span contenteditable="false">b</span></p>'),
tinyApis.sSelect('p', [3]),
tinyActions.sContentKeystroke(Keys.left(), {}),
tinyActions.sContentKeystroke(Keys.left(), {}),
TypeText.sTypeContentAtSelection(Element.fromDom(editor.getDoc()), 'bc'),
tinyApis.sAssertSelection([0, 1], 3, [0, 1], 3),
tinyApis.sAssertContent('<p><span contenteditable="false">a</span>bc <span contenteditable="false">b</span></p>')
]))
], onSuccess, onFailure);
}, {
示例6: sCheckItemsAtLocationPlus
const sCheckSubItemsAtLocation = (expectedSubmenu: string) => sCheckItemsAtLocationPlus(
GeneralSteps.sequence([
Keyboard.sKeydown(doc, Keys.right(), { }),
sAssertFocusOnItem(expectedSubmenu)
]),
// Afterwards, escape the submenu
Keyboard.sKeydown(doc, Keys.escape(), { }),
(text) => sOpenMenu('', text)
);
示例7: TinyApis
TinyLoader.setup(function (editor, onSuccess, onFailure) {
const tinyApis = TinyApis(editor);
const eDoc = Element.fromDom(editor.getDoc());
// NOTE: This is almost identical to charmap
Pipeline.async({},
Log.steps('TBA', 'Emoticons: Autocomplete, trigger an autocomplete and check it appears', [
tinyApis.sFocus,
tinyApis.sSetContent('<p>:ha</p>'),
tinyApis.sSetCursor([ 0, 0 ], 3),
Keyboard.sKeypress(eDoc, 'a'.charCodeAt(0), { }),
UiFinder.sWaitForVisible('Waiting for autocomplete menu', Body.body(), '.tox-autocompleter .tox-collection__item'),
Keyboard.sKeydown(eDoc, Keys.right(), { }),
Keyboard.sKeydown(eDoc, Keys.right(), { }),
Keyboard.sKeydown(eDoc, Keys.enter(), { }),
tinyApis.sAssertContent('<p>😂</p>')
])
, onSuccess, onFailure);
}, {
示例8: sOpenContextMenu
const sSelectContextMenu = (label: string, selector: string, index: number, subindex: number) => {
return GeneralSteps.sequence([
sOpenContextMenu('td'),
sRepeatDownArrowKey(subindex),
Keyboard.sKeydown(doc, Keys.right(), {}),
sRepeatDownArrowKey(index),
sAssertFocusOnItem(label, selector),
sPressEnterKey
]);
};
示例9: sTestDefaultLanguage
TinyLoader.setup(function (editor, onSuccess, onFailure) {
const doc = Element.fromDom(document);
const sPressTab = Keyboard.sKeydown(doc, Keys.tab(), {});
const sPressEsc = Keyboard.sKeydown(doc, Keys.escape(), {});
const sPressDown = Keyboard.sKeydown(doc, Keys.down(), {});
const sPressRight = Keyboard.sKeydown(doc, Keys.right(), {});
const sFocusToolbar = Step.sync(() => {
const args = Tools.extend({
ctrlKey: false,
altKey: false,
shiftKey: false,
metaKey: false
}, {altKey: true, keyCode: 120});
editor.fire('keydown', args);
});
const sAssertFocused = (name, selector) => {
return FocusTools.sTryOnSelector(name, doc, selector);
};
Pipeline.async({}, Log.steps('TBA', 'Spellchecker: Reaching the spellchecker via the keyboard', [
sTestDefaultLanguage(editor),
sFocusToolbar,
sAssertFocused('File', '.tox-mbtn:contains("File")'),
sPressRight,
sAssertFocused('Edit', '.tox-mbtn:contains("Edit")'),
sPressRight,
sAssertFocused('View', '.tox-mbtn:contains("View")'),
sPressRight,
sAssertFocused('Format', '.tox-mbtn:contains("Format")'),
sPressRight,
sAssertFocused('Tools', '.tox-mbtn:contains("Tools")'),
sPressDown,
sAssertFocused('Spellcheck tool menu item', '.tox-collection__item:contains("Spellcheck")'), // Menu item can be reached by keyboard
sPressEsc,
sPressTab,
sAssertFocused('Spellchecker button', '.tox-split-button'), // Button can be reached by keyboard
sPressDown,
sAssertFocused('First language', '.tox-collection__item:contains("English")'), // Languages can be reached by keyboard
]), onSuccess, onFailure);
}, {