|
@@ -20,6 +20,9 @@
|
|
|
*
|
|
|
*/
|
|
|
import { User } from '@nextcloud/cypress'
|
|
|
+import { colord } from 'colord'
|
|
|
+
|
|
|
+import { pickRandomColor, validateBodyThemingCss, validateUserThemingDefaultCss } from './themingUtils'
|
|
|
|
|
|
const admin = new User('admin', 'admin')
|
|
|
|
|
@@ -28,6 +31,8 @@ const defaultBackground = 'kamil-porembinski-clouds.jpg'
|
|
|
|
|
|
describe('Admin theming settings', function() {
|
|
|
before(function() {
|
|
|
+ // Just in case previous test failed
|
|
|
+ cy.resetTheming()
|
|
|
cy.login(admin)
|
|
|
})
|
|
|
|
|
@@ -39,13 +44,16 @@ describe('Admin theming settings', function() {
|
|
|
it('See the default settings', function() {
|
|
|
cy.get('[data-admin-theming-setting-primary-color-picker]').should('contain.text', defaultPrimary)
|
|
|
cy.get('[data-admin-theming-setting-primary-color-reset]').should('not.exist')
|
|
|
- cy.get('[data-admin-theming-setting-background-reset]').should('not.exist')
|
|
|
- cy.get('[data-admin-theming-setting-background-remove]').should('be.visible')
|
|
|
+ cy.get('[data-admin-theming-setting-file-reset]').should('not.exist')
|
|
|
+ cy.get('[data-admin-theming-setting-file-remove]').should('be.visible')
|
|
|
})
|
|
|
})
|
|
|
|
|
|
-describe('Change the primary colour', function() {
|
|
|
+describe('Change the primary colour and reset it', function() {
|
|
|
+ let selectedColor = ''
|
|
|
before(function() {
|
|
|
+ // Just in case previous test failed
|
|
|
+ cy.resetTheming()
|
|
|
cy.login(admin)
|
|
|
})
|
|
|
|
|
@@ -57,14 +65,11 @@ describe('Change the primary colour', function() {
|
|
|
it('Change the primary colour', function() {
|
|
|
cy.intercept('*/apps/theming/ajax/updateStylesheet').as('setColor')
|
|
|
|
|
|
- cy.get('[data-admin-theming-setting-primary-color-picker]').click()
|
|
|
- cy.get('.color-picker__simple-color-circle:eq(3)').click()
|
|
|
+ pickRandomColor('[data-admin-theming-setting-primary-color-picker]')
|
|
|
+ .then(color => selectedColor = color)
|
|
|
|
|
|
cy.wait('@setColor')
|
|
|
- cy.waitUntil(() => cy.window().then((win) => {
|
|
|
- const primary = getComputedStyle(win.document.body).getPropertyValue('--color-primary-default')
|
|
|
- return primary !== defaultPrimary
|
|
|
- }))
|
|
|
+ cy.waitUntil(() => validateBodyThemingCss(selectedColor, defaultBackground))
|
|
|
})
|
|
|
|
|
|
it('Screenshot the login page', function() {
|
|
@@ -73,32 +78,21 @@ describe('Change the primary colour', function() {
|
|
|
cy.screenshot()
|
|
|
})
|
|
|
|
|
|
- it('Login again and go to the admin theming section', function() {
|
|
|
- cy.login(admin)
|
|
|
- cy.visit('/settings/admin/theming')
|
|
|
- })
|
|
|
-
|
|
|
- it('Reset the primary colour', function() {
|
|
|
- cy.intercept('*/apps/theming/ajax/undoChanges').as('undoChanges')
|
|
|
-
|
|
|
- cy.get('[data-admin-theming-setting-primary-color-reset]').click()
|
|
|
-
|
|
|
- cy.wait('@undoChanges')
|
|
|
- cy.waitUntil(() => cy.window().then((win) => {
|
|
|
- const primary = getComputedStyle(win.document.body).getPropertyValue('--color-primary-default')
|
|
|
- return primary === defaultPrimary
|
|
|
- }))
|
|
|
+ it('Undo theming settings', function() {
|
|
|
+ cy.resetTheming()
|
|
|
})
|
|
|
|
|
|
it('Screenshot the login page', function() {
|
|
|
- cy.logout()
|
|
|
cy.visit('/')
|
|
|
+ cy.waitUntil(validateBodyThemingCss)
|
|
|
cy.screenshot()
|
|
|
})
|
|
|
})
|
|
|
|
|
|
-describe('Remove the default background', function() {
|
|
|
+describe('Remove the default background and restore it', function() {
|
|
|
before(function() {
|
|
|
+ // Just in case previous test failed
|
|
|
+ cy.resetTheming()
|
|
|
cy.login(admin)
|
|
|
})
|
|
|
|
|
@@ -110,13 +104,13 @@ describe('Remove the default background', function() {
|
|
|
it('Remove the default background', function() {
|
|
|
cy.intercept('*/apps/theming/ajax/updateStylesheet').as('removeBackground')
|
|
|
|
|
|
- cy.get('[data-admin-theming-setting-background-remove]').click()
|
|
|
+ cy.get('[data-admin-theming-setting-file-remove]').click()
|
|
|
|
|
|
cy.wait('@removeBackground')
|
|
|
cy.waitUntil(() => cy.window().then((win) => {
|
|
|
- const backgroundDefault = getComputedStyle(win.document.body).getPropertyValue('--image-background-default')
|
|
|
+ const currentBackgroundDefault = getComputedStyle(win.document.body).getPropertyValue('--image-background-default')
|
|
|
const backgroundPlain = getComputedStyle(win.document.body).getPropertyValue('--image-background-plain')
|
|
|
- return !backgroundDefault.includes(defaultBackground)
|
|
|
+ return !currentBackgroundDefault.includes(defaultBackground)
|
|
|
&& backgroundPlain !== ''
|
|
|
}))
|
|
|
})
|
|
@@ -127,38 +121,25 @@ describe('Remove the default background', function() {
|
|
|
cy.screenshot()
|
|
|
})
|
|
|
|
|
|
- it('Login again and go to the admin theming section', function() {
|
|
|
- cy.login(admin)
|
|
|
- cy.visit('/settings/admin/theming')
|
|
|
- })
|
|
|
-
|
|
|
- it('Restore the default background', function() {
|
|
|
- cy.intercept('*/apps/theming/ajax/undoChanges').as('undoChanges')
|
|
|
-
|
|
|
- cy.get('[data-admin-theming-setting-background-reset]').click()
|
|
|
-
|
|
|
- cy.wait('@undoChanges')
|
|
|
- cy.waitUntil(() => cy.window().then((win) => {
|
|
|
- const backgroundDefault = getComputedStyle(win.document.body).getPropertyValue('--image-background-default')
|
|
|
- const backgroundPlain = getComputedStyle(win.document.body).getPropertyValue('--image-background-plain')
|
|
|
- return backgroundDefault.includes(defaultBackground)
|
|
|
- && backgroundPlain === ''
|
|
|
- }))
|
|
|
+ it('Undo theming settings', function() {
|
|
|
+ cy.resetTheming()
|
|
|
})
|
|
|
|
|
|
it('Screenshot the login page', function() {
|
|
|
- cy.logout()
|
|
|
cy.visit('/')
|
|
|
+ cy.waitUntil(validateBodyThemingCss)
|
|
|
cy.screenshot()
|
|
|
})
|
|
|
})
|
|
|
|
|
|
-describe('Change the login fields', function() {
|
|
|
+describe('Change the login fields then reset them', function() {
|
|
|
const name = 'ABCdef123'
|
|
|
const url = 'https://example.com'
|
|
|
const slogan = 'Testing is fun'
|
|
|
|
|
|
before(function() {
|
|
|
+ // Just in case previous test failed
|
|
|
+ cy.resetTheming()
|
|
|
cy.login(admin)
|
|
|
})
|
|
|
|
|
@@ -214,29 +195,11 @@ describe('Change the login fields', function() {
|
|
|
cy.get('footer p').should('contain.text', `– ${slogan}`)
|
|
|
})
|
|
|
|
|
|
- it('Login again and go to the admin theming section', function() {
|
|
|
- cy.login(admin)
|
|
|
- cy.visit('/settings/admin/theming')
|
|
|
- })
|
|
|
-
|
|
|
- it('Undo changes', function() {
|
|
|
- cy.intercept('*/apps/theming/ajax/undoChanges').as('undoChanges')
|
|
|
-
|
|
|
- cy.get('[data-admin-theming-setting-field="name"] .input-field__clear-button')
|
|
|
- .scrollIntoView().click()
|
|
|
- cy.wait('@undoChanges')
|
|
|
-
|
|
|
- cy.get('[data-admin-theming-setting-field="url"] .input-field__clear-button')
|
|
|
- .scrollIntoView().click()
|
|
|
- cy.wait('@undoChanges')
|
|
|
-
|
|
|
- cy.get('[data-admin-theming-setting-field="slogan"] .input-field__clear-button')
|
|
|
- .scrollIntoView().click()
|
|
|
- cy.wait('@undoChanges')
|
|
|
+ it('Undo theming settings', function() {
|
|
|
+ cy.resetTheming()
|
|
|
})
|
|
|
|
|
|
it('Check login screen changes', function() {
|
|
|
- cy.logout()
|
|
|
cy.visit('/')
|
|
|
|
|
|
cy.get('[data-login-form-headline]').should('not.contain.text', name)
|
|
@@ -246,8 +209,10 @@ describe('Change the login fields', function() {
|
|
|
})
|
|
|
})
|
|
|
|
|
|
-describe('Disable user theming', function() {
|
|
|
+describe('Disable user theming and enable it back', function() {
|
|
|
before(function() {
|
|
|
+ // Just in case previous test failed
|
|
|
+ cy.resetTheming()
|
|
|
cy.login(admin)
|
|
|
})
|
|
|
|
|
@@ -278,25 +243,74 @@ describe('Disable user theming', function() {
|
|
|
cy.visit('/settings/user/theming')
|
|
|
cy.get('[data-user-theming-background-disabled]').scrollIntoView().should('be.visible')
|
|
|
})
|
|
|
+})
|
|
|
|
|
|
- it('Login back as admin', function() {
|
|
|
- cy.logout()
|
|
|
+describe('User default option matches admin theming', function() {
|
|
|
+ let selectedColor = ''
|
|
|
+
|
|
|
+ before(function() {
|
|
|
+ // Just in case previous test failed
|
|
|
+ cy.resetTheming()
|
|
|
cy.login(admin)
|
|
|
})
|
|
|
|
|
|
+ after(function() {
|
|
|
+ cy.resetTheming()
|
|
|
+ })
|
|
|
+
|
|
|
it('See the admin theming section', function() {
|
|
|
cy.visit('/settings/admin/theming')
|
|
|
cy.get('[data-admin-theming-settings]').scrollIntoView().should('be.visible')
|
|
|
})
|
|
|
|
|
|
- it('Enable back user theming', function() {
|
|
|
- cy.intercept('*/apps/theming/ajax/updateStylesheet').as('enableUserTheming')
|
|
|
+ it('Change the primary colour', function() {
|
|
|
+ cy.intercept('*/apps/theming/ajax/updateStylesheet').as('setColor')
|
|
|
|
|
|
- cy.get('[data-admin-theming-setting-disable-user-theming]')
|
|
|
- .scrollIntoView().should('be.visible')
|
|
|
- cy.get('[data-admin-theming-setting-disable-user-theming] input[type="checkbox"]').uncheck({ force: true })
|
|
|
- cy.get('[data-admin-theming-setting-disable-user-theming] input[type="checkbox"]').should('not.be.checked')
|
|
|
+ pickRandomColor('[data-admin-theming-setting-primary-color-picker]')
|
|
|
+ .then(color => selectedColor = color)
|
|
|
+
|
|
|
+ cy.wait('@setColor')
|
|
|
+ cy.waitUntil(() => cy.window().then((win) => {
|
|
|
+ const primary = getComputedStyle(win.document.body).getPropertyValue('--color-primary-default')
|
|
|
+ return colord(primary).isEqual(selectedColor)
|
|
|
+ }))
|
|
|
+ })
|
|
|
+
|
|
|
+ it('Change the default background', function() {
|
|
|
+ cy.intercept('*/apps/theming/ajax/uploadImage').as('setBackground')
|
|
|
+
|
|
|
+ cy.fixture('image.jpg', null).as('background')
|
|
|
+ cy.get('[data-admin-theming-setting-file="background"] input[type="file"]').selectFile('@background', { force: true })
|
|
|
+
|
|
|
+ cy.wait('@setBackground')
|
|
|
+ cy.waitUntil(() => cy.window().then((win) => {
|
|
|
+ const currentBackgroundDefault = getComputedStyle(win.document.body).getPropertyValue('--image-background-default')
|
|
|
+ return currentBackgroundDefault.includes('/apps/theming/image/background?v=')
|
|
|
+ }))
|
|
|
+ })
|
|
|
+
|
|
|
+ it('Logout and check changes', function() {
|
|
|
+ cy.logout()
|
|
|
+ cy.visit('/')
|
|
|
+
|
|
|
+ cy.waitUntil(() => validateBodyThemingCss(selectedColor, '/apps/theming/image/background?v='))
|
|
|
+ })
|
|
|
+
|
|
|
+ it('Login as user', function() {
|
|
|
+ cy.createRandomUser().then((user) => {
|
|
|
+ cy.login(user)
|
|
|
+ })
|
|
|
+ })
|
|
|
+
|
|
|
+ it('See the user background settings', function() {
|
|
|
+ cy.visit('/settings/user/theming')
|
|
|
+ cy.get('[data-user-theming-background-settings]').scrollIntoView().should('be.visible')
|
|
|
+ })
|
|
|
+
|
|
|
+ it('See the default background option selected', function() {
|
|
|
+ cy.get('[data-user-theming-background-default]').should('be.visible')
|
|
|
+ cy.get('[data-user-theming-background-default]').should('have.class', 'background--active')
|
|
|
|
|
|
- cy.wait('@enableUserTheming')
|
|
|
+ cy.waitUntil(() => validateUserThemingDefaultCss(selectedColor, '/apps/theming/image/background?v='))
|
|
|
})
|
|
|
})
|