Repository: code-charity/youtube (2026-03-16T12:49:20Z)

Issue:
🐞After clicking on YouTube's Dark theme and then YouTube's Light theme, the background doesn't change to Light
## Bug Report:
 - **Description:** In the Themes panel, after clicking on YouTube's Dark theme and then YouTube's Light theme, the background doesn't change to Light. When the previous theme is not YouTube's Dark theme, clicking on YouTube's Light theme changes the background to Light as expected. This bug only occurs when the previous theme is YouTube's Dark theme.
 - **Steps to reproduce this:** Visit YouTube's homepage -> Click on Improvedtube's extension icon -> Click on Themes -> Click on YouTube's Dark (background changes to Dark as expected) -> Click on YouTube's Light (background doesn't change to Light)
 - **Since when?:** I noticed the bug today (March 14, 2026) after I downloaded the extension for the first time.
 - **Browser:** Verified in both Chrome and Firefox
 - **Are any errors shown in the Browser-Console?:**   _(`F12`-key, then `console`-tab)_ No
 - **Does the bug not happen when you log out of YouTube? Then please copy your experiment flags list twice** _(with & without the error to compare). Enter: `yt.config_.EXPERIMENT_FLAGS` into the Browser console on youtube (F12-Key - Or find it in the html source(ctrl+U)_ Bug happens even when I'm not signed in to YouTube


 - Expected preferred behavior: After clicking on YouTube's Light theme, the background should change to Light. But the background doesn't change as expected when the previous background is YouTube's Dark theme.
 - ImprovedTube Version (Written in the Extension header & your Browser's store) 4.2000
 - Tested as only active extension or in incognito mode?: Active
 - OS / Device: Mac

 <!-- Many thanks & smiles !  -->



Discussion:
I'd like to work on this. Please assign it to me.
I'd like to work on this. Please assign it to me.
done, go ahead yeah




Patch:
diff --git a/js&css/web-accessible/functions.js b/js&css/web-accessible/functions.js
index 08534e696..12e732ec9 100644
--- a/js&css/web-accessible/functions.js
+++ b/js&css/web-accessible/functions.js
@@ -626,7 +626,7 @@ ImprovedTube.setPrefCookieValueByName = function (name, value) {
 	let newPrefs = '';
 	let ampersant = '';
 
-	if (name == 'f6' && prefs[name] & 1) {
+	if (name == 'f6' && value != null && prefs[name] & 1) {
 		// f6 holds other settings, possible values 80000 80001 400 401 1 none
 		// make sure we remember 1 bit
 		prefs[name] = value | 1;
diff --git a/menu/skeleton-parts/themes.js b/menu/skeleton-parts/themes.js
index 04053046b..fe96d193a 100644
--- a/menu/skeleton-parts/themes.js
+++ b/menu/skeleton-parts/themes.js
@@ -46,28 +46,32 @@ extension.skeleton.main.layers.section.themes.on.click.section = {
 	variant: 'transparent-card',
 
 	default: function () {
+		var theme = satus.storage.get('theme');
+
 		return {
 			component: 'label',
-			variant: satus.storage.get('theme') == 'dark' ? 'dark-theme' : 'default-theme',
-			text: satus.storage.get('theme') == 'dark' ? 'youtubesDark' : 'youtubesLight',
+			variant: 'default-theme',
+			text: 'youtubesLight',
 			radio: {
 				component: 'radio',
 				group: 'theme',
-				value: satus.storage.get('theme') == 'dark' ? 'dark' : 'light',
-				...(!satus.storage.get('theme') && { checked: true })
+				value: 'light',
+				...((!theme || theme == 'light') && { checked: true })
 			}
 		}
 	},
 	opposite: function () {
+		var theme = satus.storage.get('theme');
+
 		return {
 			component: 'label',
-			variant: satus.storage.get('theme') == 'dark' ? 'default-theme' : 'dark-theme',
-			text: satus.storage.get('theme') == 'dark' ? 'youtubesLight' : 'youtubesDark',
+			variant: 'dark-theme',
+			text: 'youtubesDark',
 			radio: {
 				component: 'radio',
 				group: 'theme',
-				value: satus.storage.get('theme') == 'dark' ? 'light' : 'dark',
-				...(satus.storage.get('theme') == 'dark' && { checked: true })
+				value: 'dark',
+				...(theme == 'dark' && { checked: true })
 			}
 		}
 	},


Test patch:
diff --git a/tests/unit/theme-cookie.test.js b/tests/unit/theme-cookie.test.js
new file mode 100644
index 000000000..c8382d0e5
--- /dev/null
+++ b/tests/unit/theme-cookie.test.js
@@ -0,0 +1,36 @@
+global.ImprovedTube = {
+	storage: {},
+	elements: {},
+	button_icons: {}
+};
+
+global.document = {
+	cookie: ''
+};
+
+require('../../js&css/web-accessible/functions.js');
+
+describe('Theme PREF cookie handling', () => {
+	beforeEach(() => {
+		document.cookie = '';
+		ImprovedTube.setCookie = jest.fn(function (name, value) {
+			document.cookie = name + '=' + value;
+		});
+	});
+
+	test('preserves the extra f6 bit when enabling dark theme', () => {
+		document.cookie = 'PREF=f6=80001';
+
+		ImprovedTube.setPrefCookieValueByName('f6', 400);
+
+		expect(ImprovedTube.setCookie).toHaveBeenCalledWith('PREF', 'f6=401');
+	});
+
+	test('removes the f6 theme preference when switching back to light', () => {
+		document.cookie = 'PREF=f6=401';
+
+		ImprovedTube.setPrefCookieValueByName('f6', null);
+
+		expect(ImprovedTube.setCookie).toHaveBeenCalledWith('PREF', '');
+	});
+});
\ No newline at end of file
diff --git a/tests/unit/themes-menu.test.js b/tests/unit/themes-menu.test.js
new file mode 100644
index 000000000..5758799c5
--- /dev/null
+++ b/tests/unit/themes-menu.test.js
@@ -0,0 +1,66 @@
+global.extension = {
+	skeleton: {
+		main: {
+			layers: {
+				section: {}
+			}
+		}
+	}
+};
+
+global.satus = {
+	storage: {
+		get: jest.fn()
+	}
+};
+
+require('../../menu/skeleton-parts/themes.js');
+
+describe('Themes menu radio state', () => {
+	beforeEach(() => {
+		jest.clearAllMocks();
+	});
+
+	test('keeps YouTube light as the default option when there is no stored theme', () => {
+		satus.storage.get.mockReturnValue(undefined);
+
+		const section = extension.skeleton.main.layers.section.themes.on.click.section;
+		const currentTheme = section.default();
+		const oppositeTheme = section.opposite();
+
+		expect(currentTheme.text).toBe('youtubesLight');
+		expect(currentTheme.radio.value).toBe('light');
+		expect(currentTheme.radio.checked).toBe(true);
+		expect(oppositeTheme.text).toBe('youtubesDark');
+		expect(oppositeTheme.radio.value).toBe('dark');
+		expect(oppositeTheme.radio.checked).toBeUndefined();
+	});
+
+	test('marks YouTube dark as checked when dark is the current theme', () => {
+		satus.storage.get.mockReturnValue('dark');
+
+		const section = extension.skeleton.main.layers.section.themes.on.click.section;
+		const currentTheme = section.default();
+		const oppositeTheme = section.opposite();
+
+		expect(currentTheme.text).toBe('youtubesLight');
+		expect(currentTheme.radio.value).toBe('light');
+		expect(currentTheme.radio.checked).toBeUndefined();
+		expect(oppositeTheme.text).toBe('youtubesDark');
+		expect(oppositeTheme.radio.value).toBe('dark');
+		expect(oppositeTheme.radio.checked).toBe(true);
+	});
+
+	test('keeps YouTube light selected when light is explicitly stored', () => {
+		satus.storage.get.mockReturnValue('light');
+
+		const section = extension.skeleton.main.layers.section.themes.on.click.section;
+		const currentTheme = section.default();
+		const oppositeTheme = section.opposite();
+
+		expect(currentTheme.radio.value).toBe('light');
+		expect(currentTheme.radio.checked).toBe(true);
+		expect(oppositeTheme.radio.value).toBe('dark');
+		expect(oppositeTheme.radio.checked).toBeUndefined();
+	});
+});
\ No newline at end of file