-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Fix Travis flakiness for Cypress tests (SAP#2725)
Showing
11 changed files
with
2,213 additions
and
2,145 deletions.
There are no files selected for viewing
647 changes: 0 additions & 647 deletions
647
test/e2e-test-application/e2e/tests/0-fiddle/fiddle-navigation.spec.js
Large diffs are not rendered by default.
Oops, something went wrong.
159 changes: 159 additions & 0 deletions
159
test/e2e-test-application/e2e/tests/0-fiddle/fiddle-node-params.spec.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,159 @@ | ||
import fiddleConfig from '../../configs/default'; | ||
import { cloneDeep } from 'lodash'; | ||
|
||
describe('Fiddle 3', () => { | ||
describe('LuigiClient add and delete node and search params', () => { | ||
let newConfig; | ||
beforeEach(() => { | ||
newConfig = cloneDeep(fiddleConfig); | ||
newConfig.routing.useHashRouting = true; | ||
const node = { | ||
pathSegment: 'mynode', | ||
label: 'MyNode', | ||
viewUrl: '/examples/microfrontends/luigi-client-test.html', | ||
clientPermissions: { | ||
urlParameters: { | ||
luigi: { | ||
read: true, | ||
write: true | ||
}, | ||
q: { | ||
read: true, | ||
write: true | ||
} | ||
} | ||
} | ||
}; | ||
newConfig.navigation.nodes[0].children.push(node); | ||
}); | ||
|
||
it('Add and delete search params hash routing enabled', () => { | ||
cy.visitWithFiddleConfig('/home/mynode', newConfig); | ||
cy.getIframeBody().then($body => { | ||
cy.wrap($body) | ||
.find('[data-testid="lui-add-search-params"]') | ||
.invoke('show'); | ||
cy.wrap($body) | ||
.contains('add search params') | ||
.click(); | ||
}); | ||
cy.expectPathToBe('/home/mynode?luigi=rocks&q=test'); | ||
cy.getIframeBody().then($body => { | ||
cy.wrap($body) | ||
.find('[data-testid="lui-delete-search-params"]') | ||
.invoke('show'); | ||
cy.wrap($body) | ||
.contains('delete search params') | ||
.click(); | ||
}); | ||
cy.expectPathToBe('/home/mynode?luigi=rocks'); | ||
}); | ||
it('Add and delete node params hash routing enabled', () => { | ||
cy.visitWithFiddleConfig('/home/mynode', newConfig); | ||
cy.getIframeBody().then($body => { | ||
cy.wrap($body) | ||
.find('[data-testid="lui-add-node-params"]') | ||
.invoke('show'); | ||
cy.wrap($body) | ||
.contains('add node params') | ||
.click(); | ||
}); | ||
cy.expectPathToBe('/home/mynode?%7Eq=test&%7Eluigi=rocks'); | ||
cy.getIframeBody().then($body => { | ||
cy.wrap($body) | ||
.find('[data-testid="lui-delete-node-params"]') | ||
.invoke('show'); | ||
cy.wrap($body) | ||
.contains('delete node params') | ||
.click(); | ||
}); | ||
cy.expectPathToBe('/home/mynode?%7Eluigi=rocks'); | ||
}); | ||
}); | ||
describe('LuigiClient add and delete node and search paramstest', () => { | ||
let newConfig; | ||
beforeEach(() => { | ||
newConfig = cloneDeep(fiddleConfig); | ||
newConfig.routing.useHashRouting = false; | ||
const node = { | ||
pathSegment: 'mynode', | ||
label: 'MyNode', | ||
viewUrl: '/examples/microfrontends/luigi-client-test.html', | ||
clientPermissions: { | ||
urlParameters: { | ||
luigi: { | ||
read: true, | ||
write: true | ||
}, | ||
q: { | ||
read: true, | ||
write: true | ||
} | ||
} | ||
} | ||
}; | ||
newConfig.navigation.nodes[0].children.push(node); | ||
}); | ||
|
||
it('Add and delete search params path routing enabled', () => { | ||
newConfig.routing.useHashRouting = false; | ||
cy.visitFiddleConfigWithPathRouting('', newConfig); | ||
cy.get('.fd-side-nav__main-navigation') | ||
.contains('MyNode') | ||
.click(); | ||
cy.getIframeBody().then($body => { | ||
cy.wrap($body) | ||
.find('[data-testid="lui-add-search-params"]') | ||
.invoke('show'); | ||
cy.wrap($body) | ||
.contains('add search params') | ||
.click(); | ||
}); | ||
cy.location().should(location => { | ||
expect(location.pathname + location.search).to.eq('/home/mynode?luigi=rocks&q=test'); | ||
}); | ||
|
||
cy.getIframeBody().then($body => { | ||
cy.wrap($body) | ||
.find('[data-testid="lui-delete-search-params"]') | ||
.invoke('show'); | ||
cy.wrap($body) | ||
.contains('delete search params') | ||
.click(); | ||
}); | ||
cy.location().should(location => { | ||
expect(location.pathname + location.search).to.eq('/home/mynode?luigi=rocks'); | ||
}); | ||
}); | ||
}); | ||
describe('Custom text in the footer', () => { | ||
it('checks if the text in footer exist, defined by settings', () => { | ||
cy.window().then(win => { | ||
//define Footer text as part of the global config | ||
const config = win.Luigi.getConfig(); | ||
config.settings.sideNavFooterText = 'Luigi Footer'; | ||
win.Luigi.configChanged(); | ||
|
||
cy.get('[data-testid="lui-side-nav__footer--text"]').should('exist'); | ||
cy.get('[data-testid="lui-side-nav__footer--text"]').contains('Luigi Footer'); | ||
}); | ||
}); | ||
|
||
it('checks if getNavFooterContainer() working', () => { | ||
cy.window().then(win => { | ||
//define Footer text as part of the global config | ||
const config = win.Luigi.getConfig(); | ||
config.settings.sideNavFooterText = 'Luigi Footer'; | ||
win.Luigi.configChanged(); | ||
|
||
//Checks if the DOM element required by getNavFooterContainer() exist | ||
cy.get('[data-testid="lui-side-nav__footer"]').should('exist'); | ||
|
||
const FooterContainer = win.Luigi.elements().getNavFooterContainer(); | ||
|
||
//Checks if Luigi.elements().getNavFooterContainer() reads the appropriate DOM element. | ||
cy.get(FooterContainer).contains('Luigi Footer'); | ||
}); | ||
}); | ||
}); | ||
}); |
496 changes: 496 additions & 0 deletions
496
test/e2e-test-application/e2e/tests/0-fiddle/fiddle-theming.spec.js
Large diffs are not rendered by default.
Oops, something went wrong.
159 changes: 159 additions & 0 deletions
159
test/e2e-test-application/e2e/tests/1-angular/luigi-client-link-manager-features-2.spec.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,159 @@ | ||
describe('Luigi client linkManager features', () => { | ||
const localRetries = { | ||
retries: { | ||
runMode: 3, | ||
openMode: 3 | ||
} | ||
}; | ||
|
||
beforeEach(() => { | ||
cy.visitLoggedIn('/'); | ||
}); | ||
|
||
describe('linkManager preserve view, pathExists', () => { | ||
let $iframeBody; | ||
beforeEach(() => { | ||
// "clear" variables to make sure they are not reused and throw error in case something goes wrong | ||
$iframeBody = undefined; | ||
cy.visitLoggedIn('/projects/pr2'); | ||
cy.getIframeBody().then(result => { | ||
$iframeBody = result; | ||
}); | ||
}); | ||
|
||
|
||
it('navigate with preserve view functionality', localRetries, () => { | ||
// navigate with preserve view functionality | ||
cy.wrap($iframeBody) | ||
.contains('with preserved view: project to global settings and back') | ||
.click(); | ||
cy.expectPathToBe('/settings'); | ||
|
||
// wait for the alert coming from an inactive iFrame to be shown and second iFrame to be loaded | ||
cy.get('.fd-message-strip').should('contain', 'Information alert sent from an inactive iFrame'); | ||
|
||
cy.getIframeBody().then($iframeBody => { | ||
cy.wrap($iframeBody) | ||
.find('input') | ||
.clear() | ||
.type('tets'); | ||
cy.wrap($iframeBody) | ||
.find('button') | ||
.click(); | ||
cy.expectPathToBe('/projects/pr2'); | ||
}); | ||
}); | ||
|
||
it('navigate with preserve view and goBack dynamic context', localRetries, () => { | ||
//navigate with preserve view functionality | ||
cy.wrap($iframeBody) | ||
.contains('with preserved view: to dynamic node and go back') | ||
.click(); | ||
cy.expectPathToBe('/projects/pr1/users/groups/test1/settings'); | ||
|
||
cy.getIframeBody().then($iframeBody => { | ||
cy.wrap($iframeBody) | ||
.contains('projects/pr1/users/groups/test2/settings') | ||
.click(); | ||
cy.expectPathToBe('/projects/pr1/users/groups/test2/settings'); | ||
|
||
cy.getIframeBody().then($iframeBody => { | ||
cy.wrap($iframeBody) | ||
.contains('Go Back') | ||
.click(); | ||
cy.expectPathToBe('/projects/pr1/users/groups/test1/settings'); | ||
}); | ||
}); | ||
}); | ||
|
||
it('path exists check', localRetries, () => { | ||
[ | ||
// non-existent relative path | ||
{ path: 'projects/pr2/', successExpected: false }, | ||
// non-existent absolute path | ||
{ path: '/developers', successExpected: false }, | ||
// existent absolute path with '/' at the end | ||
{ path: '/projects/pr2/', successExpected: true }, | ||
// existent absolute path without '/' at the end | ||
{ path: '/projects/pr2', successExpected: true }, | ||
// existent path with two dynamic pathSegments | ||
{ | ||
path: '/projects/pr1/users/groups/avengers/settings/dynamic-two', | ||
successExpected: true | ||
}, | ||
// existent path with intent | ||
{ | ||
path: '#?intent=Sales-settings', | ||
successExpected: true | ||
}, | ||
// existent path with intent and parameters | ||
{ | ||
path: '#?intent=Sales-settings?param1=abc¶m2=bcd', | ||
successExpected: true | ||
}, | ||
// nonexistent path with intent and not-mapped intent configuration | ||
{ | ||
path: '#?intent=Sales-fake?param1=abc¶m2=bcd', | ||
successExpected: false | ||
}, | ||
// existent path with intent and no mapped intent key name | ||
{ | ||
path: '#?international=Sales-fake?param1=abc¶m2=bcd', | ||
successExpected: false | ||
}, | ||
// existent relative path | ||
{ path: 'developers', successExpected: true } | ||
].forEach(data => { | ||
const msgExpected = data.successExpected ? `Path ${data.path} exists` : `Path ${data.path} does not exist`; | ||
const checkPathSelector = '.link-manager .check-path'; | ||
cy.wrap($iframeBody) | ||
.find(checkPathSelector + ' input') | ||
.clear() | ||
.type(data.path); | ||
cy.wrap($iframeBody) | ||
.find(checkPathSelector + ' button') | ||
.click(); | ||
cy.wrap($iframeBody) | ||
.find(checkPathSelector + ' .check-path-result') | ||
.contains(msgExpected); | ||
}); | ||
}); | ||
|
||
it('go back', localRetries, () => { | ||
// go back | ||
cy.expectPathToBe('/projects/pr2'); | ||
cy.wrap($iframeBody) | ||
.contains('go back: single iframe') | ||
.click(); | ||
cy.expectPathToBe('/overview'); | ||
}); | ||
}); | ||
|
||
describe('linkManager preserveQueryParams features', () => { | ||
let $iframeBody; | ||
beforeEach(() => { | ||
// "clear" variables to make sure they are not reused and throw error in case something goes wrong | ||
$iframeBody = undefined; | ||
cy.visitLoggedIn('/projects/pr1/settings?query=test&ft=ft1'); | ||
cy.getIframeBody().then(result => { | ||
$iframeBody = result; | ||
}); | ||
}); | ||
|
||
it('Naviage to pr2 with query parameters', () => { | ||
cy.wrap($iframeBody) | ||
.contains('navigate to project 2 with query parameters') | ||
.click(); | ||
cy.expectPathToBe('/projects/pr2'); | ||
cy.expectSearchToBe('?query=test&ft=ft1'); | ||
}); | ||
|
||
it('Naviage to pr2 without query parameters', () => { | ||
cy.wrap($iframeBody) | ||
.contains('navigate to project 2 without query parameters') | ||
.click(); | ||
cy.expectPathToBe('/projects/pr2'); | ||
cy.expectSearchToBe(''); | ||
}); | ||
}); | ||
}); |
195 changes: 195 additions & 0 deletions
195
test/e2e-test-application/e2e/tests/1-angular/luigi-client-link-manager-features-3.spec.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,195 @@ | ||
describe('Luigi client linkManager', () => { | ||
beforeEach(() => { | ||
cy.visitLoggedIn('/'); | ||
}); | ||
|
||
describe('Goes back and pass data ', () => { | ||
let $iframeBody; | ||
const $inputTypeNormal = 'Buongiorno Luigi'; | ||
const $inputTypeModal = 'Buona notte Luigi'; | ||
beforeEach(() => { | ||
cy.visitLoggedIn('/projects/pr2'); | ||
cy.getIframeBody().then(result => { | ||
$iframeBody = result; | ||
}); | ||
}); | ||
|
||
it('goes to Settings and comes back with data', () => { | ||
cy.expectPathToBe('/projects/pr2'); | ||
|
||
// navigate to settings | ||
cy.wrap($iframeBody) | ||
.contains(' with params: project to global settings and back') | ||
.click(); | ||
|
||
cy.expectPathToBe('/settings'); | ||
|
||
cy.getIframeBody().then($body => { | ||
// type buongiorno into input | ||
cy.wrap($body) | ||
.find('input') | ||
.clear() | ||
.type($inputTypeNormal); | ||
|
||
cy.wrap($body) | ||
.find('button') | ||
.click(); | ||
|
||
cy.expectPathToBe('/projects/pr2'); | ||
|
||
cy.wrap($iframeBody).should('contain', $inputTypeNormal); | ||
}); | ||
}); | ||
|
||
it('goes to Settings with modal and back with data', () => { | ||
cy.expectPathToBe('/projects/pr2'); | ||
|
||
cy.wrap($iframeBody) | ||
.contains('rendered in a modal') | ||
.click(); | ||
|
||
// navigate to the modal's iframe | ||
cy.get('[data-testid=modal-mf] iframe') | ||
.eq(0) | ||
.iframe() | ||
.then($modal => { | ||
cy.wrap($modal) | ||
.find('input') | ||
.clear() | ||
.type($inputTypeModal); | ||
|
||
cy.wrap($modal) | ||
.contains('Click here') | ||
.click(); | ||
}); | ||
cy.wrap($iframeBody).should('contain', $inputTypeModal); | ||
}); | ||
}); | ||
|
||
describe('linkManager navigation from a modal', () => { | ||
let $iframeBody; | ||
beforeEach(() => { | ||
cy.getIframeBody().then(result => { | ||
$iframeBody = result; | ||
cy.goToLinkManagerMethods($iframeBody); | ||
}); | ||
}); | ||
it('absolute path navigation', () => { | ||
cy.goToOverviewPage(); | ||
cy.wrap($iframeBody) | ||
.find('[data-testid=open-pr1-settings-modal]') | ||
.click(); | ||
|
||
cy.getIframeBody({}, 0, '.iframeModalCtn._modal').then(result => { | ||
$iframeBody = result; | ||
cy.wrap($iframeBody) | ||
.contains('absolute: to overview') | ||
.click(); | ||
cy.expectPathToBe('/overview'); | ||
}); | ||
}); | ||
it('relative path navigation', () => { | ||
cy.goToOverviewPage(); | ||
cy.wrap($iframeBody) | ||
.find('[data-testid=open-pr1-settings-modal]') | ||
.click(); | ||
|
||
cy.getIframeBody({}, 0, '.iframeModalCtn._modal').then(result => { | ||
$iframeBody = result; | ||
cy.wrap($iframeBody) | ||
.contains('relative: to stakeholders') | ||
.click(); | ||
cy.get('.fd-message-strip').contains( | ||
'Could not map the exact target node for the requested route projects/pr1/settings/users/groups/stakeholders.' | ||
); | ||
}); | ||
}); | ||
it('fromCloestContext navigation', () => { | ||
cy.goToOverviewPage(); | ||
cy.wrap($iframeBody) | ||
.find('[data-testid=open-pr1-settings-modal]') | ||
.click(); | ||
|
||
cy.getIframeBody({}, 0, '.iframeModalCtn._modal').then(result => { | ||
$iframeBody = result; | ||
cy.wrap($iframeBody) | ||
.contains('closest parent: to stakeholders') | ||
.click(); | ||
cy.expectPathToBe('/projects/pr1/users/groups/stakeholders'); | ||
}); | ||
}); | ||
it('fromContext navigation', () => { | ||
cy.goToOverviewPage(); | ||
cy.wrap($iframeBody) | ||
.find('[data-testid=open-pr1-settings-modal]') | ||
.click(); | ||
|
||
cy.getIframeBody({}, 0, '.iframeModalCtn._modal').then(result => { | ||
$iframeBody = result; | ||
cy.wrap($iframeBody) | ||
.contains('parent by name: project to settings') | ||
.click(); | ||
cy.expectPathToBe('/projects/pr1/settings'); | ||
}); | ||
}); | ||
it('fromClosestContext navigation with node params', () => { | ||
cy.goToOverviewPage(); | ||
cy.wrap($iframeBody) | ||
.find('[data-testid=open-pr1-settings-modal]') | ||
.click(); | ||
|
||
cy.getIframeBody({}, 0, '.iframeModalCtn._modal').then(result => { | ||
$iframeBody = result; | ||
cy.wrap($iframeBody) | ||
.contains('project to settings with params (foo=bar)') | ||
.click(); | ||
}); | ||
cy.expectPathToBe('/projects/pr1/settings'); | ||
cy.wrap($iframeBody).should('contain', 'Called with params:'); | ||
cy.wrap($iframeBody).should('contain', '"foo": "bar"'); | ||
|
||
cy.expectSearchToBe('?~foo=bar'); | ||
}); | ||
}); | ||
|
||
describe('linkManager wrong paths navigation', () => { | ||
let $iframeBody; | ||
beforeEach(() => { | ||
cy.getIframeBody().then(result => { | ||
$iframeBody = result; | ||
cy.goToLinkManagerMethods($iframeBody); | ||
}); | ||
}); | ||
it('navigate to a partly wrong link', () => { | ||
cy.wrap($iframeBody) | ||
.contains('Partly wrong link') | ||
.click(); | ||
cy.expectPathToBe('/projects/pr2/miscellaneous2'); | ||
|
||
cy.get('.fd-message-strip').contains( | ||
'Could not map the exact target node for the requested route projects/pr2/miscellaneous2/maskopatol' | ||
); | ||
|
||
// navigate somewhere else | ||
cy.goToProjectsPage(); | ||
|
||
// alert disappears | ||
cy.get('.fd-message-strip').should('not.exist'); | ||
}); | ||
|
||
it('navigate to a totally wrong link', () => { | ||
cy.wrap($iframeBody) | ||
.contains('Totally wrong link') | ||
.click(); | ||
cy.expectPathToBe('/overview'); | ||
|
||
cy.get('.fd-message-strip').contains('Could not find the requested route maskopatol/has/a/child'); | ||
|
||
// navigate somewhere else | ||
cy.goToProjectsPage(); | ||
|
||
// alert disappears | ||
cy.get('.fd-message-strip').should('not.exist'); | ||
}); | ||
}); | ||
}); |
337 changes: 337 additions & 0 deletions
337
test/e2e-test-application/e2e/tests/1-angular/luigi-client-link-manager-features-4.spec.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,337 @@ | ||
describe('Luigi Client linkManager Webcomponent, Drawer', () => { | ||
beforeEach(() => { | ||
cy.visitLoggedIn('/'); | ||
}); | ||
|
||
describe('Drawer', () => { | ||
let $iframeBody; | ||
beforeEach(() => { | ||
cy.visitLoggedIn('/projects/pr2'); | ||
cy.getIframeBody().then(result => { | ||
$iframeBody = result; | ||
cy.goToLinkManagerMethods($iframeBody); | ||
cy.expectPathToBe('/projects/pr2'); | ||
cy.get('.drawer').should('not.exist'); | ||
}); | ||
}); | ||
|
||
it('Open and close drawer component with default settings', () => { | ||
cy.wrap($iframeBody) | ||
.contains('Open drawer with default settings') | ||
.click(); | ||
|
||
cy.get('.drawer').should('exist'); | ||
cy.expectPathToBe('/projects/pr2'); | ||
|
||
cy.get('.drawer-dialog button[aria-label="close"]') | ||
.should('exist') | ||
.click(); | ||
cy.get('.drawer-dialog button[aria-label="close"]').should('not.exist'); | ||
cy.get('.drawer').should('not.exist'); | ||
}); | ||
|
||
it('Open and close drawer component with go back button', () => { | ||
cy.wrap($iframeBody) | ||
.contains('Open view in drawer component') | ||
.click(); | ||
cy.get('.drawer').should('exist'); | ||
cy.expectPathToBe('/projects/pr2'); | ||
cy.get('.drawer .fd-dialog__close').should('not.exist'); | ||
cy.wrap($iframeBody) | ||
.contains('go back: single iframe, standard history back') | ||
.click(); | ||
cy.get('.drawer').should('not.exist'); | ||
}); | ||
|
||
it('Open and close drawer component with webcomponent', () => { | ||
cy.window().then(win => { | ||
win.Luigi.navigation().openAsDrawer('/projects/pr1/webcomponent'); | ||
cy.get('.drawer').should('exist'); | ||
cy.expectPathToBe('/projects/pr2'); | ||
|
||
cy.get('.drawer-dialog button[aria-label="close"]') | ||
.should('exist') | ||
.click(); | ||
cy.get('.drawer').should('not.exist'); | ||
}); | ||
}); | ||
|
||
it('Check main iframe width after Open and close drawer component with default settings', () => { | ||
cy.window().then(win => { | ||
cy.get('.fd-page.iframeContainer iframe').then($container => { | ||
cy.get('#app').then($page => { | ||
const containerWidth = parseFloat(win.getComputedStyle($container[0]).width); | ||
const pageWidth = parseFloat(win.getComputedStyle($page[0]).width); | ||
|
||
cy.get('.iframeContainer iframe') | ||
.invoke('width') | ||
.should('eq', containerWidth); | ||
|
||
cy.wrap($iframeBody) | ||
.contains('Open drawer with no overlap') | ||
.click(); | ||
|
||
cy.wait(500); | ||
|
||
cy.get('.drawer-dialog') | ||
.invoke('width') | ||
.should('eq', pageWidth * 0.25); | ||
|
||
cy.get('.iframeContainer iframe') | ||
.invoke('width') | ||
.should('eq', containerWidth - pageWidth * 0.25); | ||
cy.expectPathToBe('/projects/pr2'); | ||
|
||
// cy.get('.drawer-dialog button[aria-label="close"]') | ||
// .should('exist') | ||
// .click(); | ||
|
||
// cy.get('.iframeContainer iframe') | ||
// .invoke('width') | ||
// .should('eq', containerWidth); | ||
}); | ||
}); | ||
}); | ||
}); | ||
|
||
it('Check main iframe width after Open and close drawer component with webcomponent', () => { | ||
cy.window().then(win => { | ||
cy.get('.fd-page.iframeContainer iframe').then($container => { | ||
cy.get('#app').then($page => { | ||
const containerWidth = parseFloat(win.getComputedStyle($container[0]).width); | ||
const pageWidth = parseFloat(win.getComputedStyle($page[0]).width); | ||
|
||
cy.get('.iframeContainer iframe') | ||
.invoke('width') | ||
.should('eq', containerWidth); | ||
|
||
win.Luigi.navigation().openAsDrawer('/projects/pr1/webcomponent', { overlap: false }); | ||
|
||
cy.wait(300); | ||
|
||
cy.get('.drawer-dialog') | ||
.invoke('width') | ||
.should('eq', pageWidth * 0.25); | ||
|
||
cy.get('.iframeContainer iframe') | ||
.invoke('width') | ||
.should('eq', containerWidth - pageWidth * 0.25); | ||
cy.expectPathToBe('/projects/pr2'); | ||
|
||
cy.get('.drawer-dialog button[aria-label="close"]') | ||
.should('exist') | ||
.click(); | ||
|
||
cy.wait(300); | ||
|
||
cy.get('.iframeContainer iframe') | ||
.invoke('width') | ||
.should('eq', containerWidth); | ||
}); | ||
}); | ||
}); | ||
}); | ||
}); | ||
|
||
describe('Split View', () => { | ||
let $iframeBody; | ||
beforeEach(() => { | ||
cy.visitLoggedIn('/projects/pr2'); | ||
cy.getIframeBody().then(result => { | ||
$iframeBody = result; | ||
cy.goToLinkManagerMethods($iframeBody); | ||
cy.expectPathToBe('/projects/pr2'); | ||
cy.get('.lui-split-view').should('not.exist'); | ||
}); | ||
}); | ||
|
||
it('Open Split View component with default settings', () => { | ||
cy.wrap($iframeBody) | ||
.contains('open view in split view with params') | ||
.click(); | ||
|
||
cy.get('.lui-split-view').should('exist'); | ||
cy.expectPathToBe('/projects/pr2'); | ||
}); | ||
|
||
it('Check main iframe height after open Split View component with default settings', () => { | ||
cy.window().then(win => { | ||
cy.get('.fd-page.iframeContainer').then($iframe => { | ||
const iframeHeight = parseFloat(win.getComputedStyle($iframe[0]).height); | ||
|
||
cy.get('.iframeContainer') | ||
.invoke('height') | ||
.should('eq', iframeHeight); | ||
|
||
cy.wrap($iframeBody) | ||
.contains('open view in split view with params') | ||
.click(); | ||
|
||
cy.wait(500); | ||
|
||
cy.get('.splitViewContainer').then($splitViewContainer => { | ||
const splitViewHeight = parseFloat(win.getComputedStyle($splitViewContainer[0]).height); | ||
|
||
cy.get('.splitViewContainer') | ||
.invoke('height') | ||
.should('eq', splitViewHeight); | ||
|
||
if (`${splitViewHeight}px` === win.getComputedStyle($iframe[0]).marginBottom) { | ||
cy.log('Positive'); | ||
} else { | ||
cy.error('Negative'); | ||
} | ||
cy.expectPathToBe('/projects/pr2'); | ||
}); | ||
}); | ||
}); | ||
}); | ||
|
||
it('Check main iframe height after open and close Split View component with default settings', () => { | ||
cy.window().then(win => { | ||
cy.get('.fd-page.iframeContainer').then($iframe => { | ||
const iframeHeight = parseFloat(win.getComputedStyle($iframe[0]).height); | ||
|
||
cy.get('.iframeContainer') | ||
.invoke('height') | ||
.should('eq', iframeHeight); | ||
|
||
cy.wrap($iframeBody) | ||
.contains('open view in split view with params') | ||
.click(); | ||
|
||
cy.wait(500); | ||
|
||
cy.get('.splitViewContainer').then($splitViewContainer => { | ||
cy.get('.lui-collapse-btn').click(); | ||
|
||
cy.wait(500); | ||
|
||
const splitViewHeight = parseFloat(win.getComputedStyle($splitViewContainer[0]).height); | ||
|
||
if (`${splitViewHeight}px` === win.getComputedStyle($iframe[0]).marginBottom) { | ||
cy.log('Positive'); | ||
} else { | ||
cy.error('Negative'); | ||
} | ||
cy.expectPathToBe('/projects/pr2'); | ||
}); | ||
}); | ||
}); | ||
}); | ||
}); | ||
|
||
describe('Webcomponent visibleForFeatureToggles test', () => { | ||
beforeEach(() => { | ||
cy.visitLoggedIn('/projects/pr1/wc_grid'); | ||
}); | ||
|
||
it('open webcomponent with visibleForFeatureToggles', () => { | ||
cy.window().then(win => { | ||
cy.wait(500); | ||
cy.get('.wcContainer>div>div>*').then(container => { | ||
const root = container.children().prevObject[0].shadowRoot; | ||
const wcContent = root.querySelector('p').innerText; | ||
expect(wcContent).to.equal('Some input text !ft'); | ||
}); | ||
}); | ||
}); | ||
}); | ||
|
||
describe('Webcomponent compound view test', () => { | ||
beforeEach(() => { | ||
cy.visitLoggedIn('/projects/pr1/wc_grid_compound'); | ||
}); | ||
|
||
it('open webcomponent btn', () => { | ||
cy.window().then(win => { | ||
cy.wait(700); | ||
cy.get('.wcContainer>div>div>*').then(container => { | ||
cy.wait(500); | ||
const root = container.children().prevObject[0].shadowRoot; | ||
const wcContent = root.querySelector('button').innerText; | ||
|
||
expect(wcContent).to.equal('Start'); | ||
}); | ||
}); | ||
}); | ||
|
||
it('open webcomponent timer', () => { | ||
cy.window().then(win => { | ||
cy.wait(500); | ||
cy.get('.wcContainer>div>div>*').then(container => { | ||
const root = container.children().prevObject[1].shadowRoot; | ||
const wcContent = root.querySelector('p').innerText; | ||
|
||
expect(wcContent).to.equal('0'); | ||
}); | ||
}); | ||
}); | ||
|
||
it('click on webcomponent btn', () => { | ||
cy.window().then(win => { | ||
cy.wait(500); | ||
cy.get('.wcContainer>div>div>*').then(container => { | ||
const root = container.children().prevObject[0].shadowRoot; | ||
root.querySelector('button').click(); | ||
const wcContent = root.querySelector('button').innerText; | ||
|
||
expect(wcContent).to.equal('Stop'); | ||
}); | ||
}); | ||
}); | ||
|
||
it('listener on webcomponent timer', () => { | ||
cy.window().then(win => { | ||
cy.wait(500); | ||
cy.get('.wcContainer>div>div>*').then(container => { | ||
const rootBtn = container.children().prevObject[0].shadowRoot; | ||
rootBtn.querySelector('button').click(); | ||
const root = container.children().prevObject[1].shadowRoot; | ||
const wcContent = root.querySelector('p').innerText; | ||
|
||
expect(wcContent).to.equal('1'); | ||
}); | ||
}); | ||
}); | ||
|
||
it('click start timer on webcomponent btn and reaction in webcomponent timer', () => { | ||
cy.window().then(win => { | ||
cy.wait(500); | ||
cy.get('.wcContainer>div>div>*').then(container => { | ||
const rootBtn = container.children().prevObject[0].shadowRoot; | ||
const wcContentStart = container.children().prevObject[1].shadowRoot.querySelector('p').innerText; | ||
rootBtn.querySelector('button').click(); | ||
const wcContent = rootBtn.querySelector('button').innerText; | ||
expect(wcContent).to.equal('Stop'); | ||
|
||
cy.wait(500); | ||
const wcContentStop = container.children().prevObject[1].shadowRoot.querySelector('p').innerText; | ||
expect(wcContentStart).to.not.equal(wcContentStop); | ||
}); | ||
}); | ||
}); | ||
|
||
it('click start and stop timer on webcomponent btn and reaction in webcomponent timer', () => { | ||
cy.window().then(win => { | ||
cy.wait(500); | ||
cy.get('.wcContainer>div>div>*').then(container => { | ||
const rootBtn = container.children().prevObject[0].shadowRoot; | ||
rootBtn.querySelector('button').click(); | ||
cy.wait(500); | ||
|
||
const wcContentStart = container.children().prevObject[1].shadowRoot.querySelector('p').innerText; | ||
|
||
rootBtn.querySelector('button').click(); | ||
const wcContent = rootBtn.querySelector('button').innerText; | ||
expect(wcContent).to.equal('Start'); | ||
|
||
cy.wait(500); | ||
const wcContentStop = container.children().prevObject[1].shadowRoot.querySelector('p').innerText; | ||
expect(wcContentStart).to.not.equal(wcContentStop); | ||
}); | ||
}); | ||
}); | ||
}); | ||
|
||
}); |
655 changes: 2 additions & 653 deletions
655
test/e2e-test-application/e2e/tests/1-angular/luigi-client-link-manager-features.spec.js
Large diffs are not rendered by default.
Oops, something went wrong.
197 changes: 197 additions & 0 deletions
197
test/e2e-test-application/e2e/tests/1-angular/navigation-2.spec.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,197 @@ | ||
describe('Navigation', () => { | ||
beforeEach(() => { | ||
cy.visitLoggedIn('/'); | ||
}); | ||
|
||
describe('Sidenav & Misc', () => { | ||
it( | ||
'keepSelectedForChildren', | ||
{ | ||
retries: { | ||
runMode: 3, | ||
openMode: 3 | ||
} | ||
}, | ||
() => { | ||
// keep selected for children example | ||
cy.get('.fd-shellbar') | ||
.contains('Overview') | ||
.click(); | ||
|
||
cy.wait(500); | ||
// dig into the iframe | ||
|
||
cy.getIframeBody().then($iframeBody => { | ||
cy.wrap($iframeBody) | ||
.find('.fd-list__item') | ||
.contains('keepSelectedForChildren') | ||
.click(); | ||
cy.wait(500); | ||
}); | ||
|
||
cy.expectPathToBe('/projects/pr1/avengers'); | ||
|
||
//the iframe is has been replaced with another one, we need to "get" it again | ||
cy.getIframeBody().then($iframeBody => { | ||
// wrap this body with cy so as to do cy actions inside iframe elements | ||
cy.wrap($iframeBody) | ||
.find('.fd-list__item') | ||
.contains('Thor') | ||
.click(); | ||
cy.wait(500); | ||
}); | ||
cy.expectPathToBe('/projects/pr1/avengers/thor'); | ||
|
||
cy.get('.fd-app__sidebar').should('contain', 'Keep Selected Example'); | ||
} | ||
); | ||
|
||
it('Node with link to another node', () => { | ||
const goToAnotherNodeFeature = () => { | ||
cy.get('.fd-shellbar') | ||
.contains('Overview') | ||
.click(); | ||
|
||
cy.wait(500); | ||
cy.getIframeBody().then($iframeBody => { | ||
cy.wrap($iframeBody) | ||
.find('.fd-list__item strong') | ||
.contains('Node with link to another node') | ||
.click(); | ||
}); | ||
}; | ||
|
||
//go to absolute path | ||
goToAnotherNodeFeature(); | ||
cy.get('.fd-app__sidebar .fd-nested-list__item') | ||
.contains('Go to absolute path') | ||
.click(); | ||
|
||
cy.expectPathToBe('/settings'); | ||
|
||
//go to relative path from the parent node | ||
goToAnotherNodeFeature(); | ||
cy.get('.fd-app__sidebar .fd-nested-list__item') | ||
.contains('Go to relative path') | ||
.click(); | ||
|
||
cy.expectPathToBe('/projects/pr2/dps/dps1'); | ||
|
||
//go to relative path from node that is a sibiling | ||
goToAnotherNodeFeature(); | ||
cy.get('.fd-app__sidebar .fd-nested-list__item') | ||
.contains('Keep Selected Example') | ||
.click(); | ||
|
||
cy.expectPathToBe('/projects/pr2/avengers'); | ||
|
||
cy.get('.fd-app__sidebar .fd-nested-list__item') | ||
.contains('Go to relative path') | ||
.click(); | ||
|
||
cy.expectPathToBe('/projects/pr2/dps/dps1'); | ||
}); | ||
|
||
it('Left navigation hidden', () => { | ||
cy.get('.fd-shellbar') | ||
.contains('Projects') | ||
.click(); | ||
cy.get('.fd-app__sidebar .fd-nested-list__item') | ||
.contains('Project One') | ||
.click(); | ||
|
||
cy.get('.fd-app__sidebar') | ||
.contains('Hide left navigation') | ||
.click(); | ||
|
||
cy.get('.no-side-nav').should('exist'); | ||
cy.get('.fd-app__sidebar').should('not.be.visible'); | ||
}); | ||
|
||
it('Open navigation node in a modal', () => { | ||
// projects page | ||
cy.get('.fd-shellbar') | ||
.contains('Projects') | ||
.click(); | ||
|
||
//projects page | ||
cy.get('.fd-app__sidebar') | ||
.contains('Project Two') | ||
.click(); | ||
|
||
//project two page | ||
cy.expectPathToBe('/projects/pr2'); | ||
|
||
cy.get('.fd-app__sidebar') | ||
.contains('Miscellaneous2') | ||
.click(); | ||
|
||
cy.get('[data-testid=modal-mf]').should('be.visible'); | ||
|
||
cy.get('[data-testid=modal-mf] [aria-label=close]').click(); | ||
|
||
cy.get('[data-testid=modal-mf]').should('not.be.visible'); | ||
}); | ||
|
||
it('Nav sync - click sidenav', () => { | ||
// projects page | ||
cy.get('.fd-shellbar') | ||
.contains('Projects') | ||
.click(); | ||
|
||
//projects page | ||
cy.get('.fd-app__sidebar') | ||
.contains('Project Two') | ||
.click(); | ||
|
||
cy.get('.fd-app__sidebar') | ||
.contains('Nav Sync') | ||
.click(); | ||
|
||
cy.expectPathToBe('/projects/pr2/nav-sync/one'); | ||
|
||
['four', 'three', 'two', 'three', 'two'].forEach(label => { | ||
cy.get('.fd-app__sidebar') | ||
.contains(label) | ||
.click(); | ||
|
||
cy.expectPathToBe('/projects/pr2/nav-sync/' + label); | ||
|
||
cy.getIframeBody().then($iframeBody => { | ||
cy.wrap($iframeBody) | ||
.find('.fd-list__item') | ||
.contains('Current pathsegment: ' + label); | ||
}); | ||
}); | ||
}); | ||
|
||
it('Nav sync - use synched nav', () => { | ||
// projects page | ||
cy.get('.fd-shellbar') | ||
.contains('Projects') | ||
.click(); | ||
|
||
//projects page | ||
cy.get('.fd-app__sidebar') | ||
.contains('Project Two') | ||
.click(); | ||
|
||
cy.get('.fd-app__sidebar') | ||
.contains('Nav Sync') | ||
.click(); | ||
|
||
cy.expectPathToBe('/projects/pr2/nav-sync/one'); | ||
|
||
const labels = ['two', 'three', 'four', 'one']; | ||
labels.forEach((label, index) => { | ||
cy.getIframeBody().then($iframeBody => { | ||
cy.wrap($iframeBody) | ||
// .find('.fd-link') | ||
.contains(label) | ||
.click(); | ||
}); | ||
cy.expectPathToBe('/projects/pr2/nav-sync/' + label); | ||
}); | ||
}); | ||
}); | ||
}); |
353 changes: 353 additions & 0 deletions
353
test/e2e-test-application/e2e/tests/1-angular/navigation-3.spec.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,353 @@ | ||
describe('Navigation', () => { | ||
beforeEach(() => { | ||
cy.visitLoggedIn('/'); | ||
}); | ||
|
||
describe('Node navigation title', () => { | ||
it('Node navigation title attr exist', () => { | ||
cy.get('.fd-shellbar') | ||
.contains('Projects') | ||
.click(); | ||
cy.get('.fd-app__sidebar .fd-nested-list__item') | ||
.contains('Project One') | ||
.click(); | ||
cy.get('.fd-nested-list__link') | ||
.contains('Miscellaneous2') | ||
.parent() | ||
.should('have.attr', 'title', 'Miscellaneous2'); | ||
}); | ||
|
||
it('Node navigation title attr tooltipText text', () => { | ||
cy.get('.fd-shellbar') | ||
.contains('Projects') | ||
.click(); | ||
cy.get('.fd-app__sidebar .fd-nested-list__item') | ||
.contains('Project One') | ||
.click(); | ||
cy.get('.fd-nested-list__link') | ||
.contains('Webcomponent') | ||
.parent() | ||
.should('have.attr', 'title', 'Webcomponent tooltipText'); | ||
}); | ||
|
||
it('Node navigation title attr tooltipText not exist', () => { | ||
cy.get('.fd-shellbar') | ||
.contains('Projects') | ||
.click(); | ||
cy.get('.fd-app__sidebar .fd-nested-list__item') | ||
.contains('Project One') | ||
.click(); | ||
cy.get('.fd-nested-list__link') | ||
.contains('Miscellaneous2 (Isolated View)') | ||
.parent() | ||
.should('have.attr', 'title', 'Miscellaneous2 (Isolated View)'); | ||
}); | ||
|
||
it('Node navigation title attr default.tooltipText text', () => { | ||
cy.window().then(win => { | ||
const config = win.Luigi.getConfig(); | ||
config.navigation.defaults = { | ||
tooltipText: 'Defaults tooltipText' | ||
}; | ||
win.Luigi.configChanged('settings.navigation'); | ||
cy.get('.fd-shellbar') | ||
.contains('Projects') | ||
.click(); | ||
cy.get('.fd-app__sidebar .fd-nested-list__item') | ||
.contains('Project One') | ||
.click(); | ||
cy.get('.fd-nested-list__link') | ||
.contains('Default Child node Example') | ||
.parent() | ||
.should('have.attr', 'title', 'Defaults tooltipText'); | ||
}); | ||
}); | ||
|
||
it('Node navigation title attr default.tooltipText set false', () => { | ||
cy.window().then(win => { | ||
const config = win.Luigi.getConfig(); | ||
config.navigation.defaults = { | ||
tooltipText: false | ||
}; | ||
win.Luigi.configChanged('settings.navigation'); | ||
cy.get('.fd-shellbar') | ||
.contains('Projects') | ||
.click(); | ||
cy.get('.fd-app__sidebar .fd-nested-list__item') | ||
.contains('Project One') | ||
.click(); | ||
cy.get('.fd-nested-list__link') | ||
.contains('Miscellaneous2') | ||
.parent() | ||
.should('have.attr', 'title', ''); | ||
cy.get('.fd-nested-list__link') | ||
.contains('Webcomponent') | ||
.parent() | ||
.should('have.attr', 'title', 'Webcomponent tooltipText'); | ||
}); | ||
}); | ||
}); | ||
|
||
describe('Horizontal Tab Navigation', () => { | ||
context('Desktop', () => { | ||
it('Open horizontal navigation', () => { | ||
cy.get('.fd-shellbar') | ||
.contains('Projects') | ||
.click(); | ||
|
||
cy.get('.fd-app__sidebar') | ||
.contains('Horizontal Navigation Example') | ||
.click(); | ||
|
||
cy.expectPathToBe('/projects/tabNav'); | ||
|
||
cy.get('.fd-tabs') | ||
.contains('Node with node activation hook') | ||
.click(); | ||
cy.expectPathToBe('/projects/tabNav/on-node-activation'); | ||
|
||
cy.get('.fd-tabs') | ||
.contains('Settings') | ||
.click(); | ||
cy.get('.fd-menu__item') | ||
.contains('Project Settings') | ||
.click(); | ||
cy.expectPathToBe('/projects/tabNav/settings'); | ||
|
||
cy.get('.fd-tabs') | ||
.contains('More') | ||
.click(); | ||
|
||
cy.get('.fd-nested-list') | ||
.contains('Default Child node Example') | ||
.click(); | ||
|
||
cy.get('.fd-nested-list__item') | ||
.contains('First Child') | ||
.click(); | ||
cy.expectPathToBe('/projects/tabNav/dps1'); | ||
}); | ||
}); | ||
|
||
context('Mobile', () => { | ||
beforeEach(() => { | ||
cy.viewport('iphone-6'); | ||
}); | ||
it('Horizontal Navigation on mobile', () => { | ||
cy.get('[data-testid="mobile-menu"]').click(); | ||
cy.get('.fd-popover__body').within(() => { | ||
cy.get('[data-testid="projects_projects-mobile"]').click(); | ||
}); | ||
cy.get('.lui-burger').click(); | ||
cy.get('.fd-side-nav').contains('Horizontal Navigation Example'); | ||
cy.get('[data-testid="tabnav_horizontalnavigationexample"]').click(); | ||
cy.get('[data-testid="tabnav_horizontalnavigationexample"]').should('have.class', 'is-selected'); | ||
cy.get('.fd-tabs').contains('User Management'); | ||
cy.get('.fd-tabs__item') | ||
.contains('Node with node activation hook') | ||
.should('not.visible'); | ||
cy.get('.fd-tabs').contains('More'); | ||
}); | ||
|
||
it('Test activated node on moible with keep selected context', () => { | ||
cy.visit('/projects/tabNav/avengers/captain-america/super-power'); | ||
cy.get('.luigi__more').should('have.attr', 'aria-selected', 'true'); | ||
cy.get('.luigi__more').click(); | ||
cy.get('.fd-nested-list__title') | ||
.contains('Keep Selected Example') | ||
.parent() | ||
.should('have.attr', 'aria-selected', 'true'); | ||
}); | ||
|
||
it('recalc of tab nav by using resizing', () => { | ||
cy.visit('/projects/tabNav'); | ||
cy.get('.luigi-tabsContainer').within(() => { | ||
cy.get('.fd-tabs__item') | ||
.contains('User Management') | ||
.should('be.visible'); | ||
cy.get('.fd-tabs__item') | ||
.contains('Node with node activation hook') | ||
.should('not.visible'); | ||
cy.get('.fd-tabs__item') | ||
.contains('Settings') | ||
.should('not.visible'); | ||
}); | ||
cy.viewport(900, 750); | ||
cy.get('.luigi-tabsContainer').within(() => { | ||
cy.get('.fd-tabs__item') | ||
.contains('Settings') | ||
.should('be.visible'); | ||
cy.get('.fd-tabs__item') | ||
.contains('Settings') | ||
.click(); | ||
cy.get('.fd-popover') | ||
.contains('Project Settings') | ||
.click(); | ||
cy.expectPathToBe('/projects/tabNav/settings'); | ||
cy.get('.fd-tabs__item') | ||
.contains('Settings') | ||
.should('have.attr', 'aria-selected', 'true'); | ||
}); | ||
}); | ||
|
||
it('ResponsiveNavigation Semicollapsed', () => { | ||
cy.viewport(800, 600); | ||
cy.window().then(win => { | ||
const config = win.Luigi.getConfig(); | ||
config.settings.responsiveNavigation = 'semiCollapsible'; | ||
win.Luigi.configChanged('settings'); | ||
cy.get('[data-testid="mobile-menu"]').click(); | ||
|
||
cy.get('.fd-popover__body').within(() => { | ||
cy.get('[data-testid="projects_projects-mobile"]').click(); | ||
}); | ||
cy.get('.fd-side-nav').contains('Horizontal Navigation Example'); | ||
cy.get('[data-testid="tabnav_horizontalnavigationexample"]').click(); | ||
cy.get('.fd-tabs__item') | ||
.contains('Miscellaneous 2') | ||
.should('not.visible'); | ||
cy.get('[data-testid="semiCollapsibleButton"]').click(); | ||
cy.wait(1000); | ||
cy.get('.fd-tabs__item') | ||
.contains('Miscellaneous2') | ||
.should('be.visible'); | ||
}); | ||
}); | ||
}); | ||
}); | ||
|
||
describe('GlobalSearch', () => { | ||
context('Desktop', () => { | ||
it('GlobalSearch Desktop', () => { | ||
cy.get('.luigi-search__input').should('not.be.visible'); | ||
cy.get('[data-testid=luigi-search-btn-desktop]').click(); | ||
cy.get('.luigi-search__input').should('be.visible'); | ||
cy.get('.luigi-search__input').type('Luigi'); | ||
cy.get('[data-testid=luigi-search-btn-desktop]').click(); | ||
cy.get('.luigi-search__input').should('not.be.visible'); | ||
cy.get('[data-testid=luigi-search-btn-desktop]').click(); | ||
cy.get('.luigi-search__input').should('not.have.value', 'Luigi'); | ||
}); | ||
}); | ||
context('Mobile', () => { | ||
beforeEach(() => { | ||
cy.viewport('iphone-6'); | ||
}); | ||
it('GlobalSearch Mobile', () => { | ||
cy.get('.luigi-search-shell__mobile .luigi-search__input').should('not.be.visible'); | ||
cy.get('[data-testid=mobile-menu]').click(); | ||
cy.get('[data-testid=luigi-search-btn-mobile]').click(); | ||
cy.get('.luigi-search-shell__mobile .luigi-search__input').should('be.visible'); | ||
cy.get('.luigi-search-shell__mobile .luigi-search__input').type('Luigi'); | ||
|
||
cy.get('[data-testid=mobile-menu]').click(); | ||
cy.get('[data-testid=luigi-search-btn-mobile]').click(); | ||
cy.get('.luigi-search-shell__mobile .luigi-search__input').should('not.be.visible'); | ||
|
||
cy.get('[data-testid=mobile-menu]').click(); | ||
cy.get('[data-testid=luigi-search-btn-mobile]').click(); | ||
cy.get('.luigi-search-shell__mobile .luigi-search__input').should('not.have.value', 'Luigi'); | ||
}); | ||
}); | ||
}); | ||
|
||
describe('Global Navigation', () => { | ||
context('Desktop', () => { | ||
it('not render global side navigation when globalSideNavigation is false', () => { | ||
cy.window().then(win => { | ||
const config = win.Luigi.getConfig(); | ||
config.settings.globalSideNavigation = false; | ||
config.settings.experimental = { globalNav: true }; | ||
win.Luigi.configChanged(); | ||
|
||
cy.get('.lui-global-nav-visible').should('not.be.visible'); | ||
cy.get('.lui-globalnav .fd-side-nav').should('not.be.visible'); | ||
}); | ||
}); | ||
|
||
it('not render global side navigation when experimental globalNav is false', () => { | ||
cy.window().then(win => { | ||
const config = win.Luigi.getConfig(); | ||
config.settings.globalSideNavigation = true; | ||
config.settings.experimental = { globalNav: false }; | ||
win.Luigi.configChanged(); | ||
|
||
cy.get('.lui-global-nav-visible').should('not.be.visible'); | ||
cy.get('.lui-globalnav .fd-side-nav').should('not.be.visible'); | ||
}); | ||
}); | ||
|
||
it('render global side navigation', () => { | ||
cy.window().then(win => { | ||
const config = win.Luigi.getConfig(); | ||
config.settings.globalSideNavigation = true; | ||
config.settings.experimental = { globalNav: true }; | ||
win.Luigi.configChanged(); | ||
|
||
// render global nav tool bar | ||
cy.get('.lui-global-nav-visible').should('be.visible'); | ||
cy.get('.lui-globalnav .fd-side-nav__main-navigation .fd-nested-list') | ||
.should('be.visible') | ||
.children() | ||
.should('have.length', 2); | ||
|
||
// select global nav node | ||
cy.get('[data-testid="settings_settings"]') | ||
.should('exist') | ||
.not('.is-selected') | ||
.click(); | ||
|
||
// select global nav node again to wait for the rerendering of the element | ||
cy.get('[data-testid="settings_settings"]').should('have.class', 'is-selected'); | ||
|
||
cy.expectPathToBe('/settings'); | ||
}); | ||
}); | ||
}); | ||
context('Mobile', () => { | ||
beforeEach(() => { | ||
cy.viewport('iphone-6'); | ||
}); | ||
|
||
it('Responsive Global Side Navigation', () => { | ||
cy.viewport(800, 600); | ||
cy.window().then(win => { | ||
const config = win.Luigi.getConfig(); | ||
config.settings.globalSideNavigation = true; | ||
config.settings.experimental = { globalNav: true }; | ||
win.Luigi.configChanged(); | ||
|
||
cy.get('.lui-globalnav').should('be.visible'); | ||
cy.get('.lui-globalnav .fd-side-nav__main-navigation .fd-nested-list') | ||
.should('be.visible') | ||
.children() | ||
.should('have.length', 2); | ||
}); | ||
}); | ||
}); | ||
}); | ||
|
||
describe('Feature toggles', () => { | ||
it('Node visibility with feature toggles via url', () => { | ||
cy.window().then(win => { | ||
win.Luigi.navigation().navigate('/projects/pr1/settings_ft'); | ||
cy.expectPathToBe('/projects/pr1'); | ||
}); | ||
cy.window().then(win => { | ||
win.Luigi.navigation().navigate('/projects/pr1/settings_ft?ft=ft1'); | ||
cy.expectPathToBe('/projects/pr1/settings_ft'); | ||
}); | ||
cy.get('.fd-app__sidebar').should('contain', 'Project Settings 2'); | ||
cy.get('.fd-app__sidebar').should('not.contain', 'Project Settings 3'); | ||
cy.getIframeBody().then($iframeBody => { | ||
cy.wrap($iframeBody).should('contain', 'This is a feature toggle test and only visible if ft1 is active.'); | ||
}); | ||
}); | ||
|
||
it('Negate featuretoggle for node visibility', () => { | ||
cy.visit('/projects/pr1/settings_ft3?ft=ft2'); | ||
cy.get('.fd-app__sidebar').should('not.contain', 'Project Settings 2'); | ||
cy.get('.fd-app__sidebar').should('contain', 'Project Settings 3'); | ||
}); | ||
}); | ||
}); |
315 changes: 315 additions & 0 deletions
315
test/e2e-test-application/e2e/tests/1-angular/navigation-4.spec.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,315 @@ | ||
describe('Navigation', () => { | ||
beforeEach(() => { | ||
cy.visitLoggedIn('/'); | ||
}); | ||
|
||
describe('Collapsible Categories / Accordion', () => { | ||
it('It should have multiple categories collapsed', () => { | ||
cy.visit('/projects/pr2/collapsibles'); | ||
|
||
cy.get('li[data-testid="superusefulgithublinks"]>ul.fd-nested-list').should('not.be.visible'); | ||
cy.get('li[data-testid="usermanagement"]>ul.fd-nested-list').should('not.be.visible'); | ||
|
||
cy.get('li[data-testid="superusefulgithublinks"] a[title="Super useful Github links"]').click(); | ||
cy.get('li[data-testid="usermanagement"] a[title="User Management"]').click(); | ||
|
||
cy.get('li[data-testid="superusefulgithublinks"]>ul.fd-nested-list').should('be.visible'); | ||
cy.get('li[data-testid="usermanagement"]>ul.fd-nested-list').should('be.visible'); | ||
|
||
cy.get('li[data-testid="superusefulgithublinks"] a[title="Super useful Github links"]').click(); | ||
cy.get('li[data-testid="usermanagement"] a[title="User Management"]').click(); | ||
|
||
cy.get('li[data-testid="superusefulgithublinks"]>ul.fd-nested-list').should('not.be.visible'); | ||
cy.get('li[data-testid="usermanagement"]>ul.fd-nested-list').should('not.be.visible'); | ||
}); | ||
|
||
it('It should have a local side nav accordion mode', () => { | ||
cy.visit('/projects/pr2/sidenavaccordionmode'); | ||
|
||
// All is closed | ||
cy.get('li[data-testid="superusefulgithublinks"]>ul.fd-nested-list').should('not.be.visible'); | ||
cy.get('li[data-testid="usermanagement"]>ul.fd-nested-list').should('not.be.visible'); | ||
|
||
cy.get('li[data-testid="superusefulgithublinks"] a[title="Super useful Github links"]').click(); | ||
|
||
// First one is open only | ||
cy.get('li[data-testid="superusefulgithublinks"]>ul.fd-nested-list').should('be.visible'); | ||
cy.get('li[data-testid="usermanagement"]>ul.fd-nested-list').should('not.be.visible'); | ||
|
||
cy.get('li[data-testid="usermanagement"] a[title="User Management"]').click(); | ||
|
||
// Second one is open only | ||
cy.get('li[data-testid="superusefulgithublinks"]>ul.fd-nested-list').should('not.be.visible'); | ||
cy.get('li[data-testid="usermanagement"]>ul.fd-nested-list').should('be.visible'); | ||
|
||
cy.get('li[data-testid="usermanagement"] a[title="User Management"]').click(); | ||
|
||
// All is closed | ||
cy.get('li[data-testid="superusefulgithublinks"]>ul.fd-nested-list').should('not.be.visible'); | ||
cy.get('li[data-testid="usermanagement"]>ul.fd-nested-list').should('not.be.visible'); | ||
}); | ||
|
||
it('It should have a global side nav accordion mode', () => { | ||
cy.visit('/projects/pr2/collapsibles'); | ||
cy.window().then(win => { | ||
const config = win.Luigi.getConfig(); | ||
config.navigation.defaults = { | ||
sideNavAccordionMode: true | ||
}; | ||
win.Luigi.configChanged('settings.navigation'); | ||
// All is closed | ||
cy.get('li[data-testid="superusefulgithublinks"]>ul.fd-nested-list').should('not.be.visible'); | ||
cy.get('li[data-testid="usermanagement"]>ul.fd-nested-list').should('not.be.visible'); | ||
|
||
cy.get('li[data-testid="superusefulgithublinks"] a[title="Super useful Github links"]').click(); | ||
|
||
// First one is open only | ||
cy.get('li[data-testid="superusefulgithublinks"]>ul.fd-nested-list').should('be.visible'); | ||
cy.get('li[data-testid="usermanagement"]>ul.fd-nested-list').should('not.be.visible'); | ||
|
||
cy.get('li[data-testid="usermanagement"] a[title="User Management"]').click(); | ||
|
||
// Second one is open only | ||
cy.get('li[data-testid="superusefulgithublinks"]>ul.fd-nested-list').should('not.be.visible'); | ||
cy.get('li[data-testid="usermanagement"]>ul.fd-nested-list').should('be.visible'); | ||
|
||
cy.get('li[data-testid="usermanagement"] a[title="User Management"]').click(); | ||
|
||
// All is closed | ||
cy.get('li[data-testid="superusefulgithublinks"]>ul.fd-nested-list').should('not.be.visible'); | ||
cy.get('li[data-testid="usermanagement"]>ul.fd-nested-list').should('not.be.visible'); | ||
}); | ||
}); | ||
}); | ||
|
||
describe('Collapsible Categories / Accordion', () => { | ||
it('It should have multiple categories collapsed', () => { | ||
cy.visit('/projects/pr2/collapsibles'); | ||
|
||
cy.get('li[data-testid="superusefulgithublinks"]>ul.fd-nested-list').should('not.be.visible'); | ||
cy.get('li[data-testid="usermanagement"]>ul.fd-nested-list').should('not.be.visible'); | ||
|
||
cy.get('li[data-testid="superusefulgithublinks"] a[title="Super useful Github links"]').click(); | ||
cy.get('li[data-testid="usermanagement"] a[title="User Management"]').click(); | ||
|
||
cy.get('li[data-testid="superusefulgithublinks"]>ul.fd-nested-list').should('be.visible'); | ||
cy.get('li[data-testid="usermanagement"]>ul.fd-nested-list').should('be.visible'); | ||
|
||
cy.get('li[data-testid="superusefulgithublinks"] a[title="Super useful Github links"]').click(); | ||
cy.get('li[data-testid="usermanagement"] a[title="User Management"]').click(); | ||
|
||
cy.get('li[data-testid="superusefulgithublinks"]>ul.fd-nested-list').should('not.be.visible'); | ||
cy.get('li[data-testid="usermanagement"]>ul.fd-nested-list').should('not.be.visible'); | ||
}); | ||
|
||
it('It should have a local side nav accordion mode', () => { | ||
cy.visit('/projects/pr2/sidenavaccordionmode'); | ||
|
||
// All is closed | ||
cy.get('li[data-testid="superusefulgithublinks"]>ul.fd-nested-list').should('not.be.visible'); | ||
cy.get('li[data-testid="usermanagement"]>ul.fd-nested-list').should('not.be.visible'); | ||
|
||
cy.get('li[data-testid="superusefulgithublinks"] a[title="Super useful Github links"]').click(); | ||
|
||
// First one is open only | ||
cy.get('li[data-testid="superusefulgithublinks"]>ul.fd-nested-list').should('be.visible'); | ||
cy.get('li[data-testid="usermanagement"]>ul.fd-nested-list').should('not.be.visible'); | ||
|
||
cy.get('li[data-testid="usermanagement"] a[title="User Management"]').click(); | ||
|
||
// Second one is open only | ||
cy.get('li[data-testid="superusefulgithublinks"]>ul.fd-nested-list').should('not.be.visible'); | ||
cy.get('li[data-testid="usermanagement"]>ul.fd-nested-list').should('be.visible'); | ||
|
||
cy.get('li[data-testid="usermanagement"] a[title="User Management"]').click(); | ||
|
||
// All is closed | ||
cy.get('li[data-testid="superusefulgithublinks"]>ul.fd-nested-list').should('not.be.visible'); | ||
cy.get('li[data-testid="usermanagement"]>ul.fd-nested-list').should('not.be.visible'); | ||
}); | ||
|
||
it('It should have a global side nav accordion mode', () => { | ||
cy.visit('/projects/pr2/collapsibles'); | ||
cy.window().then(win => { | ||
const config = win.Luigi.getConfig(); | ||
config.navigation.defaults = { | ||
sideNavAccordionMode: true | ||
}; | ||
win.Luigi.configChanged('settings.navigation'); | ||
// All is closed | ||
cy.get('li[data-testid="superusefulgithublinks"]>ul.fd-nested-list').should('not.be.visible'); | ||
cy.get('li[data-testid="usermanagement"]>ul.fd-nested-list').should('not.be.visible'); | ||
|
||
cy.get('li[data-testid="superusefulgithublinks"] a[title="Super useful Github links"]').click(); | ||
|
||
// First one is open only | ||
cy.get('li[data-testid="superusefulgithublinks"]>ul.fd-nested-list').should('be.visible'); | ||
cy.get('li[data-testid="usermanagement"]>ul.fd-nested-list').should('not.be.visible'); | ||
|
||
cy.get('li[data-testid="usermanagement"] a[title="User Management"]').click(); | ||
|
||
// Second one is open only | ||
cy.get('li[data-testid="superusefulgithublinks"]>ul.fd-nested-list').should('not.be.visible'); | ||
cy.get('li[data-testid="usermanagement"]>ul.fd-nested-list').should('be.visible'); | ||
|
||
cy.get('li[data-testid="usermanagement"] a[title="User Management"]').click(); | ||
|
||
// All is closed | ||
cy.get('li[data-testid="superusefulgithublinks"]>ul.fd-nested-list').should('not.be.visible'); | ||
cy.get('li[data-testid="usermanagement"]>ul.fd-nested-list').should('not.be.visible'); | ||
}); | ||
}); | ||
}); | ||
|
||
describe('Link withoutSync/withSync', () => { | ||
beforeEach(() => { | ||
cy.visitLoggedIn('/projects/pr2'); | ||
}); | ||
|
||
it('withoutSync -> it should remain on the current page, highlight tree menu and remain in same page', () => { | ||
cy.expectPathToBe('/projects/pr2'); | ||
cy.getIframeBody().then(result => { | ||
// Link on Main page PR2 exist | ||
cy.wrap(result).contains(' with params: project to global settings and back'); | ||
|
||
// checking if we have NOT highlighted menu item | ||
cy.get('a[href="/projects/pr2/virtual-tree"]') | ||
.should('exist') | ||
.not('.is-selected'); | ||
|
||
// CLICK ON navigate-withoutSync-virtual-tree | ||
// linkManager().withoutSync().navigate('/projects/pr2/virtual-tree') | ||
cy.wrap(result) | ||
.find('a[data-testid="navigate-withoutSync-virtual-tree"]') | ||
.click(); | ||
|
||
// Url should changed in the main window | ||
cy.expectPathToBe('/projects/pr2/virtual-tree'); | ||
// Click link is still here (we haven't changed page) | ||
cy.wrap(result).find('a[data-testid="navigate-withoutSync-virtual-tree"]'); | ||
// checking if we have highlighted menu item | ||
cy.get('a[href="/projects/pr2/virtual-tree"]') | ||
.should('exist') | ||
.should('have.class', 'is-selected'); | ||
|
||
// checking if we have NOT highlighted menu item | ||
cy.get('a[href="/projects/pr2/settings"]') | ||
.should('exist') | ||
.not('.is-selected'); | ||
|
||
// CLICK ON navigate-withoutSync-virtual-tree | ||
// linkManager().withoutSync().navigate('/projects/pr2/virtual-tree') | ||
cy.wrap(result) | ||
.find('a[data-testid="navigate-withoutSync-settings"]') | ||
.click(); | ||
|
||
// Url should changed in the main window | ||
cy.expectPathToBe('/projects/pr2/settings'); | ||
// Click link is still here (we haven't changed page) | ||
cy.wrap(result).find('a[data-testid="navigate-withoutSync-virtual-tree"]'); | ||
// checking if we have highlighted menu item | ||
cy.get('a[href="/projects/pr2/settings"]') | ||
.should('exist') | ||
.should('have.class', 'is-selected'); | ||
}); | ||
}); | ||
|
||
it('withSync -> it should change page', () => { | ||
cy.expectPathToBe('/projects/pr2'); | ||
cy.getIframeBody().then(result => { | ||
// Link on Main page PR2 exist | ||
cy.wrap(result).contains(' with params: project to global settings and back'); | ||
|
||
// checking if we have NOT highlighted menu item | ||
cy.get('a[href="/projects/pr2/virtual-tree"]') | ||
.should('exist') | ||
.not('.is-selected'); | ||
|
||
// CLICK ON navigate-withoutSync-virtual-tree | ||
// linkManager().withoutSync().navigate('/projects/pr2/virtual-tree') | ||
cy.wrap(result) | ||
.find('a[data-testid="navigate-withSync-virtual-tree"]') | ||
.click(); | ||
|
||
// Url should changed in the main window | ||
cy.expectPathToBe('/projects/pr2/virtual-tree'); | ||
|
||
// Check we have changed page | ||
cy.wrap(result) | ||
.contains(' with params: project to global settings and back') | ||
.should('not.exist'); | ||
// checking if we have highlighted menu item | ||
cy.get('a[href="/projects/pr2/virtual-tree"]') | ||
.should('exist') | ||
.should('have.class', 'is-selected'); | ||
|
||
cy.wrap(result).contains('Add Segments To The Url content'); | ||
}); | ||
}); | ||
}); | ||
|
||
describe('ProfileMenu Fiori 3 Style', () => { | ||
context('Desktop', () => { | ||
it('not render Fiori3 profile in Shellbar when profileType is equal "simple"', () => { | ||
cy.window().then(win => { | ||
const config = win.Luigi.getConfig(); | ||
config.settings.profileType = 'simple'; | ||
win.Luigi.configChanged(); | ||
|
||
cy.get('[data-testid="luigi-topnav-profile-btn"]') | ||
.should('exist') | ||
.click(); | ||
cy.get('.lui-user-menu-fiori').should('not.be.visible'); | ||
cy.get('.lui-profile-simple-menu').should('be.visible'); | ||
}); | ||
}); | ||
|
||
it('not render Fiori3 profile in Shellbar when experimental is equal false', () => { | ||
cy.window().then(win => { | ||
const config = win.Luigi.getConfig(); | ||
config.settings.profileType = 'Fiori3'; | ||
config.settings.experimental = { profileMenuFiori3: false }; | ||
win.Luigi.configChanged(); | ||
|
||
cy.get('[data-testid="luigi-topnav-profile-btn"]') | ||
.should('exist') | ||
.click(); | ||
cy.get('.lui-user-menu-fiori').should('not.be.visible'); | ||
cy.get('.lui-profile-simple-menu').should('be.visible'); | ||
}); | ||
}); | ||
|
||
it('should render Fiori3 profile in Shellbar when profileType is equal "Fiori3"', () => { | ||
cy.window().then(win => { | ||
const config = win.Luigi.getConfig(); | ||
config.settings.profileType = 'Fiori3'; | ||
config.settings.experimental = { profileMenuFiori3: true }; | ||
win.Luigi.configChanged(); | ||
cy.wait(1000); | ||
|
||
cy.get('[data-testid="luigi-topnav-profile-btn"]').should('exist'); | ||
cy.get('[data-testid="luigi-topnav-profile-btn"]').click(); | ||
cy.get('.lui-user-menu-fiori').should('be.visible'); | ||
cy.get('.lui-profile-simple-menu').should('not.be.visible'); | ||
}); | ||
}); | ||
|
||
it('should have User Description and Avatar when Fiori3 Profile Menu is enabled', () => { | ||
cy.window().then(win => { | ||
const config = win.Luigi.getConfig(); | ||
config.settings.profileType = 'Fiori3'; | ||
config.settings.experimental = { profileMenuFiori3: true }; | ||
win.Luigi.configChanged(); | ||
|
||
cy.wait(1000); | ||
|
||
cy.get('[data-testid="luigi-topnav-profile-btn"]').should('exist'); | ||
cy.get('[data-testid="luigi-topnav-profile-btn"]').click(); | ||
cy.get('[data-testid="luigi-topnav-profile-avatar"]').should('exist'); | ||
cy.get('[data-testid="luigi-topnav-profile-initials"]').should('not.exist'); | ||
cy.get('[data-testid="luigi-topnav-profile-icon"]').should('not.exist'); | ||
}); | ||
}); | ||
}); | ||
}); | ||
}); |
845 changes: 0 additions & 845 deletions
845
test/e2e-test-application/e2e/tests/1-angular/navigation.spec.js
Large diffs are not rendered by default.
Oops, something went wrong.