* Fix expression updating bug * Add functional test for expression editor * Add page object helper to open expression editor Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com> Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>
This commit is contained in:
parent
58f5a45859
commit
e7a3354837
|
@ -55,6 +55,17 @@ const mergeProps = (stateProps, dispatchProps, ownProps) => {
|
|||
};
|
||||
|
||||
const expressionLifecycle = lifecycle({
|
||||
componentDidUpdate({ expression }) {
|
||||
if (
|
||||
this.props.expression !== expression &&
|
||||
this.props.expression !== this.props.formState.expression
|
||||
) {
|
||||
this.props.setFormState({
|
||||
expression: this.props.expression,
|
||||
dirty: false,
|
||||
});
|
||||
}
|
||||
},
|
||||
componentDidMount() {
|
||||
const { functionDefinitionsPromise, setFunctionDefinitions } = this.props;
|
||||
functionDefinitionsPromise.then(defs => setFunctionDefinitions(defs));
|
||||
|
|
|
@ -97,7 +97,7 @@ export const Toolbar = (props: Props) => {
|
|||
|
||||
const trays = {
|
||||
pageManager: <PageManager previousPage={previousPage} />,
|
||||
expression: !elementIsSelected ? null : <Expression key={selectedElement.id} done={done} />,
|
||||
expression: !elementIsSelected ? null : <Expression done={done} />,
|
||||
};
|
||||
|
||||
return (
|
||||
|
@ -141,6 +141,7 @@ export const Toolbar = (props: Props) => {
|
|||
color="text"
|
||||
iconType="editorCodeBlock"
|
||||
onClick={() => showHideTray(TrayType.expression)}
|
||||
data-test-subj="canvasExpressionEditorButton"
|
||||
>
|
||||
{strings.getEditorButtonLabel()}
|
||||
</EuiButtonEmpty>
|
||||
|
|
70
x-pack/test/functional/apps/canvas/expression.ts
Normal file
70
x-pack/test/functional/apps/canvas/expression.ts
Normal file
|
@ -0,0 +1,70 @@
|
|||
/*
|
||||
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
||||
* or more contributor license agreements. Licensed under the Elastic License;
|
||||
* you may not use this file except in compliance with the Elastic License.
|
||||
*/
|
||||
|
||||
import expect from '@kbn/expect';
|
||||
|
||||
import { FtrProviderContext } from '../../ftr_provider_context';
|
||||
|
||||
export default function canvasExpressionTest({ getService, getPageObjects }: FtrProviderContext) {
|
||||
const esArchiver = getService('esArchiver');
|
||||
const testSubjects = getService('testSubjects');
|
||||
// const browser = getService('browser');
|
||||
const retry = getService('retry');
|
||||
const PageObjects = getPageObjects(['canvas', 'common']);
|
||||
const find = getService('find');
|
||||
|
||||
describe('expression editor', function() {
|
||||
// there is an issue with FF not properly clicking on workpad elements
|
||||
this.tags('skipFirefox');
|
||||
|
||||
before(async () => {
|
||||
// init data
|
||||
await esArchiver.loadIfNeeded('logstash_functional');
|
||||
await esArchiver.load('canvas/default');
|
||||
|
||||
// load test workpad
|
||||
await PageObjects.common.navigateToApp('canvas', {
|
||||
hash: '/workpad/workpad-1705f884-6224-47de-ba49-ca224fe6ec31/page/1',
|
||||
});
|
||||
});
|
||||
|
||||
it('updates when element is changed via side bar', async () => {
|
||||
// wait for all our elements to load up
|
||||
await retry.try(async () => {
|
||||
const elements = await testSubjects.findAll(
|
||||
'canvasWorkpadPage > canvasWorkpadPageElementContent'
|
||||
);
|
||||
expect(elements).to.have.length(4);
|
||||
});
|
||||
|
||||
// find the first workpad element (a markdown element) and click it to select it
|
||||
await testSubjects.click('canvasWorkpadPage > canvasWorkpadPageElementContent', 20000);
|
||||
|
||||
// open the expression editor
|
||||
await PageObjects.canvas.openExpressionEditor();
|
||||
|
||||
// select markdown content and clear it
|
||||
const mdBox = await find.byCssSelector('.canvasSidebar__panel .canvasTextArea__code');
|
||||
const oldMd = await mdBox.getVisibleText();
|
||||
await mdBox.clearValueWithKeyboard();
|
||||
|
||||
// type the new text
|
||||
const newMd = `${oldMd} and this is a test`;
|
||||
await mdBox.type(newMd);
|
||||
await find.clickByCssSelector('.canvasArg--controls .euiButton');
|
||||
|
||||
// make sure the open expression editor also has the changes
|
||||
const editor = await find.byCssSelector('.monaco-editor .view-lines');
|
||||
const editorText = await editor.getVisibleText();
|
||||
expect(editorText).to.contain('Orange: Timelion, Server function and this is a test');
|
||||
|
||||
// reset the markdown
|
||||
await mdBox.clearValueWithKeyboard();
|
||||
await mdBox.type(oldMd);
|
||||
await find.clickByCssSelector('.canvasArg--controls .euiButton');
|
||||
});
|
||||
});
|
||||
}
|
|
@ -8,6 +8,7 @@ export default function canvasApp({ loadTestFile }) {
|
|||
describe('Canvas app', function canvasAppTestSuite() {
|
||||
this.tags('ciGroup2'); // CI requires tags ヽ(゜Q。)ノ?
|
||||
loadTestFile(require.resolve('./smoke_test'));
|
||||
loadTestFile(require.resolve('./expression'));
|
||||
loadTestFile(require.resolve('./feature_controls/canvas_security'));
|
||||
loadTestFile(require.resolve('./feature_controls/canvas_spaces'));
|
||||
});
|
||||
|
|
|
@ -23,6 +23,10 @@ export function CanvasPageProvider({ getService }: FtrProviderContext) {
|
|||
await browser.pressKeys(browser.keys.ESCAPE);
|
||||
},
|
||||
|
||||
async openExpressionEditor() {
|
||||
await testSubjects.click('canvasExpressionEditorButton');
|
||||
},
|
||||
|
||||
async waitForWorkpadElements() {
|
||||
await testSubjects.findAll('canvasWorkpadPage > canvasWorkpadPageElementContent');
|
||||
},
|
||||
|
|
Loading…
Reference in a new issue