diff options
Diffstat (limited to 'cypress/e2e/theming')
-rw-r--r-- | cypress/e2e/theming/a11y-color-contrast.cy.ts | 6 | ||||
-rw-r--r-- | cypress/e2e/theming/admin-settings.cy.ts | 21 | ||||
-rw-r--r-- | cypress/e2e/theming/admin-settings_default-app.cy.ts | 91 | ||||
-rw-r--r-- | cypress/e2e/theming/admin-settings_urls.cy.ts | 143 | ||||
-rw-r--r-- | cypress/e2e/theming/themingUtils.ts | 2 | ||||
-rw-r--r-- | cypress/e2e/theming/user-settings_app-order.cy.ts (renamed from cypress/e2e/theming/navigation-bar-settings.cy.ts) | 207 | ||||
-rw-r--r-- | cypress/e2e/theming/user-settings_background.cy.ts (renamed from cypress/e2e/theming/user-background.cy.ts) | 29 |
7 files changed, 343 insertions, 156 deletions
diff --git a/cypress/e2e/theming/a11y-color-contrast.cy.ts b/cypress/e2e/theming/a11y-color-contrast.cy.ts index 9d3ca2657fb..bff7df28e8e 100644 --- a/cypress/e2e/theming/a11y-color-contrast.cy.ts +++ b/cypress/e2e/theming/a11y-color-contrast.cy.ts @@ -110,7 +110,7 @@ describe('Accessibility of Nextcloud theming colors', () => { before(() => { cy.createRandomUser().then(($user) => { // set user theme - cy.runOccCommand(`user:setting -- '${$user.userId}' theming enabled-themes '["${theme}"]'`) + cy.runOccCommand(`user:setting -- '${$user.userId}' theming enabled-themes '[\\"${theme}\\"]'`) cy.login($user) cy.visit('/') cy.injectAxe({ axeCorePath: 'node_modules/axe-core/axe.min.js' }) @@ -122,7 +122,7 @@ describe('Accessibility of Nextcloud theming colors', () => { // Unset background image and thus use background-color for testing blur background (images do not work with axe-core) doc.body.style.backgroundImage = 'unset' - const root = doc.querySelector('main') + const root = doc.querySelector('#content') if (root === null) { throw new Error('No test root found') } @@ -137,7 +137,7 @@ describe('Accessibility of Nextcloud theming colors', () => { it(`color contrast of ${foreground} on ${background}`, () => { cy.document().then(doc => { const element = createTestCase(foreground, background) - const root = doc.querySelector('main') + const root = doc.querySelector('#content') // eslint-disable-next-line no-unused-expressions expect(root).not.to.be.undefined // eslint-disable-next-line @typescript-eslint/no-non-null-assertion diff --git a/cypress/e2e/theming/admin-settings.cy.ts b/cypress/e2e/theming/admin-settings.cy.ts index 26bc6d26611..4207b98f711 100644 --- a/cypress/e2e/theming/admin-settings.cy.ts +++ b/cypress/e2e/theming/admin-settings.cy.ts @@ -13,6 +13,7 @@ import { validateUserThemingDefaultCss, expectBackgroundColor, } from './themingUtils' +import { NavigationHeader } from '../../pages/NavigationHeader' const admin = new User('admin', 'admin') @@ -225,6 +226,7 @@ describe('Remove the default background with a custom background color', functio }) describe('Remove the default background with a bright color', function() { + const navigationHeader = new NavigationHeader() let selectedColor = '' before(function() { @@ -271,15 +273,16 @@ describe('Remove the default background with a bright color', function() { it('See the header being inverted', function() { cy.waitUntil(() => - cy.window().then((win) => { - const firstEntry = win.document.querySelector( - '.app-menu-main li img', - ) - if (!firstEntry) { - return false - } - return getComputedStyle(firstEntry).filter === 'invert(1)' - }), + navigationHeader + .getNavigationEntries() + .find('img') + .then((el) => { + let ret = true + el.each(function() { + ret = ret && window.getComputedStyle(this).filter === 'invert(1)' + }) + return ret + }) ) }) }) diff --git a/cypress/e2e/theming/admin-settings_default-app.cy.ts b/cypress/e2e/theming/admin-settings_default-app.cy.ts new file mode 100644 index 00000000000..702f737bc15 --- /dev/null +++ b/cypress/e2e/theming/admin-settings_default-app.cy.ts @@ -0,0 +1,91 @@ +/** + * SPDX-FileCopyrightText: 2023 Nextcloud GmbH and Nextcloud contributors + * SPDX-License-Identifier: AGPL-3.0-or-later + */ + +import { User } from '@nextcloud/cypress' +import { NavigationHeader } from '../../pages/NavigationHeader' + +const admin = new User('admin', 'admin') + +describe('Admin theming set default apps', () => { + const navigationHeader = new NavigationHeader() + + before(function() { + // Just in case previous test failed + cy.resetAdminTheming() + cy.login(admin) + }) + + it('See the current default app is the dashboard', () => { + // check default route + cy.visit('/') + cy.url().should('match', /apps\/dashboard/) + + // Also check the top logo link + navigationHeader.logo().click() + cy.url().should('match', /apps\/dashboard/) + }) + + it('See the default app settings', () => { + cy.visit('/settings/admin/theming') + + cy.get('.settings-section').contains('Navigation bar settings').should('exist') + cy.get('[data-cy-switch-default-app]').should('exist') + cy.get('[data-cy-switch-default-app]').scrollIntoView() + }) + + it('Toggle the "use custom default app" switch', () => { + cy.get('[data-cy-switch-default-app] input').should('not.be.checked') + cy.get('[data-cy-switch-default-app] .checkbox-content').click() + cy.get('[data-cy-switch-default-app] input').should('be.checked') + }) + + it('See the default app order selector', () => { + cy.get('[data-cy-app-order] [data-cy-app-order-element]').then(elements => { + const appIDs = elements.map((idx, el) => el.getAttribute('data-cy-app-order-element')).get() + expect(appIDs).to.deep.eq(['dashboard', 'files']) + }) + }) + + it('Change the default app', () => { + cy.get('[data-cy-app-order] [data-cy-app-order-element="files"]').scrollIntoView() + + cy.get('[data-cy-app-order] [data-cy-app-order-element="files"] [data-cy-app-order-button="up"]').should('be.visible') + cy.get('[data-cy-app-order] [data-cy-app-order-element="files"] [data-cy-app-order-button="up"]').click() + cy.get('[data-cy-app-order] [data-cy-app-order-element="files"] [data-cy-app-order-button="up"]').should('not.be.visible') + + }) + + it('See the default app is changed', () => { + cy.get('[data-cy-app-order] [data-cy-app-order-element]').then(elements => { + const appIDs = elements.map((idx, el) => el.getAttribute('data-cy-app-order-element')).get() + expect(appIDs).to.deep.eq(['files', 'dashboard']) + }) + + // Check the redirect to the default app works + cy.request({ url: '/', followRedirect: false }).then((response) => { + expect(response.status).to.eq(302) + expect(response).to.have.property('headers') + expect(response.headers.location).to.contain('/apps/files') + }) + }) + + it('Toggle the "use custom default app" switch back to reset the default apps', () => { + cy.visit('/settings/admin/theming') + cy.get('[data-cy-switch-default-app]').scrollIntoView() + + cy.get('[data-cy-switch-default-app] input').should('be.checked') + cy.get('[data-cy-switch-default-app] .checkbox-content').click() + cy.get('[data-cy-switch-default-app] input').should('be.not.checked') + }) + + it('See the default app is changed back to default', () => { + // Check the redirect to the default app works + cy.request({ url: '/', followRedirect: false }).then((response) => { + expect(response.status).to.eq(302) + expect(response).to.have.property('headers') + expect(response.headers.location).to.contain('/apps/dashboard') + }) + }) +}) diff --git a/cypress/e2e/theming/admin-settings_urls.cy.ts b/cypress/e2e/theming/admin-settings_urls.cy.ts new file mode 100644 index 00000000000..46bae7901c4 --- /dev/null +++ b/cypress/e2e/theming/admin-settings_urls.cy.ts @@ -0,0 +1,143 @@ +/*! + * SPDX-FileCopyrightText: 2025 Nextcloud GmbH and Nextcloud contributors + * SPDX-License-Identifier: AGPL-3.0-or-later + */ +import { User } from '@nextcloud/cypress' + +const admin = new User('admin', 'admin') + +describe('Admin theming: Setting custom project URLs', function() { + this.beforeEach(() => { + // Just in case previous test failed + cy.resetAdminTheming() + cy.login(admin) + cy.visit('/settings/admin/theming') + cy.intercept('POST', '**/apps/theming/ajax/updateStylesheet').as('updateTheming') + }) + + it('Setting the web link', () => { + cy.findByRole('textbox', { name: /web link/i }) + .and('have.attr', 'type', 'url') + .as('input') + .scrollIntoView() + cy.get('@input') + .should('be.visible') + .type('{selectAll}http://example.com/path?query#fragment{enter}') + + cy.wait('@updateTheming') + + cy.logout() + + cy.visit('/') + cy.contains('a', 'Nextcloud') + .should('be.visible') + .and('have.attr', 'href', 'http://example.com/path?query#fragment') + }) + + it('Setting the legal notice link', () => { + cy.findByRole('textbox', { name: /legal notice link/i }) + .should('exist') + .and('have.attr', 'type', 'url') + .as('input') + .scrollIntoView() + cy.get('@input') + .type('http://example.com/path?query#fragment{enter}') + + cy.wait('@updateTheming') + + cy.logout() + + cy.visit('/') + cy.contains('a', /legal notice/i) + .should('be.visible') + .and('have.attr', 'href', 'http://example.com/path?query#fragment') + }) + + it('Setting the privacy policy link', () => { + cy.findByRole('textbox', { name: /privacy policy link/i }) + .should('exist') + .as('input') + .scrollIntoView() + cy.get('@input') + .should('have.attr', 'type', 'url') + .type('http://privacy.local/path?query#fragment{enter}') + + cy.wait('@updateTheming') + + cy.logout() + + cy.visit('/') + cy.contains('a', /privacy policy/i) + .should('be.visible') + .and('have.attr', 'href', 'http://privacy.local/path?query#fragment') + }) + +}) + +describe('Admin theming: Web link corner cases', function() { + this.beforeEach(() => { + // Just in case previous test failed + cy.resetAdminTheming() + cy.login(admin) + cy.visit('/settings/admin/theming') + cy.intercept('POST', '**/apps/theming/ajax/updateStylesheet').as('updateTheming') + }) + + it('Already URL encoded', () => { + cy.findByRole('textbox', { name: /web link/i }) + .and('have.attr', 'type', 'url') + .as('input') + .scrollIntoView() + cy.get('@input') + .should('be.visible') + .type('{selectAll}http://example.com/%22path%20with%20space%22{enter}') + + cy.wait('@updateTheming') + + cy.logout() + + cy.visit('/') + cy.contains('a', 'Nextcloud') + .should('be.visible') + .and('have.attr', 'href', 'http://example.com/%22path%20with%20space%22') + }) + + it('URL with double quotes', () => { + cy.findByRole('textbox', { name: /web link/i }) + .and('have.attr', 'type', 'url') + .as('input') + .scrollIntoView() + cy.get('@input') + .should('be.visible') + .type('{selectAll}http://example.com/"path"{enter}') + + cy.wait('@updateTheming') + + cy.logout() + + cy.visit('/') + cy.contains('a', 'Nextcloud') + .should('be.visible') + .and('have.attr', 'href', 'http://example.com/%22path%22') + }) + + it('URL with double quotes and already encoded', () => { + cy.findByRole('textbox', { name: /web link/i }) + .and('have.attr', 'type', 'url') + .as('input') + .scrollIntoView() + cy.get('@input') + .should('be.visible') + .type('{selectAll}http://example.com/"the%20path"{enter}') + + cy.wait('@updateTheming') + + cy.logout() + + cy.visit('/') + cy.contains('a', 'Nextcloud') + .should('be.visible') + .and('have.attr', 'href', 'http://example.com/%22the%20path%22') + }) + +}) diff --git a/cypress/e2e/theming/themingUtils.ts b/cypress/e2e/theming/themingUtils.ts index 370aaef67f8..b4740beda1c 100644 --- a/cypress/e2e/theming/themingUtils.ts +++ b/cypress/e2e/theming/themingUtils.ts @@ -5,7 +5,7 @@ import { colord } from 'colord' export const defaultPrimary = '#00679e' -export const defaultBackground = 'kamil-porembinski-clouds.jpg' +export const defaultBackground = 'jenna-kim-the-globe.webp' /** * Check if a CSS variable is set to a specific color diff --git a/cypress/e2e/theming/navigation-bar-settings.cy.ts b/cypress/e2e/theming/user-settings_app-order.cy.ts index fea72d454b0..11ef2f45382 100644 --- a/cypress/e2e/theming/navigation-bar-settings.cy.ts +++ b/cypress/e2e/theming/user-settings_app-order.cy.ts @@ -5,89 +5,19 @@ import { User } from '@nextcloud/cypress' import { installTestApp, uninstallTestApp } from '../../support/commonUtils' +import { NavigationHeader } from '../../pages/NavigationHeader' -const admin = new User('admin', 'admin') - -describe('Admin theming set default apps', () => { - before(function() { - // Just in case previous test failed - cy.resetAdminTheming() - cy.login(admin) - }) - - it('See the current default app is the dashboard', () => { - cy.visit('/') - cy.url().should('match', /apps\/dashboard/) - - // Also check the top logo link - cy.get('#nextcloud').click() - cy.url().should('match', /apps\/dashboard/) - }) - - it('See the default app settings', () => { - cy.visit('/settings/admin/theming') - - cy.get('.settings-section').contains('Navigation bar settings').should('exist') - cy.get('[data-cy-switch-default-app]').should('exist') - cy.get('[data-cy-switch-default-app]').scrollIntoView() - }) - - it('Toggle the "use custom default app" switch', () => { - cy.get('[data-cy-switch-default-app] input').should('not.be.checked') - cy.get('[data-cy-switch-default-app] .checkbox-content').click() - cy.get('[data-cy-switch-default-app] input').should('be.checked') - }) - - it('See the default app order selector', () => { - cy.get('[data-cy-app-order] [data-cy-app-order-element]').then(elements => { - const appIDs = elements.map((idx, el) => el.getAttribute('data-cy-app-order-element')).get() - expect(appIDs).to.deep.eq(['dashboard', 'files']) - }) - }) - - it('Change the default app', () => { - cy.get('[data-cy-app-order] [data-cy-app-order-element="files"]').scrollIntoView() - - cy.get('[data-cy-app-order] [data-cy-app-order-element="files"] [data-cy-app-order-button="up"]').should('be.visible') - cy.get('[data-cy-app-order] [data-cy-app-order-element="files"] [data-cy-app-order-button="up"]').click() - cy.get('[data-cy-app-order] [data-cy-app-order-element="files"] [data-cy-app-order-button="up"]').should('not.be.visible') - - }) - - it('See the default app is changed', () => { - cy.get('[data-cy-app-order] [data-cy-app-order-element]').then(elements => { - const appIDs = elements.map((idx, el) => el.getAttribute('data-cy-app-order-element')).get() - expect(appIDs).to.deep.eq(['files', 'dashboard']) - }) - - // Check the redirect to the default app works - cy.request({ url: '/', followRedirect: false }).then((response) => { - expect(response.status).to.eq(302) - expect(response).to.have.property('headers') - expect(response.headers.location).to.contain('/apps/files') - }) - }) - - it('Toggle the "use custom default app" switch back to reset the default apps', () => { - cy.visit('/settings/admin/theming') - cy.get('[data-cy-switch-default-app]').scrollIntoView() - - cy.get('[data-cy-switch-default-app] input').should('be.checked') - cy.get('[data-cy-switch-default-app] .checkbox-content').click() - cy.get('[data-cy-switch-default-app] input').should('be.not.checked') - }) +/** + * Intercept setting the app order as `updateAppOrder` + */ +function interceptAppOrder() { + cy.intercept('POST', '/ocs/v2.php/apps/provisioning_api/api/v1/config/users/core/apporder').as('updateAppOrder') +} - it('See the default app is changed back to default', () => { - // Check the redirect to the default app works - cy.request({ url: '/', followRedirect: false }).then((response) => { - expect(response.status).to.eq(302) - expect(response).to.have.property('headers') - expect(response.headers.location).to.contain('/apps/dashboard') - }) - }) -}) +before(() => uninstallTestApp()) describe('User theming set app order', () => { + const navigationHeader = new NavigationHeader() let user: User before(() => { @@ -109,40 +39,43 @@ describe('User theming set app order', () => { }) it('See that the dashboard app is the first one', () => { + const appOrder = ['Dashboard', 'Files'] // Check the app order settings UI - cy.get('[data-cy-app-order] [data-cy-app-order-element]').then(elements => { - const appIDs = elements.map((idx, el) => el.getAttribute('data-cy-app-order-element')).get() - expect(appIDs).to.deep.eq(['dashboard', 'files']) - }) + cy.get('[data-cy-app-order] [data-cy-app-order-element]') + .each((element, index) => expect(element).to.contain.text(appOrder[index])) // Check the top app menu order - cy.get('.app-menu-main .app-menu-entry').then(elements => { - const appIDs = elements.map((idx, el) => el.getAttribute('data-app-id')).get() - expect(appIDs).to.deep.eq(['dashboard', 'files']) - }) + navigationHeader.getNavigationEntries() + .each((entry, index) => expect(entry).contain.text(appOrder[index])) }) it('Change the app order', () => { + interceptAppOrder() cy.get('[data-cy-app-order] [data-cy-app-order-element="files"] [data-cy-app-order-button="up"]').should('be.visible') cy.get('[data-cy-app-order] [data-cy-app-order-element="files"] [data-cy-app-order-button="up"]').click() cy.get('[data-cy-app-order] [data-cy-app-order-element="files"] [data-cy-app-order-button="up"]').should('not.be.visible') + cy.wait('@updateAppOrder') - cy.get('[data-cy-app-order] [data-cy-app-order-element]').then(elements => { - const appIDs = elements.map((idx, el) => el.getAttribute('data-cy-app-order-element')).get() - expect(appIDs).to.deep.eq(['files', 'dashboard']) - }) + const appOrder = ['Files', 'Dashboard'] + cy.get('[data-cy-app-order] [data-cy-app-order-element]') + .each((element, index) => expect(element).to.contain.text(appOrder[index])) }) it('See the app menu order is changed', () => { cy.reload() - cy.get('.app-menu-main .app-menu-entry').then(elements => { - const appIDs = elements.map((idx, el) => el.getAttribute('data-app-id')).get() - expect(appIDs).to.deep.eq(['files', 'dashboard']) - }) + const appOrder = ['Files', 'Dashboard'] + // Check the app order settings UI + cy.get('[data-cy-app-order] [data-cy-app-order-element]') + .each((element, index) => expect(element).to.contain.text(appOrder[index])) + + // Check the top app menu order + navigationHeader.getNavigationEntries() + .each((entry, index) => expect(entry).contain.text(appOrder[index])) }) }) describe('User theming set app order with default app', () => { + const navigationHeader = new NavigationHeader() let user: User before(() => { @@ -150,7 +83,7 @@ describe('User theming set app order with default app', () => { // install a third app installTestApp() // set files as default app - cy.runOccCommand('config:system:set --value "files" defaultapp') + cy.runOccCommand('config:system:set --value \'files\' defaultapp') // Create random user for this test cy.createRandomUser().then(($user) => { @@ -176,11 +109,11 @@ describe('User theming set app order with default app', () => { it('See the app order settings: files is the first one', () => { cy.visit('/settings/user/theming') cy.get('[data-cy-app-order]').scrollIntoView() - cy.get('[data-cy-app-order] [data-cy-app-order-element]').then(elements => { - expect(elements).to.have.length(4) - const appIDs = elements.map((idx, el) => el.getAttribute('data-cy-app-order-element')).get() - expect(appIDs).to.deep.eq(['files', 'dashboard', 'testapp1', 'testapp']) - }) + + const appOrder = ['Files', 'Dashboard', 'Test App 2', 'Test App'] + // Check the app order settings UI + cy.get('[data-cy-app-order] [data-cy-app-order-element]') + .each((element, index) => expect(element).to.contain.text(appOrder[index])) }) it('Can not change the default app', () => { @@ -195,32 +128,31 @@ describe('User theming set app order with default app', () => { }) it('Change the order of the other apps', () => { - cy.intercept('POST', '**/apps/provisioning_api/api/v1/config/users/core/apporder').as('setAppOrder') + interceptAppOrder() // Move the testapp up twice, it should be the first one after files cy.get('[data-cy-app-order] [data-cy-app-order-element="testapp"] [data-cy-app-order-button="up"]').click() - cy.wait('@setAppOrder') + cy.wait('@updateAppOrder') cy.get('[data-cy-app-order] [data-cy-app-order-element="testapp"] [data-cy-app-order-button="up"]').click() - cy.wait('@setAppOrder') + cy.wait('@updateAppOrder') // Can't get up anymore, files is enforced as default app cy.get('[data-cy-app-order] [data-cy-app-order-element="testapp"] [data-cy-app-order-button="up"]').should('not.be.visible') // Check the final list order - cy.get('[data-cy-app-order] [data-cy-app-order-element]').then(elements => { - expect(elements).to.have.length(4) - const appIDs = elements.map((idx, el) => el.getAttribute('data-cy-app-order-element')).get() - expect(appIDs).to.deep.eq(['files', 'testapp', 'dashboard', 'testapp1']) - }) + const appOrder = ['Files', 'Test App', 'Dashboard', 'Test App 2'] + // Check the app order settings UI + cy.get('[data-cy-app-order] [data-cy-app-order-element]') + .each((element, index) => expect(element).to.contain.text(appOrder[index])) }) it('See the app menu order is changed', () => { cy.reload() - cy.get('.app-menu-main .app-menu-entry').then(elements => { - expect(elements).to.have.length(4) - const appIDs = elements.map((idx, el) => el.getAttribute('data-app-id')).get() - expect(appIDs).to.deep.eq(['files', 'testapp', 'dashboard', 'testapp1']) - }) + + const appOrder = ['Files', 'Test App', 'Dashboard', 'Test App 2'] + // Check the top app menu order + navigationHeader.getNavigationEntries() + .each((entry, index) => expect(entry).contain.text(appOrder[index])) }) }) @@ -247,8 +179,10 @@ describe('User theming app order list accessibility', () => { }) it('click the first button', () => { + interceptAppOrder() cy.get('[data-cy-app-order] [data-cy-app-order-element="dashboard"] [data-cy-app-order-button="down"]').should('be.visible').focus() cy.get('[data-cy-app-order] [data-cy-app-order-element="dashboard"] [data-cy-app-order-button="down"]').click() + cy.wait('@updateAppOrder') }) it('see the same app kept the focus', () => { @@ -259,8 +193,10 @@ describe('User theming app order list accessibility', () => { }) it('click the last button', () => { + interceptAppOrder() cy.get('[data-cy-app-order] [data-cy-app-order-element="dashboard"] [data-cy-app-order-button="up"]').should('be.visible').focus() cy.get('[data-cy-app-order] [data-cy-app-order-element="dashboard"] [data-cy-app-order-button="up"]').click() + cy.wait('@updateAppOrder') }) it('see the same app kept the focus', () => { @@ -272,6 +208,7 @@ describe('User theming app order list accessibility', () => { }) describe('User theming reset app order', () => { + const navigationHeader = new NavigationHeader() let user: User before(() => { @@ -293,17 +230,14 @@ describe('User theming reset app order', () => { }) it('See that the dashboard app is the first one', () => { + const appOrder = ['Dashboard', 'Files'] // Check the app order settings UI - cy.get('[data-cy-app-order] [data-cy-app-order-element]').then(elements => { - const appIDs = elements.map((idx, el) => el.getAttribute('data-cy-app-order-element')).get() - expect(appIDs).to.deep.eq(['dashboard', 'files']) - }) + cy.get('[data-cy-app-order] [data-cy-app-order-element]') + .each((element, index) => expect(element).to.contain.text(appOrder[index])) // Check the top app menu order - cy.get('.app-menu-main .app-menu-entry').then(elements => { - const appIDs = elements.map((idx, el) => el.getAttribute('data-app-id')).get() - expect(appIDs).to.deep.eq(['dashboard', 'files']) - }) + navigationHeader.getNavigationEntries() + .each((entry, index) => expect(entry).contain.text(appOrder[index])) }) it('See the reset button is disabled', () => { @@ -312,15 +246,17 @@ describe('User theming reset app order', () => { }) it('Change the app order', () => { + interceptAppOrder() cy.get('[data-cy-app-order] [data-cy-app-order-element="files"] [data-cy-app-order-button="up"]').should('be.visible') cy.get('[data-cy-app-order] [data-cy-app-order-element="files"] [data-cy-app-order-button="up"]').click() cy.get('[data-cy-app-order] [data-cy-app-order-element="files"] [data-cy-app-order-button="up"]').should('not.be.visible') + cy.wait('@updateAppOrder') // Check the app order settings UI - cy.get('[data-cy-app-order] [data-cy-app-order-element]').then(elements => { - const appIDs = elements.map((idx, el) => el.getAttribute('data-cy-app-order-element')).get() - expect(appIDs).to.deep.eq(['files', 'dashboard']) - }) + const appOrder = ['Files', 'Dashboard'] + // Check the app order settings UI + cy.get('[data-cy-app-order] [data-cy-app-order-element]') + .each((element, index) => expect(element).to.contain.text(appOrder[index])) }) it('See the reset button is no longer disabled', () => { @@ -329,14 +265,25 @@ describe('User theming reset app order', () => { }) it('Reset the app order', () => { + cy.intercept('GET', '/ocs/v2.php/core/navigation/apps').as('loadApps') + interceptAppOrder() cy.get('[data-test-id="btn-apporder-reset"]').click({ force: true }) + + cy.wait('@updateAppOrder') + .its('request.body') + .should('have.property', 'configValue', '[]') + cy.wait('@loadApps') }) it('See the app order is restored', () => { - cy.get('[data-cy-app-order] [data-cy-app-order-element]').then(elements => { - const appIDs = elements.map((idx, el) => el.getAttribute('data-cy-app-order-element')).get() - expect(appIDs).to.deep.eq(['dashboard', 'files']) - }) + const appOrder = ['Dashboard', 'Files'] + // Check the app order settings UI + cy.get('[data-cy-app-order] [data-cy-app-order-element]') + .each((element, index) => expect(element).to.contain.text(appOrder[index])) + + // Check the top app menu order + navigationHeader.getNavigationEntries() + .each((entry, index) => expect(entry).contain.text(appOrder[index])) }) it('See the reset button is disabled again', () => { diff --git a/cypress/e2e/theming/user-background.cy.ts b/cypress/e2e/theming/user-settings_background.cy.ts index 445fb8a34f6..8abcb5bace1 100644 --- a/cypress/e2e/theming/user-background.cy.ts +++ b/cypress/e2e/theming/user-settings_background.cy.ts @@ -4,7 +4,8 @@ */ import { User } from '@nextcloud/cypress' -import { defaultPrimary, defaultBackground, pickRandomColor, validateBodyThemingCss } from './themingUtils' +import { defaultPrimary, defaultBackground, validateBodyThemingCss } from './themingUtils' +import { NavigationHeader } from '../../pages/NavigationHeader' const admin = new User('admin', 'admin') @@ -122,6 +123,8 @@ describe('User select a custom color', function() { }) describe('User select a bright custom color and remove background', function() { + const navigationHeader = new NavigationHeader() + before(function() { cy.createRandomUser().then((user: User) => { cy.login(user) @@ -159,12 +162,12 @@ describe('User select a bright custom color and remove background', function() { }) it('See the header being inverted', function() { - cy.waitUntil(() => cy.window().then((win) => { - const firstEntry = win.document.querySelector('.app-menu-main li img') - if (!firstEntry) { - return false - } - return getComputedStyle(firstEntry).filter === 'invert(1)' + cy.waitUntil(() => navigationHeader.getNavigationEntries().find('img').then((el) => { + let ret = true + el.each(function() { + ret = ret && window.getComputedStyle(this).filter === 'invert(1)' + }) + return ret })) }) @@ -181,12 +184,12 @@ describe('User select a bright custom color and remove background', function() { }) it('See the header NOT being inverted this time', function() { - cy.waitUntil(() => cy.window().then((win) => { - const firstEntry = win.document.querySelector('.app-menu-main li') - if (!firstEntry) { - return false - } - return getComputedStyle(firstEntry).filter === 'none' + cy.waitUntil(() => navigationHeader.getNavigationEntries().find('img').then((el) => { + let ret = true + el.each(function() { + ret = ret && window.getComputedStyle(this).filter === 'none' + }) + return ret })) }) }) |