aboutsummaryrefslogtreecommitdiffstats
path: root/cypress/e2e/theming
diff options
context:
space:
mode:
Diffstat (limited to 'cypress/e2e/theming')
-rw-r--r--cypress/e2e/theming/a11y-color-contrast.cy.ts6
-rw-r--r--cypress/e2e/theming/admin-settings.cy.ts21
-rw-r--r--cypress/e2e/theming/admin-settings_default-app.cy.ts91
-rw-r--r--cypress/e2e/theming/admin-settings_urls.cy.ts143
-rw-r--r--cypress/e2e/theming/themingUtils.ts2
-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
}))
})
})