From 96ccba2ee2c055374b924beafb5a5810885cc6fe Mon Sep 17 00:00:00 2001 From: Guillaume Gomez Date: Tue, 12 Jul 2022 15:51:34 +0200 Subject: [PATCH 1/8] Simplify "system theme" handling --- src/librustdoc/html/static/js/settings.js | 27 ++++++----------- src/librustdoc/html/static/js/storage.js | 37 ++++++++--------------- 2 files changed, 23 insertions(+), 41 deletions(-) diff --git a/src/librustdoc/html/static/js/settings.js b/src/librustdoc/html/static/js/settings.js index 797b931afc643..97a87d237bce6 100644 --- a/src/librustdoc/html/static/js/settings.js +++ b/src/librustdoc/html/static/js/settings.js @@ -1,7 +1,7 @@ // Local js definitions: /* global getSettingValue, getVirtualKey, updateLocalStorage, updateSystemTheme */ /* global addClass, removeClass, onEach, onEachLazy, blurHandler, elemIsInParent */ -/* global MAIN_ID, getVar, getSettingsButton */ +/* global MAIN_ID, getVar, getSettingsButton, isUsingSystemTheme */ "use strict"; @@ -15,7 +15,6 @@ case "theme": case "preferred-dark-theme": case "preferred-light-theme": - case "use-system-theme": updateSystemTheme(); updateLightAndDark(); break; @@ -38,7 +37,6 @@ } function showLightAndDark() { - addClass(document.getElementById("theme").parentElement, "hidden"); removeClass(document.getElementById("preferred-light-theme").parentElement, "hidden"); removeClass(document.getElementById("preferred-dark-theme").parentElement, "hidden"); } @@ -46,11 +44,10 @@ function hideLightAndDark() { addClass(document.getElementById("preferred-light-theme").parentElement, "hidden"); addClass(document.getElementById("preferred-dark-theme").parentElement, "hidden"); - removeClass(document.getElementById("theme").parentElement, "hidden"); } function updateLightAndDark() { - if (getSettingValue("use-system-theme") !== "false") { + if (isUsingSystemTheme()) { showLightAndDark(); } else { hideLightAndDark(); @@ -113,18 +110,19 @@ const setting_name = setting["name"]; if (setting["options"] !== undefined) { - // This is a select setting. + // This is a \ + id="${js_data_name}-${optionAttr}" value="${optionAttr}"${checked}>\ ${option}\ - `; + `; }); output += ""; } else { @@ -149,16 +147,11 @@ function buildSettingsPage() { const themes = getVar("themes").split(","); const settings = [ - { - "name": "Use system theme", - "js_name": "use-system-theme", - "default": true, - }, { "name": "Theme", "js_name": "theme", - "default": "light", - "options": themes, + "default": "", + "options": themes.concat("system preference"), }, { "name": "Preferred light theme", diff --git a/src/librustdoc/html/static/js/storage.js b/src/librustdoc/html/static/js/storage.js index 0c5389d45e5b7..9e27a238f0df9 100644 --- a/src/librustdoc/html/static/js/storage.js +++ b/src/librustdoc/html/static/js/storage.js @@ -42,6 +42,11 @@ function getSettingValue(settingName) { return null; } +function isUsingSystemTheme() { + const current = getSettingValue("theme"); + return current === null || current === "system-preference"; +} + const localStoredTheme = getSettingValue("theme"); const savedHref = []; @@ -157,22 +162,6 @@ function switchTheme(styleElem, mainStyleElem, newTheme, saveTheme) { } } -// This function is called from "main.js". -// eslint-disable-next-line no-unused-vars -function useSystemTheme(value) { - if (value === undefined) { - value = true; - } - - updateLocalStorage("use-system-theme", value); - - // update the toggle if we're on the settings page - const toggle = document.getElementById("use-system-theme"); - if (toggle && toggle instanceof HTMLInputElement) { - toggle.checked = value; - } -} - const updateSystemTheme = (function() { if (!window.matchMedia) { // fallback to the CSS computed value @@ -193,25 +182,25 @@ const updateSystemTheme = (function() { const mql = window.matchMedia("(prefers-color-scheme: dark)"); function handlePreferenceChange(mql) { - const use = theme => { - switchTheme(window.currentTheme, window.mainTheme, theme, true); + const use = (theme, saveIt) => { + switchTheme(window.currentTheme, window.mainTheme, theme, saveIt); }; // maybe the user has disabled the setting in the meantime! - if (getSettingValue("use-system-theme") !== "false") { + if (isUsingSystemTheme()) { const lightTheme = getSettingValue("preferred-light-theme") || "light"; const darkTheme = getSettingValue("preferred-dark-theme") || "dark"; if (mql.matches) { - use(darkTheme); + use(darkTheme, false); } else { // prefers a light theme, or has no preference - use(lightTheme); + use(lightTheme, false); } // note: we save the theme so that it doesn't suddenly change when // the user disables "use-system-theme" and reloads the page or // navigates to another page } else { - use(getSettingValue("theme")); + use(getSettingValue("theme"), true); } } @@ -231,10 +220,10 @@ function switchToSavedTheme() { ); } -if (getSettingValue("use-system-theme") !== "false" && window.matchMedia) { +if (isUsingSystemTheme() && window.matchMedia) { // update the preferred dark theme if the user is already using a dark theme // See https://github.com/rust-lang/rust/pull/77809#issuecomment-707875732 - if (getSettingValue("use-system-theme") === null + if (getSettingValue("theme") === null && getSettingValue("preferred-dark-theme") === null && darkThemes.indexOf(localStoredTheme) >= 0) { updateLocalStorage("preferred-dark-theme", localStoredTheme); From 1440b07ab786158f4f15ba2caa9459f5a2e59514 Mon Sep 17 00:00:00 2001 From: Guillaume Gomez Date: Tue, 12 Jul 2022 16:03:50 +0200 Subject: [PATCH 2/8] Update GUI test to reflect update on theme selection --- src/test/rustdoc-gui/anchors.goml | 2 +- src/test/rustdoc-gui/code-color.goml | 6 ++-- src/test/rustdoc-gui/docblock-details.goml | 2 +- src/test/rustdoc-gui/headers-color.goml | 14 ++-------- src/test/rustdoc-gui/headings.goml | 2 +- .../rustdoc-gui/jump-to-def-background.goml | 14 ++-------- src/test/rustdoc-gui/pocket-menu.goml | 15 ++-------- src/test/rustdoc-gui/rust-logo.goml | 28 ++++--------------- src/test/rustdoc-gui/search-filter.goml | 2 +- src/test/rustdoc-gui/search-reexport.goml | 2 +- src/test/rustdoc-gui/search-result-color.goml | 20 +++---------- src/test/rustdoc-gui/settings.goml | 2 +- src/test/rustdoc-gui/sidebar-mobile.goml | 6 ++-- .../sidebar-source-code-display.goml | 6 ++-- src/test/rustdoc-gui/theme-change.goml | 2 +- src/test/rustdoc-gui/theme-in-history.goml | 6 +--- 16 files changed, 36 insertions(+), 93 deletions(-) diff --git a/src/test/rustdoc-gui/anchors.goml b/src/test/rustdoc-gui/anchors.goml index 3ad62c721b4b8..c3a0ff9ffe6aa 100644 --- a/src/test/rustdoc-gui/anchors.goml +++ b/src/test/rustdoc-gui/anchors.goml @@ -5,7 +5,7 @@ goto: file://|DOC_PATH|/staged_api/struct.Foo.html show-text: true // Set the theme to light. -local-storage: {"rustdoc-theme": "light", "rustdoc-use-system-theme": "false"} +local-storage: {"rustdoc-theme": "light"} // We reload the page so the local storage settings are being used. reload: diff --git a/src/test/rustdoc-gui/code-color.goml b/src/test/rustdoc-gui/code-color.goml index 2f95bfb6b177f..e288b59012a56 100644 --- a/src/test/rustdoc-gui/code-color.goml +++ b/src/test/rustdoc-gui/code-color.goml @@ -6,7 +6,7 @@ goto: file://|DOC_PATH|/test_docs/fn.foo.html // If the text isn't displayed, the browser doesn't compute color style correctly... show-text: true // Set the theme to dark. -local-storage: {"rustdoc-theme": "dark", "rustdoc-preferred-dark-theme": "dark", "rustdoc-use-system-theme": "false"} +local-storage: {"rustdoc-theme": "dark"} // We reload the page so the local storage settings are being used. reload: @@ -14,7 +14,7 @@ assert-css: (".docblock pre > code", {"color": "rgb(221, 221, 221)"}, ALL) assert-css: (".docblock > p > code", {"color": "rgb(221, 221, 221)"}, ALL) // Set the theme to ayu. -local-storage: {"rustdoc-theme": "ayu", "rustdoc-preferred-dark-theme": "ayu", "rustdoc-use-system-theme": "false"} +local-storage: {"rustdoc-theme": "ayu"} // We reload the page so the local storage settings are being used. reload: @@ -22,7 +22,7 @@ assert-css: (".docblock pre > code", {"color": "rgb(230, 225, 207)"}, ALL) assert-css: (".docblock > p > code", {"color": "rgb(255, 180, 84)"}, ALL) // Set the theme to light. -local-storage: {"rustdoc-theme": "light", "rustdoc-use-system-theme": "false"} +local-storage: {"rustdoc-theme": "light"} // We reload the page so the local storage settings are being used. reload: diff --git a/src/test/rustdoc-gui/docblock-details.goml b/src/test/rustdoc-gui/docblock-details.goml index f6287ade2f295..0116ce150d980 100644 --- a/src/test/rustdoc-gui/docblock-details.goml +++ b/src/test/rustdoc-gui/docblock-details.goml @@ -1,7 +1,7 @@ // This ensures that the `
`/`` elements are displayed as expected. goto: file://|DOC_PATH|/test_docs/details/struct.Details.html show-text: true -local-storage: {"rustdoc-theme": "dark", "rustdoc-use-system-theme": "false"} +local-storage: {"rustdoc-theme": "dark"} reload: // We first check that the headers in the `.top-doc` doc block still have their diff --git a/src/test/rustdoc-gui/headers-color.goml b/src/test/rustdoc-gui/headers-color.goml index a47a9c8a14c1f..3d076aa76d415 100644 --- a/src/test/rustdoc-gui/headers-color.goml +++ b/src/test/rustdoc-gui/headers-color.goml @@ -5,11 +5,7 @@ goto: file://|DOC_PATH|/test_docs/struct.Foo.html show-text: true // Ayu theme -local-storage: { - "rustdoc-theme": "ayu", - "rustdoc-preferred-dark-theme": "ayu", - "rustdoc-use-system-theme": "false", -} +local-storage: {"rustdoc-theme": "ayu"} reload: assert-css: ( @@ -44,11 +40,7 @@ goto: file://|DOC_PATH|/test_docs/struct.HeavilyDocumentedStruct.html assert-css: (".docblock > :not(p) > a", {"color": "rgb(57, 175, 215)"}, ALL) // Dark theme -local-storage: { - "rustdoc-theme": "dark", - "rustdoc-preferred-dark-theme": "dark", - "rustdoc-use-system-theme": "false", -} +local-storage: {"rustdoc-theme": "dark"} goto: file://|DOC_PATH|/test_docs/struct.Foo.html assert-css: ( @@ -83,7 +75,7 @@ goto: file://|DOC_PATH|/test_docs/struct.HeavilyDocumentedStruct.html assert-css: (".docblock > :not(p) > a", {"color": "rgb(210, 153, 29)"}, ALL) // Light theme -local-storage: {"rustdoc-theme": "light", "rustdoc-use-system-theme": "false"} +local-storage: {"rustdoc-theme": "light"} reload: goto: file://|DOC_PATH|/test_docs/struct.Foo.html diff --git a/src/test/rustdoc-gui/headings.goml b/src/test/rustdoc-gui/headings.goml index ed07e777b1880..32b5d9d64298e 100644 --- a/src/test/rustdoc-gui/headings.goml +++ b/src/test/rustdoc-gui/headings.goml @@ -152,7 +152,7 @@ assert-css: ("h3#top-doc-prose-sub-heading", {"border-bottom-width": "1px"}) // Checking colors now. show-text: true -local-storage: {"rustdoc-theme": "light", "rustdoc-use-system-theme": "false"} +local-storage: {"rustdoc-theme": "light"} goto: file://|DOC_PATH|/test_docs/struct.HeavilyDocumentedStruct.html assert-css: ( ".top-doc .docblock h2", diff --git a/src/test/rustdoc-gui/jump-to-def-background.goml b/src/test/rustdoc-gui/jump-to-def-background.goml index d17400f5bd9e8..b85fa2f05857c 100644 --- a/src/test/rustdoc-gui/jump-to-def-background.goml +++ b/src/test/rustdoc-gui/jump-to-def-background.goml @@ -2,11 +2,7 @@ goto: file://|DOC_PATH|/src/link_to_definition/lib.rs.html // Set the theme to dark. -local-storage: { - "rustdoc-theme": "dark", - "rustdoc-preferred-dark-theme": "dark", - "rustdoc-use-system-theme": "false", -} +local-storage: {"rustdoc-theme": "dark"} // We reload the page so the local storage settings are being used. reload: @@ -17,11 +13,7 @@ assert-css: ( ) // Set the theme to ayu. -local-storage: { - "rustdoc-theme": "ayu", - "rustdoc-preferred-dark-theme": "ayu", - "rustdoc-use-system-theme": "false", -} +local-storage: {"rustdoc-theme": "ayu"} // We reload the page so the local storage settings are being used. reload: @@ -32,7 +24,7 @@ assert-css: ( ) // Set the theme to light. -local-storage: {"rustdoc-theme": "light", "rustdoc-use-system-theme": "false"} +local-storage: {"rustdoc-theme": "light"} // We reload the page so the local storage settings are being used. reload: diff --git a/src/test/rustdoc-gui/pocket-menu.goml b/src/test/rustdoc-gui/pocket-menu.goml index 71d514648ba26..27e288a96a057 100644 --- a/src/test/rustdoc-gui/pocket-menu.goml +++ b/src/test/rustdoc-gui/pocket-menu.goml @@ -32,10 +32,7 @@ assert-css: ("#settings-menu .popover", {"display": "none"}) // We check the borders color now: // Ayu theme -local-storage: { - "rustdoc-theme": "ayu", - "rustdoc-use-system-theme": "false", -} +local-storage: {"rustdoc-theme": "ayu"} reload: click: "#help-button" @@ -47,10 +44,7 @@ compare-elements-css: ("#help-button .popover", "#help-button .top", ["border-co compare-elements-css: ("#help-button .popover", "#help-button .bottom", ["border-color"]) // Dark theme -local-storage: { - "rustdoc-theme": "dark", - "rustdoc-use-system-theme": "false", -} +local-storage: {"rustdoc-theme": "dark"} reload: click: "#help-button" @@ -62,10 +56,7 @@ compare-elements-css: ("#help-button .popover", "#help-button .top", ["border-co compare-elements-css: ("#help-button .popover", "#help-button .bottom", ["border-color"]) // Light theme -local-storage: { - "rustdoc-theme": "light", - "rustdoc-use-system-theme": "false", -} +local-storage: {"rustdoc-theme": "light"} reload: click: "#help-button" diff --git a/src/test/rustdoc-gui/rust-logo.goml b/src/test/rustdoc-gui/rust-logo.goml index 4a9dcf735065f..c4ab0e2e4db0b 100644 --- a/src/test/rustdoc-gui/rust-logo.goml +++ b/src/test/rustdoc-gui/rust-logo.goml @@ -2,11 +2,7 @@ goto: file://|DOC_PATH|/test_docs/index.html // First we start with the dark theme. -local-storage: { - "rustdoc-theme": "dark", - "rustdoc-preferred-dark-theme": "dark", - "rustdoc-use-system-theme": "false", -} +local-storage: {"rustdoc-theme": "dark"} reload: assert-css: ( @@ -17,11 +13,7 @@ assert-css: ( // In the source view page now. goto: file://|DOC_PATH|/src/test_docs/lib.rs.html -local-storage: { - "rustdoc-theme": "dark", - "rustdoc-preferred-dark-theme": "dark", - "rustdoc-use-system-theme": "false", -} +local-storage: {"rustdoc-theme": "dark"} reload: assert-css: ( @@ -30,11 +22,7 @@ assert-css: ( ) // Then with the ayu theme. -local-storage: { - "rustdoc-theme": "ayu", - "rustdoc-preferred-dark-theme": "ayu", - "rustdoc-use-system-theme": "false", -} +local-storage: {"rustdoc-theme": "ayu"} reload: assert-css: ( @@ -45,11 +33,7 @@ assert-css: ( // In the source view page now. goto: file://|DOC_PATH|/src/test_docs/lib.rs.html -local-storage: { - "rustdoc-theme": "ayu", - "rustdoc-preferred-dark-theme": "ayu", - "rustdoc-use-system-theme": "false", -} +local-storage: {"rustdoc-theme": "ayu"} reload: assert-css: ( @@ -58,7 +42,7 @@ assert-css: ( ) // And finally with the light theme. -local-storage: {"rustdoc-theme": "light", "rustdoc-use-system-theme": "false"} +local-storage: {"rustdoc-theme": "light"} reload: assert-css: ( @@ -69,7 +53,7 @@ assert-css: ( // In the source view page now. goto: file://|DOC_PATH|/src/test_docs/lib.rs.html -local-storage: {"rustdoc-theme": "light", "rustdoc-use-system-theme": "false"} +local-storage: {"rustdoc-theme": "light"} reload: assert-css: ( diff --git a/src/test/rustdoc-gui/search-filter.goml b/src/test/rustdoc-gui/search-filter.goml index 35d7ca480cae1..6699da71ec56a 100644 --- a/src/test/rustdoc-gui/search-filter.goml +++ b/src/test/rustdoc-gui/search-filter.goml @@ -53,7 +53,7 @@ assert-text: (".search-results-title", "Results in all crates", STARTS_WITH) // Checking the display of the crate filter. // We start with the light theme. -local-storage: {"rustdoc-theme": "light", "rustdoc-use-system-theme": "false"} +local-storage: {"rustdoc-theme": "light"} reload: timeout: 2000 diff --git a/src/test/rustdoc-gui/search-reexport.goml b/src/test/rustdoc-gui/search-reexport.goml index 5ef890d472b90..1c6c81b587240 100644 --- a/src/test/rustdoc-gui/search-reexport.goml +++ b/src/test/rustdoc-gui/search-reexport.goml @@ -1,7 +1,7 @@ // Checks that the reexports are present in the search index, can have // doc aliases and are highligted when their ID is the hash of the page. goto: file://|DOC_PATH|/test_docs/index.html -local-storage: {"rustdoc-theme": "dark", "rustdoc-use-system-theme": "false"} +local-storage: {"rustdoc-theme": "dark"} reload: // First we check that the reexport has the correct ID and no background color. assert-text: ("//*[@id='reexport.TheStdReexport']", "pub use ::std as TheStdReexport;") diff --git a/src/test/rustdoc-gui/search-result-color.goml b/src/test/rustdoc-gui/search-result-color.goml index 5e328133e62a1..09eb60ddec2af 100644 --- a/src/test/rustdoc-gui/search-result-color.goml +++ b/src/test/rustdoc-gui/search-result-color.goml @@ -5,11 +5,7 @@ goto: file://|DOC_PATH|/test_docs/index.html?search=coo show-text: true // Ayu theme -local-storage: { - "rustdoc-theme": "ayu", - "rustdoc-preferred-dark-theme": "ayu", - "rustdoc-use-system-theme": "false", -} +local-storage: {"rustdoc-theme": "ayu"} reload: // Waiting for the search results to appear... @@ -47,11 +43,7 @@ assert-css: ( ) // Dark theme -local-storage: { - "rustdoc-theme": "dark", - "rustdoc-preferred-dark-theme": "dark", - "rustdoc-use-system-theme": "false", -} +local-storage: {"rustdoc-theme": "dark"} reload: // Waiting for the search results to appear... @@ -89,7 +81,7 @@ assert-css: ( ) // Light theme -local-storage: {"rustdoc-theme": "light", "rustdoc-use-system-theme": "false"} +local-storage: {"rustdoc-theme": "light"} reload: // Waiting for the search results to appear... @@ -130,11 +122,7 @@ assert-css: ( goto: file://|DOC_PATH|/test_docs/index.html // We set the theme so we're sure that the correct values will be used, whatever the computer // this test is running on. -local-storage: { - "rustdoc-theme": "dark", - "rustdoc-preferred-dark-theme": "dark", - "rustdoc-use-system-theme": "false", -} +local-storage: {"rustdoc-theme": "dark"} // If the text isn't displayed, the browser doesn't compute color style correctly... show-text: true // We reload the page so the local storage settings are being used. diff --git a/src/test/rustdoc-gui/settings.goml b/src/test/rustdoc-gui/settings.goml index d9cf5ee66140f..8d6e14d652a16 100644 --- a/src/test/rustdoc-gui/settings.goml +++ b/src/test/rustdoc-gui/settings.goml @@ -30,7 +30,7 @@ wait-for: "#alternative-display #search" assert: "#main-content.hidden" // Now let's check the content of the settings menu. -local-storage: {"rustdoc-theme": "dark", "rustdoc-use-system-theme": "false"} +local-storage: {"rustdoc-theme": "dark"} reload: click: "#settings-menu" wait-for: "#settings" diff --git a/src/test/rustdoc-gui/sidebar-mobile.goml b/src/test/rustdoc-gui/sidebar-mobile.goml index 033c65783498f..0b42b34101fba 100644 --- a/src/test/rustdoc-gui/sidebar-mobile.goml +++ b/src/test/rustdoc-gui/sidebar-mobile.goml @@ -42,21 +42,21 @@ scroll-to: ".block.keyword li:nth-child(1)" compare-elements-position-near: (".block.keyword li:nth-child(1)", ".mobile-topbar", {"y": 543}) // Now checking the background color of the sidebar. -local-storage: {"rustdoc-use-system-theme": "false", "rustdoc-theme": "dark"} +local-storage: {"rustdoc-theme": "dark"} reload: // Open the sidebar menu. click: ".sidebar-menu-toggle" assert-css: (".sidebar", {"background-color": "rgb(80, 80, 80)"}) -local-storage: {"rustdoc-use-system-theme": "false", "rustdoc-theme": "ayu"} +local-storage: {"rustdoc-theme": "ayu"} reload: // Open the sidebar menu. click: ".sidebar-menu-toggle" assert-css: (".sidebar", {"background-color": "rgb(20, 25, 31)"}) -local-storage: {"rustdoc-use-system-theme": "false", "rustdoc-theme": "light"} +local-storage: {"rustdoc-theme": "light"} reload: // Open the sidebar menu. diff --git a/src/test/rustdoc-gui/sidebar-source-code-display.goml b/src/test/rustdoc-gui/sidebar-source-code-display.goml index e4662a10ed5da..0c8433b11ff36 100644 --- a/src/test/rustdoc-gui/sidebar-source-code-display.goml +++ b/src/test/rustdoc-gui/sidebar-source-code-display.goml @@ -33,7 +33,7 @@ assert-local-storage: {"rustdoc-source-sidebar-show": "true"} show-text: true // First we start with the light theme. -local-storage: {"rustdoc-theme": "light", "rustdoc-use-system-theme": "false"} +local-storage: {"rustdoc-theme": "light"} reload: // Waiting for the sidebar to be displayed... wait-for-css: ("#sidebar-toggle", {"visibility": "visible", "opacity": 1}) @@ -88,7 +88,7 @@ assert-css: ( ) // Now with the dark theme. -local-storage: {"rustdoc-theme": "dark", "rustdoc-use-system-theme": "false"} +local-storage: {"rustdoc-theme": "dark"} reload: // Waiting for the sidebar to be displayed... wait-for-css: ("#sidebar-toggle", {"visibility": "visible", "opacity": 1}) @@ -143,7 +143,7 @@ assert-css: ( ) // And finally with the ayu theme. -local-storage: {"rustdoc-theme": "ayu", "rustdoc-use-system-theme": "false"} +local-storage: {"rustdoc-theme": "ayu"} reload: // Waiting for the sidebar to be displayed... wait-for-css: ("#sidebar-toggle", {"visibility": "visible", "opacity": 1}) diff --git a/src/test/rustdoc-gui/theme-change.goml b/src/test/rustdoc-gui/theme-change.goml index fb1c37ae68e74..bed507ef271f1 100644 --- a/src/test/rustdoc-gui/theme-change.goml +++ b/src/test/rustdoc-gui/theme-change.goml @@ -1,6 +1,6 @@ // Ensures that the theme change is working as expected. goto: file://|DOC_PATH|/test_docs/index.html -local-storage: {"rustdoc-use-system-theme": "false", "rustdoc-theme": "dark"} +local-storage: {"rustdoc-theme": "dark"} reload: click: "#settings-menu" wait-for: "#theme-ayu" diff --git a/src/test/rustdoc-gui/theme-in-history.goml b/src/test/rustdoc-gui/theme-in-history.goml index f576ced1c6208..7ebf5609fd565 100644 --- a/src/test/rustdoc-gui/theme-in-history.goml +++ b/src/test/rustdoc-gui/theme-in-history.goml @@ -1,11 +1,7 @@ // Ensures that the theme is working when going back in history. goto: file://|DOC_PATH|/test_docs/index.html // Set the theme to dark. -local-storage: { - "rustdoc-theme": "dark", - "rustdoc-preferred-dark-theme": "dark", - "rustdoc-use-system-theme": "false", -} +local-storage: { "rustdoc-theme": "dark" } // We reload the page so the local storage settings are being used. reload: assert-css: ("body", { "background-color": "rgb(53, 53, 53)" }) From 7153299ad96e0d8de52e3181489f6426f24d4552 Mon Sep 17 00:00:00 2001 From: Guillaume Gomez Date: Tue, 12 Jul 2022 16:20:44 +0200 Subject: [PATCH 3/8] Add test for new system-theme setting --- src/librustdoc/html/static/js/settings.js | 2 +- src/test/rustdoc-gui/settings.goml | 14 +++++++------- 2 files changed, 8 insertions(+), 8 deletions(-) diff --git a/src/librustdoc/html/static/js/settings.js b/src/librustdoc/html/static/js/settings.js index 97a87d237bce6..1308186c9f112 100644 --- a/src/librustdoc/html/static/js/settings.js +++ b/src/librustdoc/html/static/js/settings.js @@ -150,7 +150,7 @@ { "name": "Theme", "js_name": "theme", - "default": "", + "default": "system-preference", "options": themes.concat("system preference"), }, { diff --git a/src/test/rustdoc-gui/settings.goml b/src/test/rustdoc-gui/settings.goml index 8d6e14d652a16..deeabcd29007f 100644 --- a/src/test/rustdoc-gui/settings.goml +++ b/src/test/rustdoc-gui/settings.goml @@ -35,9 +35,8 @@ reload: click: "#settings-menu" wait-for: "#settings" -// We check that the "Use system theme" is disabled. -assert-property: ("#use-system-theme", {"checked": "false"}) -assert: "//*[@class='setting-line']//span[text()='Use system theme']" +// We check that the current theme is not "system theme" is disabled. +assert-property: ("#theme-system-preference", {"checked": "false"}) // Meaning that only the "theme" menu is showing up. assert: ".setting-line:not(.hidden) #theme" assert: ".setting-line.hidden #preferred-dark-theme" @@ -105,13 +104,14 @@ assert-css: ( }, ) -// We now switch the display. -click: "#use-system-theme" +// We now select the "system preference" theme. +click: "#theme-system-preference" +// Checking its text. +assert-text: ("#theme-system-preference + span", "system preference") // Wait for the hidden element to show up. wait-for: ".setting-line:not(.hidden) #preferred-dark-theme" assert: ".setting-line:not(.hidden) #preferred-light-theme" -// Check that the theme picking is hidden. -assert: ".setting-line.hidden #theme" +assert-local-storage: {"rustdoc-theme": "system-preference"} // We check their text as well. assert-text: ("#preferred-dark-theme .setting-name", "Preferred dark theme") From ad61dc91b4cf59121d6fa684259f9060b32d7301 Mon Sep 17 00:00:00 2001 From: Guillaume Gomez Date: Thu, 14 Jul 2022 20:41:55 +0200 Subject: [PATCH 4/8] Check that the default theme is "system theme" --- src/test/rustdoc-gui/theme-change.goml | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/src/test/rustdoc-gui/theme-change.goml b/src/test/rustdoc-gui/theme-change.goml index bed507ef271f1..c889d099b1ac8 100644 --- a/src/test/rustdoc-gui/theme-change.goml +++ b/src/test/rustdoc-gui/theme-change.goml @@ -1,9 +1,12 @@ // Ensures that the theme change is working as expected. goto: file://|DOC_PATH|/test_docs/index.html -local-storage: {"rustdoc-theme": "dark"} reload: click: "#settings-menu" wait-for: "#theme-ayu" + +// First, we check that the default theme is "system theme". +assert-property: ("#theme-system-preference", {"checked": "true"}) + click: "#theme-ayu" // should be the ayu theme so let's check the color. wait-for-css: ("body", { "background-color": "rgb(15, 20, 25)" }) From 74c09b4d3e403cd0ed28de58a8517ddc5243a265 Mon Sep 17 00:00:00 2001 From: Guillaume Gomez Date: Tue, 19 Jul 2022 17:31:09 +0200 Subject: [PATCH 5/8] Make theme setting work with previous versions --- src/librustdoc/html/static/js/storage.js | 21 ++++++++++++++------- 1 file changed, 14 insertions(+), 7 deletions(-) diff --git a/src/librustdoc/html/static/js/storage.js b/src/librustdoc/html/static/js/storage.js index 9e27a238f0df9..b1d65acd3b33c 100644 --- a/src/librustdoc/html/static/js/storage.js +++ b/src/librustdoc/html/static/js/storage.js @@ -43,11 +43,18 @@ function getSettingValue(settingName) { } function isUsingSystemTheme() { - const current = getSettingValue("theme"); + const current = getTheme(); return current === null || current === "system-preference"; } -const localStoredTheme = getSettingValue("theme"); +function getTheme() { + const current = getSettingValue("theme2"); + if (current === null) { + // We try to get what's being used in the previous version. + return getSettingValue("theme"); + } + return current; +} const savedHref = []; @@ -200,7 +207,7 @@ const updateSystemTheme = (function() { // the user disables "use-system-theme" and reloads the page or // navigates to another page } else { - use(getSettingValue("theme"), true); + use(getTheme(), true); } } @@ -215,7 +222,7 @@ function switchToSavedTheme() { switchTheme( window.currentTheme, window.mainTheme, - getSettingValue("theme") || "light", + getTheme() || "light", false ); } @@ -223,10 +230,10 @@ function switchToSavedTheme() { if (isUsingSystemTheme() && window.matchMedia) { // update the preferred dark theme if the user is already using a dark theme // See https://github.com/rust-lang/rust/pull/77809#issuecomment-707875732 - if (getSettingValue("theme") === null + if (getTheme() === null && getSettingValue("preferred-dark-theme") === null - && darkThemes.indexOf(localStoredTheme) >= 0) { - updateLocalStorage("preferred-dark-theme", localStoredTheme); + && darkThemes.indexOf(getTheme()) >= 0) { + updateLocalStorage("preferred-dark-theme", getTheme()); } // call the function to initialize the theme at least once! From d7bf0512c22c02ffba544c1c02f505ffb10817c5 Mon Sep 17 00:00:00 2001 From: Guillaume Gomez Date: Tue, 19 Jul 2022 17:31:32 +0200 Subject: [PATCH 6/8] Remove dead code --- src/librustdoc/html/static/js/storage.js | 9 --------- 1 file changed, 9 deletions(-) diff --git a/src/librustdoc/html/static/js/storage.js b/src/librustdoc/html/static/js/storage.js index b1d65acd3b33c..1326ad9661dce 100644 --- a/src/librustdoc/html/static/js/storage.js +++ b/src/librustdoc/html/static/js/storage.js @@ -5,7 +5,6 @@ // the page, so we don't see major layout changes during the load of the page. "use strict"; -const darkThemes = ["dark", "ayu"]; window.currentTheme = document.getElementById("themeStyle"); window.mainTheme = document.getElementById("mainThemeStyle"); @@ -228,14 +227,6 @@ function switchToSavedTheme() { } if (isUsingSystemTheme() && window.matchMedia) { - // update the preferred dark theme if the user is already using a dark theme - // See https://github.com/rust-lang/rust/pull/77809#issuecomment-707875732 - if (getTheme() === null - && getSettingValue("preferred-dark-theme") === null - && darkThemes.indexOf(getTheme()) >= 0) { - updateLocalStorage("preferred-dark-theme", getTheme()); - } - // call the function to initialize the theme at least once! updateSystemTheme(); } else { From 87e9dc3d53567cb4fcca4130006339d8c5244f10 Mon Sep 17 00:00:00 2001 From: Guillaume Gomez Date: Thu, 28 Jul 2022 17:01:00 +0200 Subject: [PATCH 7/8] Update "rustdoc-theme" setting name to "rustdoc-theme2" --- src/librustdoc/html/static/js/settings.js | 17 +++++++++++++---- src/librustdoc/html/static/js/storage.js | 3 ++- src/test/rustdoc-gui/anchors.goml | 6 +++--- src/test/rustdoc-gui/code-color.goml | 6 +++--- src/test/rustdoc-gui/docblock-details.goml | 2 +- src/test/rustdoc-gui/headers-color.goml | 6 +++--- src/test/rustdoc-gui/headings.goml | 12 ++++++------ .../rustdoc-gui/jump-to-def-background.goml | 6 +++--- src/test/rustdoc-gui/pocket-menu.goml | 6 +++--- src/test/rustdoc-gui/rust-logo.goml | 12 ++++++------ src/test/rustdoc-gui/search-filter.goml | 2 +- src/test/rustdoc-gui/search-reexport.goml | 2 +- src/test/rustdoc-gui/search-result-color.goml | 8 ++++---- src/test/rustdoc-gui/settings.goml | 4 ++-- src/test/rustdoc-gui/sidebar-mobile.goml | 6 +++--- .../sidebar-source-code-display.goml | 6 +++--- src/test/rustdoc-gui/sidebar.goml | 2 +- src/test/rustdoc-gui/theme-change.goml | 12 ++++++------ src/test/rustdoc-gui/theme-in-history.goml | 8 ++++---- 19 files changed, 68 insertions(+), 58 deletions(-) diff --git a/src/librustdoc/html/static/js/settings.js b/src/librustdoc/html/static/js/settings.js index 1308186c9f112..d3f61062d97a6 100644 --- a/src/librustdoc/html/static/js/settings.js +++ b/src/librustdoc/html/static/js/settings.js @@ -1,7 +1,7 @@ // Local js definitions: /* global getSettingValue, getVirtualKey, updateLocalStorage, updateSystemTheme */ /* global addClass, removeClass, onEach, onEachLazy, blurHandler, elemIsInParent */ -/* global MAIN_ID, getVar, getSettingsButton, isUsingSystemTheme */ +/* global MAIN_ID, getVar, getSettingsButton, isUsingSystemTheme, CURRENT_THEME_SETTING_VERSION */ "use strict"; @@ -12,7 +12,7 @@ updateLocalStorage(settingName, value); switch (settingName) { - case "theme": + case `theme${CURRENT_THEME_SETTING_VERSION}`: case "preferred-dark-theme": case "preferred-light-theme": updateSystemTheme(); @@ -92,6 +92,13 @@ }); } + function getOr(obj, property, or) { + if (obj[property] !== undefined) { + return obj[property]; + } + return or; + } + /** * This function builds the sections inside the "settings page". It takes a `settings` list * as argument which describes each setting and how to render it. It returns a string @@ -107,6 +114,7 @@ for (const setting of settings) { output += "
"; const js_data_name = setting["js_name"]; + const js_data_version = getOr(setting, "js_name_version", ""); const setting_name = setting["name"]; if (setting["options"] !== undefined) { @@ -119,8 +127,8 @@ const checked = optionAttr === setting["default"] ? " checked" : ""; output += ``; }); @@ -150,6 +158,7 @@ { "name": "Theme", "js_name": "theme", + "js_name_version": CURRENT_THEME_SETTING_VERSION, "default": "system-preference", "options": themes.concat("system preference"), }, diff --git a/src/librustdoc/html/static/js/storage.js b/src/librustdoc/html/static/js/storage.js index 1326ad9661dce..44ebb1ede5cb6 100644 --- a/src/librustdoc/html/static/js/storage.js +++ b/src/librustdoc/html/static/js/storage.js @@ -12,6 +12,7 @@ window.mainTheme = document.getElementById("mainThemeStyle"); // If you update this line, then you also need to update the two media queries with the same // warning in rustdoc.css window.RUSTDOC_MOBILE_BREAKPOINT = 701; +const CURRENT_THEME_SETTING_VERSION = "2"; const settingsDataset = (function() { const settingsElement = document.getElementById("default-settings"); @@ -47,7 +48,7 @@ function isUsingSystemTheme() { } function getTheme() { - const current = getSettingValue("theme2"); + const current = getSettingValue(`theme${CURRENT_THEME_SETTING_VERSION}`); if (current === null) { // We try to get what's being used in the previous version. return getSettingValue("theme"); diff --git a/src/test/rustdoc-gui/anchors.goml b/src/test/rustdoc-gui/anchors.goml index c3a0ff9ffe6aa..46771b5b2ac2c 100644 --- a/src/test/rustdoc-gui/anchors.goml +++ b/src/test/rustdoc-gui/anchors.goml @@ -5,7 +5,7 @@ goto: file://|DOC_PATH|/staged_api/struct.Foo.html show-text: true // Set the theme to light. -local-storage: {"rustdoc-theme": "light"} +local-storage: {"rustdoc-theme2": "light"} // We reload the page so the local storage settings are being used. reload: @@ -56,7 +56,7 @@ assert-css: ("#title-for-struct-impl-item-doc", {"margin-left": "0px"}) // // We do the same checks with the dark theme now. // -local-storage: {"rustdoc-theme": "dark", "rustdoc-use-system-theme": "false"} +local-storage: {"rustdoc-theme2": "dark"} goto: file://|DOC_PATH|/staged_api/struct.Foo.html assert-css: ("#toggle-all-docs", {"color": "rgb(221, 221, 221)"}) @@ -106,7 +106,7 @@ assert-css: ("#title-for-struct-impl-item-doc", {"margin-left": "0px"}) // // We do the same checks with the ayu theme now. // -local-storage: {"rustdoc-theme": "ayu", "rustdoc-use-system-theme": "false"} +local-storage: {"rustdoc-theme2": "ayu"} goto: file://|DOC_PATH|/staged_api/struct.Foo.html assert-css: ("#toggle-all-docs", {"color": "rgb(197, 197, 197)"}) diff --git a/src/test/rustdoc-gui/code-color.goml b/src/test/rustdoc-gui/code-color.goml index e288b59012a56..eb7b1dd0dbce5 100644 --- a/src/test/rustdoc-gui/code-color.goml +++ b/src/test/rustdoc-gui/code-color.goml @@ -6,7 +6,7 @@ goto: file://|DOC_PATH|/test_docs/fn.foo.html // If the text isn't displayed, the browser doesn't compute color style correctly... show-text: true // Set the theme to dark. -local-storage: {"rustdoc-theme": "dark"} +local-storage: {"rustdoc-theme2": "dark"} // We reload the page so the local storage settings are being used. reload: @@ -14,7 +14,7 @@ assert-css: (".docblock pre > code", {"color": "rgb(221, 221, 221)"}, ALL) assert-css: (".docblock > p > code", {"color": "rgb(221, 221, 221)"}, ALL) // Set the theme to ayu. -local-storage: {"rustdoc-theme": "ayu"} +local-storage: {"rustdoc-theme2": "ayu"} // We reload the page so the local storage settings are being used. reload: @@ -22,7 +22,7 @@ assert-css: (".docblock pre > code", {"color": "rgb(230, 225, 207)"}, ALL) assert-css: (".docblock > p > code", {"color": "rgb(255, 180, 84)"}, ALL) // Set the theme to light. -local-storage: {"rustdoc-theme": "light"} +local-storage: {"rustdoc-theme2": "light"} // We reload the page so the local storage settings are being used. reload: diff --git a/src/test/rustdoc-gui/docblock-details.goml b/src/test/rustdoc-gui/docblock-details.goml index 0116ce150d980..dee5ebd24f448 100644 --- a/src/test/rustdoc-gui/docblock-details.goml +++ b/src/test/rustdoc-gui/docblock-details.goml @@ -1,7 +1,7 @@ // This ensures that the `
`/`` elements are displayed as expected. goto: file://|DOC_PATH|/test_docs/details/struct.Details.html show-text: true -local-storage: {"rustdoc-theme": "dark"} +local-storage: {"rustdoc-theme2": "dark"} reload: // We first check that the headers in the `.top-doc` doc block still have their diff --git a/src/test/rustdoc-gui/headers-color.goml b/src/test/rustdoc-gui/headers-color.goml index 3d076aa76d415..e17dd7717e3b8 100644 --- a/src/test/rustdoc-gui/headers-color.goml +++ b/src/test/rustdoc-gui/headers-color.goml @@ -5,7 +5,7 @@ goto: file://|DOC_PATH|/test_docs/struct.Foo.html show-text: true // Ayu theme -local-storage: {"rustdoc-theme": "ayu"} +local-storage: {"rustdoc-theme2": "ayu"} reload: assert-css: ( @@ -40,7 +40,7 @@ goto: file://|DOC_PATH|/test_docs/struct.HeavilyDocumentedStruct.html assert-css: (".docblock > :not(p) > a", {"color": "rgb(57, 175, 215)"}, ALL) // Dark theme -local-storage: {"rustdoc-theme": "dark"} +local-storage: {"rustdoc-theme2": "dark"} goto: file://|DOC_PATH|/test_docs/struct.Foo.html assert-css: ( @@ -75,7 +75,7 @@ goto: file://|DOC_PATH|/test_docs/struct.HeavilyDocumentedStruct.html assert-css: (".docblock > :not(p) > a", {"color": "rgb(210, 153, 29)"}, ALL) // Light theme -local-storage: {"rustdoc-theme": "light"} +local-storage: {"rustdoc-theme2": "light"} reload: goto: file://|DOC_PATH|/test_docs/struct.Foo.html diff --git a/src/test/rustdoc-gui/headings.goml b/src/test/rustdoc-gui/headings.goml index 32b5d9d64298e..8658381b535a6 100644 --- a/src/test/rustdoc-gui/headings.goml +++ b/src/test/rustdoc-gui/headings.goml @@ -152,7 +152,7 @@ assert-css: ("h3#top-doc-prose-sub-heading", {"border-bottom-width": "1px"}) // Checking colors now. show-text: true -local-storage: {"rustdoc-theme": "light"} +local-storage: {"rustdoc-theme2": "light"} goto: file://|DOC_PATH|/test_docs/struct.HeavilyDocumentedStruct.html assert-css: ( ".top-doc .docblock h2", @@ -183,7 +183,7 @@ assert-css: ( {"color": "rgb(0, 0, 0)", "border-bottom": "0px none rgb(221, 221, 221)"}, ) -local-storage: {"rustdoc-theme": "dark"} +local-storage: {"rustdoc-theme2": "dark"} reload: assert-css: ( ".top-doc .docblock h2", @@ -214,7 +214,7 @@ assert-css: ( {"color": "rgb(221, 221, 221)", "border-bottom": "0px none rgb(210, 210, 210)"}, ) -local-storage: {"rustdoc-theme": "ayu"} +local-storage: {"rustdoc-theme2": "ayu"} reload: assert-css: ( ".top-doc .docblock h2", @@ -245,14 +245,14 @@ assert-css: ( {"color": "rgb(197, 197, 197)", "border-bottom": "0px none rgb(92, 103, 115)"}, ) -local-storage: {"rustdoc-theme": "light"} +local-storage: {"rustdoc-theme2": "light"} goto: file://|DOC_PATH|/staged_api/struct.Foo.html assert-css: (".since", {"color": "rgb(128, 128, 128)"}, ALL) -local-storage: {"rustdoc-theme": "dark"} +local-storage: {"rustdoc-theme2": "dark"} reload: assert-css: (".since", {"color": "rgb(128, 128, 128)"}, ALL) -local-storage: {"rustdoc-theme": "ayu"} +local-storage: {"rustdoc-theme2": "ayu"} reload: assert-css: (".since", {"color": "rgb(128, 128, 128)"}, ALL) diff --git a/src/test/rustdoc-gui/jump-to-def-background.goml b/src/test/rustdoc-gui/jump-to-def-background.goml index b85fa2f05857c..8bb2ccb69bfe6 100644 --- a/src/test/rustdoc-gui/jump-to-def-background.goml +++ b/src/test/rustdoc-gui/jump-to-def-background.goml @@ -2,7 +2,7 @@ goto: file://|DOC_PATH|/src/link_to_definition/lib.rs.html // Set the theme to dark. -local-storage: {"rustdoc-theme": "dark"} +local-storage: {"rustdoc-theme2": "dark"} // We reload the page so the local storage settings are being used. reload: @@ -13,7 +13,7 @@ assert-css: ( ) // Set the theme to ayu. -local-storage: {"rustdoc-theme": "ayu"} +local-storage: {"rustdoc-theme2": "ayu"} // We reload the page so the local storage settings are being used. reload: @@ -24,7 +24,7 @@ assert-css: ( ) // Set the theme to light. -local-storage: {"rustdoc-theme": "light"} +local-storage: {"rustdoc-theme2": "light"} // We reload the page so the local storage settings are being used. reload: diff --git a/src/test/rustdoc-gui/pocket-menu.goml b/src/test/rustdoc-gui/pocket-menu.goml index 27e288a96a057..6ef391402c641 100644 --- a/src/test/rustdoc-gui/pocket-menu.goml +++ b/src/test/rustdoc-gui/pocket-menu.goml @@ -32,7 +32,7 @@ assert-css: ("#settings-menu .popover", {"display": "none"}) // We check the borders color now: // Ayu theme -local-storage: {"rustdoc-theme": "ayu"} +local-storage: {"rustdoc-theme2": "ayu"} reload: click: "#help-button" @@ -44,7 +44,7 @@ compare-elements-css: ("#help-button .popover", "#help-button .top", ["border-co compare-elements-css: ("#help-button .popover", "#help-button .bottom", ["border-color"]) // Dark theme -local-storage: {"rustdoc-theme": "dark"} +local-storage: {"rustdoc-theme2": "dark"} reload: click: "#help-button" @@ -56,7 +56,7 @@ compare-elements-css: ("#help-button .popover", "#help-button .top", ["border-co compare-elements-css: ("#help-button .popover", "#help-button .bottom", ["border-color"]) // Light theme -local-storage: {"rustdoc-theme": "light"} +local-storage: {"rustdoc-theme2": "light"} reload: click: "#help-button" diff --git a/src/test/rustdoc-gui/rust-logo.goml b/src/test/rustdoc-gui/rust-logo.goml index c4ab0e2e4db0b..d4db101383af5 100644 --- a/src/test/rustdoc-gui/rust-logo.goml +++ b/src/test/rustdoc-gui/rust-logo.goml @@ -2,7 +2,7 @@ goto: file://|DOC_PATH|/test_docs/index.html // First we start with the dark theme. -local-storage: {"rustdoc-theme": "dark"} +local-storage: {"rustdoc-theme2": "dark"} reload: assert-css: ( @@ -13,7 +13,7 @@ assert-css: ( // In the source view page now. goto: file://|DOC_PATH|/src/test_docs/lib.rs.html -local-storage: {"rustdoc-theme": "dark"} +local-storage: {"rustdoc-theme2": "dark"} reload: assert-css: ( @@ -22,7 +22,7 @@ assert-css: ( ) // Then with the ayu theme. -local-storage: {"rustdoc-theme": "ayu"} +local-storage: {"rustdoc-theme2": "ayu"} reload: assert-css: ( @@ -33,7 +33,7 @@ assert-css: ( // In the source view page now. goto: file://|DOC_PATH|/src/test_docs/lib.rs.html -local-storage: {"rustdoc-theme": "ayu"} +local-storage: {"rustdoc-theme2": "ayu"} reload: assert-css: ( @@ -42,7 +42,7 @@ assert-css: ( ) // And finally with the light theme. -local-storage: {"rustdoc-theme": "light"} +local-storage: {"rustdoc-theme2": "light"} reload: assert-css: ( @@ -53,7 +53,7 @@ assert-css: ( // In the source view page now. goto: file://|DOC_PATH|/src/test_docs/lib.rs.html -local-storage: {"rustdoc-theme": "light"} +local-storage: {"rustdoc-theme2": "light"} reload: assert-css: ( diff --git a/src/test/rustdoc-gui/search-filter.goml b/src/test/rustdoc-gui/search-filter.goml index 6699da71ec56a..e18e74e7635f8 100644 --- a/src/test/rustdoc-gui/search-filter.goml +++ b/src/test/rustdoc-gui/search-filter.goml @@ -53,7 +53,7 @@ assert-text: (".search-results-title", "Results in all crates", STARTS_WITH) // Checking the display of the crate filter. // We start with the light theme. -local-storage: {"rustdoc-theme": "light"} +local-storage: {"rustdoc-theme2": "light"} reload: timeout: 2000 diff --git a/src/test/rustdoc-gui/search-reexport.goml b/src/test/rustdoc-gui/search-reexport.goml index 1c6c81b587240..903db2df9aa8f 100644 --- a/src/test/rustdoc-gui/search-reexport.goml +++ b/src/test/rustdoc-gui/search-reexport.goml @@ -1,7 +1,7 @@ // Checks that the reexports are present in the search index, can have // doc aliases and are highligted when their ID is the hash of the page. goto: file://|DOC_PATH|/test_docs/index.html -local-storage: {"rustdoc-theme": "dark"} +local-storage: {"rustdoc-theme2": "dark"} reload: // First we check that the reexport has the correct ID and no background color. assert-text: ("//*[@id='reexport.TheStdReexport']", "pub use ::std as TheStdReexport;") diff --git a/src/test/rustdoc-gui/search-result-color.goml b/src/test/rustdoc-gui/search-result-color.goml index 09eb60ddec2af..219b6c2f2a515 100644 --- a/src/test/rustdoc-gui/search-result-color.goml +++ b/src/test/rustdoc-gui/search-result-color.goml @@ -5,7 +5,7 @@ goto: file://|DOC_PATH|/test_docs/index.html?search=coo show-text: true // Ayu theme -local-storage: {"rustdoc-theme": "ayu"} +local-storage: {"rustdoc-theme2": "ayu"} reload: // Waiting for the search results to appear... @@ -43,7 +43,7 @@ assert-css: ( ) // Dark theme -local-storage: {"rustdoc-theme": "dark"} +local-storage: {"rustdoc-theme2": "dark"} reload: // Waiting for the search results to appear... @@ -81,7 +81,7 @@ assert-css: ( ) // Light theme -local-storage: {"rustdoc-theme": "light"} +local-storage: {"rustdoc-theme2": "light"} reload: // Waiting for the search results to appear... @@ -122,7 +122,7 @@ assert-css: ( goto: file://|DOC_PATH|/test_docs/index.html // We set the theme so we're sure that the correct values will be used, whatever the computer // this test is running on. -local-storage: {"rustdoc-theme": "dark"} +local-storage: {"rustdoc-theme2": "dark"} // If the text isn't displayed, the browser doesn't compute color style correctly... show-text: true // We reload the page so the local storage settings are being used. diff --git a/src/test/rustdoc-gui/settings.goml b/src/test/rustdoc-gui/settings.goml index deeabcd29007f..e330b9b3b6e32 100644 --- a/src/test/rustdoc-gui/settings.goml +++ b/src/test/rustdoc-gui/settings.goml @@ -30,7 +30,7 @@ wait-for: "#alternative-display #search" assert: "#main-content.hidden" // Now let's check the content of the settings menu. -local-storage: {"rustdoc-theme": "dark"} +local-storage: {"rustdoc-theme2": "dark"} reload: click: "#settings-menu" wait-for: "#settings" @@ -111,7 +111,7 @@ assert-text: ("#theme-system-preference + span", "system preference") // Wait for the hidden element to show up. wait-for: ".setting-line:not(.hidden) #preferred-dark-theme" assert: ".setting-line:not(.hidden) #preferred-light-theme" -assert-local-storage: {"rustdoc-theme": "system-preference"} +assert-local-storage: {"rustdoc-theme2": "system-preference"} // We check their text as well. assert-text: ("#preferred-dark-theme .setting-name", "Preferred dark theme") diff --git a/src/test/rustdoc-gui/sidebar-mobile.goml b/src/test/rustdoc-gui/sidebar-mobile.goml index 0b42b34101fba..c70639de8b078 100644 --- a/src/test/rustdoc-gui/sidebar-mobile.goml +++ b/src/test/rustdoc-gui/sidebar-mobile.goml @@ -42,21 +42,21 @@ scroll-to: ".block.keyword li:nth-child(1)" compare-elements-position-near: (".block.keyword li:nth-child(1)", ".mobile-topbar", {"y": 543}) // Now checking the background color of the sidebar. -local-storage: {"rustdoc-theme": "dark"} +local-storage: {"rustdoc-theme2": "dark"} reload: // Open the sidebar menu. click: ".sidebar-menu-toggle" assert-css: (".sidebar", {"background-color": "rgb(80, 80, 80)"}) -local-storage: {"rustdoc-theme": "ayu"} +local-storage: {"rustdoc-theme2": "ayu"} reload: // Open the sidebar menu. click: ".sidebar-menu-toggle" assert-css: (".sidebar", {"background-color": "rgb(20, 25, 31)"}) -local-storage: {"rustdoc-theme": "light"} +local-storage: {"rustdoc-theme2": "light"} reload: // Open the sidebar menu. diff --git a/src/test/rustdoc-gui/sidebar-source-code-display.goml b/src/test/rustdoc-gui/sidebar-source-code-display.goml index 0c8433b11ff36..a699d124e05c7 100644 --- a/src/test/rustdoc-gui/sidebar-source-code-display.goml +++ b/src/test/rustdoc-gui/sidebar-source-code-display.goml @@ -33,7 +33,7 @@ assert-local-storage: {"rustdoc-source-sidebar-show": "true"} show-text: true // First we start with the light theme. -local-storage: {"rustdoc-theme": "light"} +local-storage: {"rustdoc-theme2": "light"} reload: // Waiting for the sidebar to be displayed... wait-for-css: ("#sidebar-toggle", {"visibility": "visible", "opacity": 1}) @@ -88,7 +88,7 @@ assert-css: ( ) // Now with the dark theme. -local-storage: {"rustdoc-theme": "dark"} +local-storage: {"rustdoc-theme2": "dark"} reload: // Waiting for the sidebar to be displayed... wait-for-css: ("#sidebar-toggle", {"visibility": "visible", "opacity": 1}) @@ -143,7 +143,7 @@ assert-css: ( ) // And finally with the ayu theme. -local-storage: {"rustdoc-theme": "ayu"} +local-storage: {"rustdoc-theme2": "ayu"} reload: // Waiting for the sidebar to be displayed... wait-for-css: ("#sidebar-toggle", {"visibility": "visible", "opacity": 1}) diff --git a/src/test/rustdoc-gui/sidebar.goml b/src/test/rustdoc-gui/sidebar.goml index 32fe3334f3644..f800b886aecc7 100644 --- a/src/test/rustdoc-gui/sidebar.goml +++ b/src/test/rustdoc-gui/sidebar.goml @@ -1,7 +1,7 @@ // Checks multiple things on the sidebar display (width of its elements, colors, etc). goto: file://|DOC_PATH|/test_docs/index.html show-text: true -local-storage: {"rustdoc-theme": "light"} +local-storage: {"rustdoc-theme2": "light"} // We reload the page so the local storage settings are being used. reload: diff --git a/src/test/rustdoc-gui/theme-change.goml b/src/test/rustdoc-gui/theme-change.goml index c889d099b1ac8..4e2bc16b01804 100644 --- a/src/test/rustdoc-gui/theme-change.goml +++ b/src/test/rustdoc-gui/theme-change.goml @@ -10,26 +10,26 @@ assert-property: ("#theme-system-preference", {"checked": "true"}) click: "#theme-ayu" // should be the ayu theme so let's check the color. wait-for-css: ("body", { "background-color": "rgb(15, 20, 25)" }) -assert-local-storage: { "rustdoc-theme": "ayu" } +assert-local-storage: { "rustdoc-theme2": "ayu" } click: "#theme-light" // should be the light theme so let's check the color. wait-for-css: ("body", { "background-color": "rgb(255, 255, 255)" }) -assert-local-storage: { "rustdoc-theme": "light" } +assert-local-storage: { "rustdoc-theme2": "light" } click: "#theme-dark" // Should be the dark theme so let's check the color. wait-for-css: ("body", { "background-color": "rgb(53, 53, 53)" }) -assert-local-storage: { "rustdoc-theme": "dark" } +assert-local-storage: { "rustdoc-theme2": "dark" } goto: file://|DOC_PATH|/settings.html wait-for: "#settings" click: "#theme-light" wait-for-css: ("body", { "background-color": "rgb(255, 255, 255)" }) -assert-local-storage: { "rustdoc-theme": "light" } +assert-local-storage: { "rustdoc-theme2": "light" } click: "#theme-dark" wait-for-css: ("body", { "background-color": "rgb(53, 53, 53)" }) -assert-local-storage: { "rustdoc-theme": "dark" } +assert-local-storage: { "rustdoc-theme2": "dark" } click: "#theme-ayu" wait-for-css: ("body", { "background-color": "rgb(15, 20, 25)" }) -assert-local-storage: { "rustdoc-theme": "ayu" } +assert-local-storage: { "rustdoc-theme2": "ayu" } diff --git a/src/test/rustdoc-gui/theme-in-history.goml b/src/test/rustdoc-gui/theme-in-history.goml index 7ebf5609fd565..205a930cf4120 100644 --- a/src/test/rustdoc-gui/theme-in-history.goml +++ b/src/test/rustdoc-gui/theme-in-history.goml @@ -1,11 +1,11 @@ // Ensures that the theme is working when going back in history. goto: file://|DOC_PATH|/test_docs/index.html // Set the theme to dark. -local-storage: { "rustdoc-theme": "dark" } +local-storage: { "rustdoc-theme2": "dark" } // We reload the page so the local storage settings are being used. reload: assert-css: ("body", { "background-color": "rgb(53, 53, 53)" }) -assert-local-storage: { "rustdoc-theme": "dark" } +assert-local-storage: { "rustdoc-theme2": "dark" } // Now we go to the settings page. goto: file://|DOC_PATH|/settings.html @@ -13,7 +13,7 @@ wait-for: "#settings" // We change the theme to "light". click: "#theme-light" wait-for-css: ("body", { "background-color": "rgb(255, 255, 255)" }) -assert-local-storage: { "rustdoc-theme": "light" } +assert-local-storage: { "rustdoc-theme2": "light" } // We go back in history. history-go-back: @@ -21,4 +21,4 @@ history-go-back: assert-false: "#settings" // Check that the current theme is still "light". assert-css: ("body", { "background-color": "rgb(255, 255, 255)" }) -assert-local-storage: { "rustdoc-theme": "light" } +assert-local-storage: { "rustdoc-theme2": "light" } From eb277fb607d0618bc13ce6c110e598b1152ff063 Mon Sep 17 00:00:00 2001 From: Guillaume Gomez Date: Thu, 28 Jul 2022 17:03:57 +0200 Subject: [PATCH 8/8] Also get previous "system-preference" setting --- src/librustdoc/html/static/js/settings.js | 7 ++++--- src/librustdoc/html/static/js/storage.js | 25 ++++++++++++++++++++--- src/test/rustdoc-gui/settings.goml | 10 +++++++++ 3 files changed, 36 insertions(+), 6 deletions(-) diff --git a/src/librustdoc/html/static/js/settings.js b/src/librustdoc/html/static/js/settings.js index d3f61062d97a6..218f2ed1cc176 100644 --- a/src/librustdoc/html/static/js/settings.js +++ b/src/librustdoc/html/static/js/settings.js @@ -2,6 +2,7 @@ /* global getSettingValue, getVirtualKey, updateLocalStorage, updateSystemTheme */ /* global addClass, removeClass, onEach, onEachLazy, blurHandler, elemIsInParent */ /* global MAIN_ID, getVar, getSettingsButton, isUsingSystemTheme, CURRENT_THEME_SETTING_VERSION */ +/* global getTheme, getPreferredDarkTheme, getPreferredLightTheme */ "use strict"; @@ -159,19 +160,19 @@ "name": "Theme", "js_name": "theme", "js_name_version": CURRENT_THEME_SETTING_VERSION, - "default": "system-preference", + "default": getTheme(), "options": themes.concat("system preference"), }, { "name": "Preferred light theme", "js_name": "preferred-light-theme", - "default": "light", + "default": getPreferredLightTheme(), "options": themes, }, { "name": "Preferred dark theme", "js_name": "preferred-dark-theme", - "default": "dark", + "default": getPreferredDarkTheme(), "options": themes, }, { diff --git a/src/librustdoc/html/static/js/storage.js b/src/librustdoc/html/static/js/storage.js index 44ebb1ede5cb6..41fa2f729c58c 100644 --- a/src/librustdoc/html/static/js/storage.js +++ b/src/librustdoc/html/static/js/storage.js @@ -47,15 +47,34 @@ function isUsingSystemTheme() { return current === null || current === "system-preference"; } +function valueOr(value, or) { + if (value !== null) { + return value; + } + return or; +} + function getTheme() { const current = getSettingValue(`theme${CURRENT_THEME_SETTING_VERSION}`); if (current === null) { // We try to get what's being used in the previous version. - return getSettingValue("theme"); + const isUsingSystemTheme = getSettingValue("use-system-theme"); + if (isUsingSystemTheme === "true") { + return "system-preference"; + } + return valueOr(getSettingValue("theme"), "system-preference"); } return current; } +function getPreferredDarkTheme() { + return valueOr(getSettingValue("preferred-dark-theme"), "dark"); +} + +function getPreferredLightTheme() { + return valueOr(getSettingValue("preferred-light-theme"), "light"); +} + const savedHref = []; // eslint-disable-next-line no-unused-vars @@ -194,8 +213,8 @@ const updateSystemTheme = (function() { }; // maybe the user has disabled the setting in the meantime! if (isUsingSystemTheme()) { - const lightTheme = getSettingValue("preferred-light-theme") || "light"; - const darkTheme = getSettingValue("preferred-dark-theme") || "dark"; + const lightTheme = getPreferredLightTheme(); + const darkTheme = getPreferredDarkTheme(); if (mql.matches) { use(darkTheme, false); diff --git a/src/test/rustdoc-gui/settings.goml b/src/test/rustdoc-gui/settings.goml index e330b9b3b6e32..1c3c2867f6532 100644 --- a/src/test/rustdoc-gui/settings.goml +++ b/src/test/rustdoc-gui/settings.goml @@ -29,6 +29,16 @@ wait-for-css: ("#settings", {"display": "block"}) wait-for: "#alternative-display #search" assert: "#main-content.hidden" +// Checking the default values of the themes: +// * default: system +// * default preferred dark: dark +// * default preferred light: light +assert-property: ("#theme-system-preference", {"checked": "true"}) +assert-property: ("#preferred-dark-theme-dark", {"checked": "true"}) +assert-property: ("#preferred-light-theme-light", {"checked": "true"}) +assert: ".setting-line:not(.hidden) #preferred-dark-theme" +assert: ".setting-line:not(.hidden) #preferred-light-theme" + // Now let's check the content of the settings menu. local-storage: {"rustdoc-theme2": "dark"} reload: