diff --git a/Tests/IntegrationTests/Fixtures/1Dimension/createNewNodes.e2e.js b/Tests/IntegrationTests/Fixtures/1Dimension/createNewNodes.e2e.js index 6dd693b5f0..8e243a440e 100644 --- a/Tests/IntegrationTests/Fixtures/1Dimension/createNewNodes.e2e.js +++ b/Tests/IntegrationTests/Fixtures/1Dimension/createNewNodes.e2e.js @@ -1,12 +1,12 @@ import {Selector, RequestLogger} from 'testcafe'; import {ReactSelector} from 'testcafe-react-selectors'; -import {beforeEach, subSection, checkPropTypes} from './../../utils.js'; -import {Page} from './../../pageModel'; +import {beforeEach, subSection, checkPropTypes} from '../../utils'; +import {Page} from '../../pageModel'; /* global fixture:true */ const changeRequestLogger = RequestLogger(request => request.url.endsWith('/neos/ui-services/change') && request.method === 'post' && request.isAjax); -const contentIframeSelector = Selector('[name="neos-content-main"]', { timeout: 2000 }); +const contentIframeSelector = Selector('[name="neos-content-main"]', {timeout: 2000}); fixture`Create new nodes` .beforeEach(beforeEach) @@ -14,8 +14,6 @@ fixture`Create new nodes` .requestHooks(changeRequestLogger); test('Check ClientEval for dependencies between properties of NodeTypes in Creation Dialog', async t => { - // Regression Test - // create node with NodeType labeled: NodeWithDependingProperties_Test await t .click(Selector('#neos-ContentTree-ToggleContentTree')) @@ -43,8 +41,6 @@ test('Check ClientEval for dependencies between properties of NodeTypes in Creat {'label': 'even', value: 'even'} ]) - // TODO: difference here vs Inspector is that Inspector has null where CreationDialog - // has empty string as default value await t .expect(dependingPropertySelectBox.props.value).eql('') .expect(dependingPropertySelectBox.props.options).eql([ @@ -58,85 +54,26 @@ test('Check ClientEval for dependencies between properties of NodeTypes in Creat await t.click(propertyDependedOnSelectBoxSelector) await t .click(Selector('span').withText('even')) - // TODO: maybe we should wait for the loading state to finish instead of fixed number of seconds + // FIXME: maybe we should wait for the loading state to finish instead of fixed number of seconds .wait(2000) - // TODO: check if this is necessary (getReact again) - const newPropertyDependedOnSelectBox = await propertyDependedOnSelectBoxSelector.getReact() - const newDependingPropertySelectBox = await dependingPropertySelectBoxSelector.getReact() + // Re-fetch value + const newPropertyDependedOnSelectBoxValue = (await propertyDependedOnSelectBoxSelector + .getReact()) + .props + .value - await t - .expect(newPropertyDependedOnSelectBox.props.value).eql('even') + // Re-fetch options + const newDependingPropertySelectBoxOptions = (await dependingPropertySelectBoxSelector + .getReact()) + .props + .options await t - .expect(newDependingPropertySelectBox.props.options).eql([ - {label: 'label_2', value: 2}, - {label: 'label_4', value: 4}, - {label: 'label_6', value: 6}, - {label: 'label_8', value: 8}, - {label: 'label_10', value: 10} - ]) -}) + .expect(newPropertyDependedOnSelectBoxValue).eql('even') -// TODO: test for Neos Inspector (working case) -> move this into inspector test file -test('Check ClientEval for dependencies between properties of NodeTypes in Inspector', async t => { await t - .click(Selector('#neos-ContentTree-ToggleContentTree')) - .click(Page.treeNode.withText('Content Collection (main)')) - .click(Selector('#neos-ContentTree-AddNode')) - .click(ReactSelector('NodeTypeItem').find('button>span>span').withText('NodeWithDependingProperties_Test')) - - // WHY: Some NodeTypes trigger a Node Creation Dialog - const isCreationDialogOpen = await Selector('#neos-NodeCreationDialog-CreateNew').exists; - if (isCreationDialogOpen) { - await t.click(Selector('#neos-NodeCreationDialog-CreateNew')) - } - - await Page.waitForIframeLoading(t) - await t.wait(2000) // maybe we should wait for the loading state to finish instead of fixed number of seconds - - const propertyDependedOnSelectBoxSelector = ReactSelector('SelectBoxEditor') - .withProps('identifier', 'propertyDependedOn') - .findReact('SelectBox') - - const propertyDependedOnSelectBox = await propertyDependedOnSelectBoxSelector.getReact() - - const dependingPropertySelectBoxSelector = ReactSelector('SelectBoxEditor') - .withProps('identifier', 'dependingProperty') - .findReact('SelectBox') - - const dependingPropertySelectBox = await dependingPropertySelectBoxSelector.getReact() - - await t - .expect(propertyDependedOnSelectBox.props.value).eql('odd') - .expect(propertyDependedOnSelectBox.props.options).eql([ - {'label': 'odd', value: 'odd'}, - {'label': 'even', value: 'even'} - ]) - - await t - .expect(dependingPropertySelectBox.props.value).eql(null) - .expect(dependingPropertySelectBox.props.options).eql([ - {label: 'label_1', value: 1}, - {label: 'label_3', value: 3}, - {label: 'label_5', value: 5}, - {label: 'label_7', value: 7}, - {label: 'label_9', value: 9} - ]) - - await t.click(propertyDependedOnSelectBoxSelector) - await t - .click(Selector('span').withText('even')) - .wait(2000) // TODO: maybe we should wait for the loading state to finish instead of fixed number of seconds - - const newPropertyDependedOnSelectBox = await propertyDependedOnSelectBoxSelector.getReact() - const newDependingPropertySelectBox = await dependingPropertySelectBoxSelector.getReact() - - await t - .expect(newPropertyDependedOnSelectBox.props.value).eql('even') - - await t - .expect(newDependingPropertySelectBox.props.options).eql([ + .expect(newDependingPropertySelectBoxOptions).eql([ {label: 'label_2', value: 2}, {label: 'label_4', value: 4}, {label: 'label_6', value: 6}, @@ -157,7 +94,7 @@ test('Check the nodetype help in create dialog', async t => { subSection('Open context help and check for Markdown rendering'); await t - .click(ReactSelector('NodeTypeItem').withProps({ nodeType: { label: 'Headline_Test' }}).find('button svg[data-icon="question-circle"]')) + .click(ReactSelector('NodeTypeItem').withProps({nodeType: {label: 'Headline_Test'}}).find('button svg[data-icon="question-circle"]')) .expect(ReactSelector('ReactMarkdown').find('strong').withText('test').exists).ok('Bold test from Markdown has been rendered'); }); @@ -168,11 +105,10 @@ test('Check that nodetype without help has no help button', async t => { .click(Selector('#neos-InlineToolbar-AddNode')) .switchToMainWindow() .click(Selector('button#into')) - .expect(ReactSelector('NodeTypeItem').withProps({ nodeType: { label: 'Text_Test' }}).find('button').count).eql(1); + .expect(ReactSelector('NodeTypeItem').withProps({nodeType: {label: 'Text_Test'}}).find('button').count).eql(1); }); test('Create an Image node from ContentTree', async t => { - await t.switchToIframe(contentIframeSelector); const initialImageCount = await Selector('.test-image[src]').count; await t.switchToMainWindow(); @@ -230,7 +166,7 @@ test('Can create content node from inside InlineUI', async t => { .click(Selector('#neos-InlineToolbar-AddNode')) .switchToMainWindow() .click(Selector('button#into')) - .click(ReactSelector('NodeTypeItem').withProps({ nodeType: { label: 'Headline_Test' }})); + .click(ReactSelector('NodeTypeItem').withProps({nodeType: {label: 'Headline_Test'}})); subSection('Type something inside of it'); await Page.waitForIframeLoading(t); diff --git a/Tests/IntegrationTests/Fixtures/1Dimension/inspector.e2e.js b/Tests/IntegrationTests/Fixtures/1Dimension/inspector.e2e.js index 2ffce8df14..61256d0db9 100644 --- a/Tests/IntegrationTests/Fixtures/1Dimension/inspector.e2e.js +++ b/Tests/IntegrationTests/Fixtures/1Dimension/inspector.e2e.js @@ -1,72 +1,139 @@ -import { Selector } from "testcafe"; -import { beforeEach, subSection, checkPropTypes } from "./../../utils.js"; -import { Page } from "./../../pageModel"; +import {Selector} from 'testcafe'; +import {beforeEach, subSection, checkPropTypes} from '../../utils'; +import {Page} from '../../pageModel'; +import {ReactSelector} from 'testcafe-react-selectors'; /* global fixture:true */ fixture`Inspector`.beforeEach(beforeEach).afterEach(() => checkPropTypes()); -test("Can edit the page title via inspector", async t => { +test('Can edit the page title via inspector', async t => { const InspectorTitleProperty = Selector( - "#__neos__editor__property---title" + '#__neos__editor__property---title' ); const InspectorUriPathSegmentProperty = Selector( - "#__neos__editor__property---uriPathSegment" + '#__neos__editor__property---uriPathSegment' ); await Page.waitForIframeLoading(t); - subSection("Rename home page via inspector"); + subSection('Rename home page via inspector'); await t .expect(InspectorTitleProperty.value) - .eql("Home") + .eql('Home') .expect(InspectorUriPathSegmentProperty.value) - .eql("home") + .eql('home') .click(InspectorTitleProperty) - .typeText(InspectorTitleProperty, "-привет!") + .typeText(InspectorTitleProperty, '-привет!') .expect(InspectorTitleProperty.value) - .eql("Home-привет!") + .eql('Home-привет!') .wait(200) - .click(Selector("#neos-UriPathSegmentEditor-sync")) + .click(Selector('#neos-UriPathSegmentEditor-sync')) .expect(InspectorUriPathSegmentProperty.value) - .eql("home-privet") - .click(Selector("#neos-Inspector-Discard")) + .eql('home-privet') + .click(Selector('#neos-Inspector-Discard')) .expect(InspectorTitleProperty.value) - .eql("Home") - .typeText(InspectorTitleProperty, "-1") - .click(Selector("#neos-Inspector-Apply")) + .eql('Home') + .typeText(InspectorTitleProperty, '-1') + .click(Selector('#neos-Inspector-Apply')) .expect(InspectorTitleProperty.value) - .eql("Home-1"); + .eql('Home-1'); await Page.waitForIframeLoading(t); - await t.expect(InspectorTitleProperty.value).eql("Home-1"); + await t.expect(InspectorTitleProperty.value).eql('Home-1'); - subSection("Test unapplied changes dialog - resume"); + subSection('Test unapplied changes dialog - resume'); await t .click(InspectorTitleProperty) - .typeText(InspectorTitleProperty, "-2") + .typeText(InspectorTitleProperty, '-2') .click(Selector('[name="neos-content-main"]')) - .expect(Selector("#neos-UnappliedChangesDialog").exists) + .expect(Selector('#neos-UnappliedChangesDialog').exists) .ok() - .click(Selector("#neos-UnappliedChangesDialog-resume")) - .expect(Selector("#neos-UnappliedChangesDialog").exists) + .click(Selector('#neos-UnappliedChangesDialog-resume')) + .expect(Selector('#neos-UnappliedChangesDialog').exists) .notOk() .expect(InspectorTitleProperty.value) - .eql("Home-1-2"); + .eql('Home-1-2'); - subSection("Test unapplied changes dialog - discard"); + subSection('Test unapplied changes dialog - discard'); await t .click(Selector('[name="neos-content-main"]')) - .click(Selector("#neos-UnappliedChangesDialog-discard")) + .click(Selector('#neos-UnappliedChangesDialog-discard')) .expect(InspectorTitleProperty.value) - .eql("Home-1"); + .eql('Home-1'); - subSection("Test unapplied changes dialog - apply"); + subSection('Test unapplied changes dialog - apply'); await t - .typeText(InspectorTitleProperty, "-3") + .typeText(InspectorTitleProperty, '-3') .click(Selector('[name="neos-content-main"]')) - .click(Selector("#neos-UnappliedChangesDialog-apply")) + .click(Selector('#neos-UnappliedChangesDialog-apply')) .expect(InspectorTitleProperty.value) - .eql("Home-1-3") + .eql('Home-1-3') .click(Selector('[name="neos-content-main"]')) - .expect(Selector("#neos-UnappliedChangesDialog").exists) + .expect(Selector('#neos-UnappliedChangesDialog').exists) .notOk(); }); + +test('Check ClientEval for dependencies between properties of NodeTypes in Inspector', async t => { + await t + .click(Selector('#neos-ContentTree-ToggleContentTree')) + .click(Page.treeNode.withText('Content Collection (main)')) + .click(Selector('#neos-ContentTree-AddNode')) + .click(ReactSelector('NodeTypeItem').find('button>span>span').withText('NodeWithDependingProperties_Test')) + + // WHY: Some NodeTypes trigger a Node Creation Dialog + const isCreationDialogOpen = await Selector('#neos-NodeCreationDialog-CreateNew').exists; + if (isCreationDialogOpen) { + await t.click(Selector('#neos-NodeCreationDialog-CreateNew')) + } + + await Page.waitForIframeLoading(t) + await t.wait(2000) // maybe we should wait for the loading state to finish instead of fixed number of seconds + + const propertyDependedOnSelectBoxSelector = ReactSelector('SelectBoxEditor') + .withProps('identifier', 'propertyDependedOn') + .findReact('SelectBox') + + const propertyDependedOnSelectBox = await propertyDependedOnSelectBoxSelector.getReact() + + const dependingPropertySelectBoxSelector = ReactSelector('SelectBoxEditor') + .withProps('identifier', 'dependingProperty') + .findReact('SelectBox') + + const dependingPropertySelectBox = await dependingPropertySelectBoxSelector.getReact() + + await t + .expect(propertyDependedOnSelectBox.props.value).eql('odd') + .expect(propertyDependedOnSelectBox.props.options).eql([ + {'label': 'odd', value: 'odd'}, + {'label': 'even', value: 'even'} + ]) + + await t + .expect(dependingPropertySelectBox.props.value).eql(null) + .expect(dependingPropertySelectBox.props.options).eql([ + {label: 'label_1', value: 1}, + {label: 'label_3', value: 3}, + {label: 'label_5', value: 5}, + {label: 'label_7', value: 7}, + {label: 'label_9', value: 9} + ]) + + await t.click(propertyDependedOnSelectBoxSelector) + await t + .click(Selector('span').withText('even')) + .wait(2000) // TODO: maybe we should wait for the loading state to finish instead of fixed number of seconds + + const newPropertyDependedOnSelectBoxValue = (await propertyDependedOnSelectBoxSelector.getReact()).props.value + const newDependingPropertySelectBoxOptions = (await dependingPropertySelectBoxSelector.getReact()).props.options + + await t + .expect(newPropertyDependedOnSelectBoxValue).eql('even') + + await t + .expect(newDependingPropertySelectBoxOptions).eql([ + {label: 'label_2', value: 2}, + {label: 'label_4', value: 4}, + {label: 'label_6', value: 6}, + {label: 'label_8', value: 8}, + {label: 'label_10', value: 10} + ]) +})