Fix background removal check

Signed-off-by: John Molakvoæ <skjnldsv@protonmail.com>

apps/theming/lib/Controller/ThemingController.php

@@ -156,7 +156,7 @@ class ThemingController extends Controller {
 				}
 				break;
 			case 'disable-user-theming':
-				if ($value !== "yes" && $value !== "no") {
+				if ($value !== 'yes' && $value !== 'no') {
 					$error = $this->l10n->t('Disable-user-theming should be true or false');
 				}
 				break;

apps/theming/lib/ImageManager.php

@@ -97,10 +97,10 @@ class ImageManager {
 	 * @throws NotPermittedException
 	 */
 	public function getImage(string $key, bool $useSvg = true): ISimpleFile {
-		$logo = $this->config->getAppValue('theming', $key . 'Mime', '');
+		$mime = $this->config->getAppValue('theming', $key . 'Mime', '');
 		$folder = $this->getRootFolder()->getFolder('images');
 
-		if ($logo === '' || !$folder->fileExists($key)) {
+		if ($mime === '' || !$folder->fileExists($key)) {
 			throw new NotFoundException();
 		}
 
@@ -127,7 +127,8 @@ class ImageManager {
 
 	public function hasImage(string $key): bool {
 		$mimeSetting = $this->config->getAppValue('theming', $key . 'Mime', '');
-		return $mimeSetting !== '';
+		// Removing the background defines its mime as 'backgroundColor'
+		return $mimeSetting !== '' && $mimeSetting !== 'backgroundColor';
 	}
 
 	/**

apps/theming/lib/Themes/CommonThemeTrait.php

@@ -97,7 +97,7 @@ trait CommonThemeTrait {
 		foreach (ImageManager::SUPPORTED_IMAGE_KEYS as $image) {
 			if ($this->imageManager->hasImage($image)) {
 				$imageUrl = $this->imageManager->getImageUrl($image);
-				// --image-background is overridden by user theming
+				// --image-background is overridden by user theming if logged in
 				$variables["--image-$image"] = "url('" . $imageUrl . "')";
 			}
 		}

apps/theming/lib/ThemingDefaults.php

@@ -487,6 +487,7 @@ class ThemingDefaults extends \OC_Defaults {
 			case 'background':
 			case 'favicon':
 				$this->imageManager->delete($setting);
+				$this->config->deleteAppValue('theming', $setting . 'Mime');
 				break;
 		}
 

cypress/e2e/theming/admin-settings.cy.ts

@@ -91,7 +91,7 @@ describe('Change the primary color and reset it', function() {
 	})
 })
 
-describe('Remove the default background and restore it', function() {
+describe.only('Remove the default background and restore it', function() {
 	before(function() {
 		// Just in case previous test failed
 		cy.resetAdminTheming()
@@ -121,7 +121,7 @@ describe('Remove the default background and restore it', function() {
 		cy.logout()
 		cy.visit('/')
 
-		cy.waitUntil(() => validateBodyThemingCss(defaultPrimary, ''))
+		cy.waitUntil(() => validateBodyThemingCss(defaultPrimary, null))
 		cy.screenshot()
 	})
 
@@ -170,7 +170,7 @@ describe('Remove the default background with a custom primary color', function()
 		cy.logout()
 		cy.visit('/')
 
-		cy.waitUntil(() => validateBodyThemingCss(selectedColor, ''))
+		cy.waitUntil(() => validateBodyThemingCss(selectedColor, null))
 		cy.screenshot()
 	})
 
@@ -212,7 +212,7 @@ describe('Remove the default background with a bright color', function() {
 		cy.get('.color-picker__simple-color-circle:eq(4)').click()
 
 		cy.wait('@setColor')
-		cy.waitUntil(() => validateBodyThemingCss('#ddcb55', ''))
+		cy.waitUntil(() => validateBodyThemingCss('#ddcb55', null))
 	})
 
 	it('See the header being inverted', function() {

cypress/e2e/theming/themingUtils.ts

@@ -25,14 +25,19 @@ import { colord } from 'colord'
  * Validate the current page body css variables
  *
  * @param {string} expectedColor the expected color
- * @param {string} expectedBackground the expected background
+ * @param {string|null} expectedBackground the expected background
  */
-export const validateBodyThemingCss = function(expectedColor = '#0082c9', expectedBackground = 'kamil-porembinski-clouds.jpg') {
+export const validateBodyThemingCss = function(expectedColor = '#0082c9', expectedBackground: string|null = 'kamil-porembinski-clouds.jpg') {
 	return cy.window().then((win) => {
 		const guestBackgroundColor = getComputedStyle(win.document.body).backgroundColor
 		const guestBackgroundImage = getComputedStyle(win.document.body).backgroundImage
+		
+		const isValidBackgroundImage = expectedBackground === null
+			? guestBackgroundImage === 'none'
+			: guestBackgroundImage.includes(expectedBackground)
+
 		return colord(guestBackgroundColor).isEqual(expectedColor)
-			&& guestBackgroundImage.includes(expectedBackground)
+			&& isValidBackgroundImage
 	})
 }
 
@@ -42,7 +47,7 @@ export const validateBodyThemingCss = function(expectedColor = '#0082c9', expect
  * @param {string} expectedColor the expected color
  * @param {string} expectedBackground the expected background
  */
-export const validateUserThemingDefaultCss = function(expectedColor = '#0082c9', expectedBackground = 'kamil-porembinski-clouds.jpg') {
+export const validateUserThemingDefaultCss = function(expectedColor = '#0082c9', expectedBackground: string|null = 'kamil-porembinski-clouds.jpg') {
 	return cy.window().then((win) => {
 		const defaultSelectButton = win.document.querySelector('[data-user-theming-background-default]')
 		const customColorSelectButton = win.document.querySelector('[data-user-theming-background-color]')
@@ -53,7 +58,12 @@ export const validateUserThemingDefaultCss = function(expectedColor = '#0082c9',
 		const defaultOptionBackground = getComputedStyle(defaultSelectButton).backgroundImage
 		const defaultOptionBorderColor = getComputedStyle(defaultSelectButton).borderColor
 		const colorPickerOptionColor = getComputedStyle(customColorSelectButton).backgroundColor
-		return defaultOptionBackground.includes(expectedBackground)
+
+		const isValidBackgroundImage = expectedBackground === null
+			? defaultOptionBackground === 'none'
+			: defaultOptionBackground.includes(expectedBackground)
+
+		return isValidBackgroundImage
 			&& colord(defaultOptionBorderColor).isEqual(expectedColor)
 			&& colord(colorPickerOptionColor).isEqual(expectedColor)
 	})

cypress/e2e/theming/user-background.cy.ts

@@ -111,7 +111,7 @@ describe('User select shipped backgrounds and remove background', function() {
 
 		// Validate clear background
 		cy.wait('@clearBackground')
-		cy.waitUntil(() => validateBodyThemingCss('#56633d', ''))
+		cy.waitUntil(() => validateBodyThemingCss('#56633d', null))
 	})
 })
 
@@ -163,7 +163,7 @@ describe('User select a bright custom color and remove background', function() {
 
 		// Validate clear background
 		cy.wait('@clearBackground')
-		cy.waitUntil(() => validateBodyThemingCss(undefined, ''))
+		cy.waitUntil(() => validateBodyThemingCss(undefined, null))
 	})
 
 	it('Select a custom color', function() {