const testChangingUrlValueWith = (sChooseItem: Step<any, any>) => Log.stepsAsStep('TBA', 'Link: Choosing something in the urlinput changes text and value', [
tinyApis.sSetContent('<h1>Header One</h1><h2 id="existing-id">Header2</h2>'),
TestLinkUi.sOpenLinkDialog,
Keyboard.sKeydown(doc, Keys.down(), { }),
UiFinder.sWaitForVisible('Waiting for dropdown', TinyDom.fromDom(document.body), '.tox-menu'),
sChooseItem,
sAssertUrlStructure((s, str, _arr) => {
return s.element('input', {
value: str.startsWith('#h_')
});
}),
sAssertInputValue('Header One', 'Text to display'),
TestLinkUi.sAssertContentPresence(tinyApis, {
'h1[id]': 0,
'h2[id]': 1
}),
TestLinkUi.sClickSave,
TestLinkUi.sAssertContentPresence(tinyApis, {
'h1[id]': 1
}),
// Check that the h1's id value is referred to by a link containing dog
Chain.asStep(TinyDom.fromDom(editor.getBody()), [
NamedChain.asChain([
NamedChain.direct(NamedChain.inputName(), UiFinder.cFindIn('h1'), 'h1'),
NamedChain.direct('h1', Chain.mapper((h1) => Attr.get(h1, 'id')), 'h1-id'),
NamedChain.bundle((obj) => {
return UiFinder.findIn(obj[NamedChain.inputName()], `a[href="#${obj['h1-id']}"]:contains("Header One")`);
})
])
])
]);
const cSubmitDialog = () => Chain.control(
NamedChain.asChain([
NamedChain.writeValue('body', Body.body()),
NamedChain.read('body', Mouse.cClickOn('.tox-button:contains("Save")')),
NamedChain.outputInput
]),
Guard.addLogging('Submit dialog')
);
const cAssertCleanHtml = (label: string, expected: string) => Chain.control(
NamedChain.asChain([
NamedChain.direct(NamedChain.inputName(), Chain.identity, 'editor'),
NamedChain.direct('editor', Chain.mapper((editor: Editor) => cleanHtml(editor.getContent())), 'content'),
NamedChain.direct('content', Assertions.cAssertHtml(label, expected), 'result'),
NamedChain.outputInput
]),
Guard.addLogging('Assert clean html')
);
const cAssertWidth = (label, data) => {
return Chain.label(
`Assert width of table ${label} after inserting column`,
NamedChain.asChain([
NamedChain.direct(NamedChain.inputName(), Chain.identity, 'editor'),
NamedChain.direct('editor', cInsertColumnMeasureWidth(label, data), 'widths'),
NamedChain.read('widths', cAssertWidths)
])
);
};
const cMergeResizeSplitAssertWidth = (label, data) => {
return Chain.label(
`Assert width of table ${label}`,
NamedChain.asChain([
NamedChain.direct(NamedChain.inputName(), Chain.identity, 'editor'),
NamedChain.direct('editor', cMergeResizeUnmergeMeasureWidth(label, data), 'widths'),
NamedChain.read('widths', cAssertWidths)
])
);
};
const sAssertImageFlip = (label) => {
return Chain.asStep({editor}, [
Chain.label(`Assert ${label}`,
NamedChain.asChain([
NamedChain.direct(NamedChain.inputName(), Chain.identity, 'editor'),
NamedChain.direct('editor', cGetImageSources(label), 'urls'),
NamedChain.read('urls', Chain.op((urls) => {
Assertions.assertEq(`Image should be flipped: ${label}`, true, ( urls.srcBeforeFlip !== urls.srcAfterFlip ));
}))
]))
]);
};
UnitTest.asynctest('WindowManager:inline-dialog Test', (success, failure) => {
const helpers = TestExtras();
const windowManager = WindowManager.setup(helpers.extras);
const cGetDialogLabelId = Chain.binder((dialogE: Element) => {
if (Attr.has(dialogE, 'aria-labelledby')) {
const labelId = Attr.get(dialogE, 'aria-labelledby');
return labelId.length > 0 ? Result.value(labelId) : Result.error('Dialog has zero length aria-labelledby attribute');
} else {
return Result.error('Dialog has no aria-labelledby attribute');
}
});
const sAssertDialogLabelledBy =
Chain.asStep(Body.body(), [NamedChain.asChain([
NamedChain.direct(NamedChain.inputName(), UiFinder.cFindIn('[role="dialog"]'), 'dialog'),
NamedChain.direct('dialog', cGetDialogLabelId, 'labelId'),
NamedChain.bundle((obj) => UiFinder.findIn(obj.dialog, `#${obj.labelId}`)),
])]);
const sTestDialogLabelled = (params) =>
Logger.t(
`Dialog should have "aria-labelledby" for config "${JSON.stringify(params)}"`,
GeneralSteps.sequence([
Step.sync(() => {
const dialogSpec: Types.Dialog.DialogApi<{}> = {
title: 'Silver Test Inline (Toolbar) Dialog',
body: {
type: 'panel',
items: []
},
buttons: [],
initialData: {}
};
windowManager.open(dialogSpec, params, Fun.noop );
}),
sAssertDialogLabelledBy,
])
);
Pipeline.async({}, [
TestHelpers.GuiSetup.mAddStyles(Element.fromDom(document), [
'.tox-dialog { background: white; border: 2px solid black; padding: 1em; margin: 1em; }'
]),
sTestDialogLabelled({ inline: 'toolbar' }),
sTestDialogLabelled({ inline: 'not-inline!!' }),
TestHelpers.GuiSetup.mRemoveStyles
], () => {
helpers.destroy();
success();
}, failure);
});
const cWaitForDialog = () => Chain.control(
NamedChain.asChain([
NamedChain.direct(NamedChain.inputName(), Chain.identity, 'editor'),
NamedChain.direct('editor', cTinyUI, 'tinyUi'),
// Hmm. We might need an API to handle the case where you need to pass logs through a subchain.
NamedChain.direct('tinyUi', Chain.on((tinyUi, next, die, logs) => {
const subchain = tinyUi.cWaitForPopup('wait for dialog', 'div[role="dialog"]');
Chain.pipeline([subchain], (value, newLogs) => next(Chain.wrap(value), newLogs), die, logs);
}), '_'),
NamedChain.outputInput
]),
Guard.addLogging('Wait for dialog')
);
const sBookmarkTest = (namedChains) => {
return Chain.asStep({}, [
NamedChain.asChain(Arr.flatten([
[ cCreateNamedEditor ],
namedChains,
[ cRemoveEditor ]
])
)]);
};
const cGetImageSources = (label) => {
return NamedChain.asChain(
[
NamedChain.direct(NamedChain.inputName(), Chain.identity, 'editor'),
Chain.label('Store img src before flip', NamedChain.write('srcBeforeFlip', cGetImageSrc)),
Chain.label('Flip image', NamedChain.read('editor', cClickContextToolbarButton(label))),
// Wait for image to flip
Chain.wait(500),
Chain.label('Store img src after flip', NamedChain.write('srcAfterFlip', cGetImageSrc)),
NamedChain.merge(['srcBeforeFlip', 'srcAfterFlip'], 'urls'),
NamedChain.output('urls')
]
);
};
