feat: cookie storage #1450
Triggered via pull request
September 11, 2024 15:36
atinux
Status
Failure
Total duration
1m 13s
Artifacts
–
Annotations
35 errors
|
test/csr/dev.test.ts > ssr: false, dev mode > renders:
test/csr/dev.test.ts#L16
AssertionError: expected '<!DOCTYPE html><html data-capo=""><h…' to contain 'getItem(\'nuxt-color-mode\')'
- Expected
+ Received
- getItem('nuxt-color-mode')
+ <!DOCTYPE html><html data-capo=""><head><meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <title>Demo of @nuxtjs/color-mode</title>
+ <link rel="stylesheet" href="/_nuxt/@fs/Users/runner/work/color-mode/color-mode/node_modules/.pnpm/tailwindcss@3.4.10/node_modules/tailwindcss/tailwind.css">
+ <link rel="stylesheet" href="/_nuxt/assets/main.css">
+ <link rel="stylesheet" href="/_nuxt/Users/runner/work/color-mode/color-mode/node_modules/.pnpm/tailwindcss@3.4.10/node_modules/tailwindcss/tailwind.css">
+ <link rel="stylesheet" href="/_nuxt/components/ColorModePicker.vue?vue&type=style&index=0&scoped=28ab885e&lang.css">
+ <link rel="stylesheet" href="/_nuxt/layouts/default.vue?vue&type=style&index=0&lang.css">
+ <link rel="stylesheet" href="/_nuxt/components/NuxtLogo.vue?vue&type=style&index=0&scoped=70dd8bf5&lang.css">
+ <link rel="modulepreload" as="script" crossorigin href="/_nuxt/Users/runner/work/color-mode/color-mode/node_modules/.pnpm/nuxt@3.13.1_@opentelemetry+api@1.9.0_@parcel+watcher@2.4.1_@types+node@20.5.1_encoding@0.1.13_2w6lkzat2hmkdx4eohhdofbg3u/node_modules/nuxt/dist/app/entry.js">
+ <meta name="description" content="Demo of using @nuxtjs/color-mode for Nuxt, supporting dark mode and custom colors">
+ <script type="module" src="/_nuxt/@vite/client" crossorigin></script>
+ <script type="module" src="/_nuxt/Users/runner/work/color-mode/color-mode/node_modules/.pnpm/nuxt@3.13.1_@opentelemetry+api@1.9.0_@parcel+watcher@2.4.1_@types+node@20.5.1_encoding@0.1.13_2w6lkzat2hmkdx4eohhdofbg3u/node_modules/nuxt/dist/app/entry.js" crossorigin></script><script>// @ts-check
+
+ // Add dark / light detection that runs before loading Nuxt
+ (() => {
+ // Global variable minimizers
+ const w = window
+ const de = document.documentElement
+
+ const knownColorSchemes = ['dark', 'light']
+
+ const preference = getStorageValue('localStorage', 'nuxt-color-mode') || 'system'
+ let value = preference === 'system' ? getColorScheme() : preference
+ // Applied forced color mode
+ const forcedColorMode = de.getAttribute('data-color-mode-forced')
+ if (forcedColorMode) {
+ value = forcedColorMode
+ }
+
+ addColorScheme(value)
+
+ w['__NUXT_COLOR_MODE__'] = {
+ preference,
+ value,
+ getColorScheme,
+ addColorScheme,
+ removeColorScheme,
+ }
+
+ /** @param {string} value */
+ function addColorScheme(value) {
+ const className = '' + value + '-mode'
+ const dataValue = ''
+ if (de.classList) {
+ de.classList.add(className)
+ }
+ else {
+ de.className += ' ' + className
+ }
+ if (dataValue) {
+ de.setAttribute('data-' + dataValue, value)
+ }
+ }
+
+ /** @param {string} value */
+ function removeColorScheme(value) {
+ const className = '' + value + '-mode'
+ const dataValue = ''
+ if (de.classList) {
+ de.classList.remove(className)
+ }
+ else {
+ de.className = de.className.replace(new RegExp(className, 'g'), '')
+ }
+ if (dataValue) {
+ de.removeAttribute('data-' + dataValue)
+ }
+ }
+
+ /** @param {string} suffix */
+ function prefersColorScheme(suffix) {
+ return w.matchMedia('(prefers-color-scheme' + suffix + ')')
+ }
+
+ function getColorScheme() {
+ if (
+ // @ts-expect-error TS assumes matchMedia is always defined
+ w.matchMedia
+ && prefersColorScheme('').media !== 'not all') {
+ for (const colorScheme of knownColorSchemes) {
+ if (prefersColorScheme(':' + colorScheme).matches) {
+ return colorScheme
+ }
+ }
+ }
+
+ return 'light'
+ }
+ })()
+
+ // @ts-ignore
+ function getStorageValue(storageType, storageKey) {
+ switch (storageType) {
+ case 'localStorage':
+ return window.localStorage.getItem(storageKey)
+ case 'sessionStorage':
+ return window.sessionStorage.
|
|
test/csr/generate.test.ts > ssr: false, target: static, generated files > generated file:
test/csr/generate.test.ts#L29
AssertionError: expected '<!DOCTYPE html><html data-capo=""><h…' to contain 'getItem(\'nuxt-color-mode\')'
- Expected
+ Received
- getItem('nuxt-color-mode')
+ <!DOCTYPE html><html data-capo=""><head><meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <link rel="stylesheet" href="/_nuxt/entry.BeA5LUrk.css">
+ <link rel="modulepreload" as="script" crossorigin href="/_nuxt/Vx0ECAV8.js">
+ <link rel="prefetch" as="style" href="/_nuxt/default.BfERDc1H.css">
+ <link rel="prefetch" as="style" href="/_nuxt/NuxtLogo.PVoRAFLQ.css">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/D-kJAy6z.js">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/CZaMv98m.js">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/BtzTUKvL.js">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/ucgUagT9.js">
+ <link rel="prefetch" as="style" href="/_nuxt/error-404.C3xcNO5b.css">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/CzYKgudz.js">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/DUu07QiN.js">
+ <link rel="prefetch" as="style" href="/_nuxt/error-500.B_ynad8U.css">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/Civo6Oc9.js">
+ <script type="module" src="/_nuxt/Vx0ECAV8.js" crossorigin></script><script>// @ts-check
+
+ // Add dark / light detection that runs before loading Nuxt
+ (() => {
+ // Global variable minimizers
+ const w = window
+ const de = document.documentElement
+
+ const knownColorSchemes = ['dark', 'light']
+
+ const preference = getStorageValue('localStorage', 'nuxt-color-mode') || 'system'
+ let value = preference === 'system' ? getColorScheme() : preference
+ // Applied forced color mode
+ const forcedColorMode = de.getAttribute('data-color-mode-forced')
+ if (forcedColorMode) {
+ value = forcedColorMode
+ }
+
+ addColorScheme(value)
+
+ w['__NUXT_COLOR_MODE__'] = {
+ preference,
+ value,
+ getColorScheme,
+ addColorScheme,
+ removeColorScheme,
+ }
+
+ /** @param {string} value */
+ function addColorScheme(value) {
+ const className = '' + value + '-mode'
+ const dataValue = ''
+ if (de.classList) {
+ de.classList.add(className)
+ }
+ else {
+ de.className += ' ' + className
+ }
+ if (dataValue) {
+ de.setAttribute('data-' + dataValue, value)
+ }
+ }
+
+ /** @param {string} value */
+ function removeColorScheme(value) {
+ const className = '' + value + '-mode'
+ const dataValue = ''
+ if (de.classList) {
+ de.classList.remove(className)
+ }
+ else {
+ de.className = de.className.replace(new RegExp(className, 'g'), '')
+ }
+ if (dataValue) {
+ de.removeAttribute('data-' + dataValue)
+ }
+ }
+
+ /** @param {string} suffix */
+ function prefersColorScheme(suffix) {
+ return w.matchMedia('(prefers-color-scheme' + suffix + ')')
+ }
+
+ function getColorScheme() {
+ if (
+ // @ts-expect-error TS assumes matchMedia is always defined
+ w.matchMedia
+ && prefersColorScheme('').media !== 'not all') {
+ for (const colorScheme of knownColorSchemes) {
+ if (prefersColorScheme(':' + colorScheme).matches) {
+ return colorScheme
+ }
+ }
+ }
+
+ return 'light'
+ }
+ })()
+
+ // @ts-ignore
+ function getStorageValue(storageType, storageKey) {
+ switch (storageType) {
+ case 'localStorage':
+ return window.localStorage.getItem(storageKey)
+ case 'sessionStorage':
+ return window.sessionStorage.getItem(storageKey)
+ case 'cookie':
+ return getCookie(storageKey)
+ default:
+ return null
+ }
+ }
+
+ // @ts-ignore
+ function getCookie(name) {
+ const value = '; ' + window.document.cookie
+ const parts = value.split('; ' + name + '=')
+ if (parts.length === 2) {
+ return parts.pop()?.split(';').shift()
+ }
+ }</script></head><body><div id="__nuxt"></div><div id="teleports"></div><script type="application/json" data-nuxt-data="nuxt-app" da
|
|
test/csr/prod.test.ts > ssr: false, target: server, prod mode > render:
test/csr/prod.test.ts#L17
AssertionError: expected '<!DOCTYPE html><html data-capo=""><h…' to contain 'getItem(\'nuxt-color-mode\')'
- Expected
+ Received
- getItem('nuxt-color-mode')
+ <!DOCTYPE html><html data-capo=""><head><meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <link rel="stylesheet" href="/_nuxt/entry.BeA5LUrk.css">
+ <link rel="modulepreload" as="script" crossorigin href="/_nuxt/Vx0ECAV8.js">
+ <link rel="prefetch" as="style" href="/_nuxt/default.BfERDc1H.css">
+ <link rel="prefetch" as="style" href="/_nuxt/NuxtLogo.PVoRAFLQ.css">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/D-kJAy6z.js">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/CZaMv98m.js">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/BtzTUKvL.js">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/ucgUagT9.js">
+ <link rel="prefetch" as="style" href="/_nuxt/error-404.C3xcNO5b.css">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/CzYKgudz.js">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/DUu07QiN.js">
+ <link rel="prefetch" as="style" href="/_nuxt/error-500.B_ynad8U.css">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/Civo6Oc9.js">
+ <script type="module" src="/_nuxt/Vx0ECAV8.js" crossorigin></script><script>// @ts-check
+
+ // Add dark / light detection that runs before loading Nuxt
+ (() => {
+ // Global variable minimizers
+ const w = window
+ const de = document.documentElement
+
+ const knownColorSchemes = ['dark', 'light']
+
+ const preference = getStorageValue('localStorage', 'nuxt-color-mode') || 'system'
+ let value = preference === 'system' ? getColorScheme() : preference
+ // Applied forced color mode
+ const forcedColorMode = de.getAttribute('data-color-mode-forced')
+ if (forcedColorMode) {
+ value = forcedColorMode
+ }
+
+ addColorScheme(value)
+
+ w['__NUXT_COLOR_MODE__'] = {
+ preference,
+ value,
+ getColorScheme,
+ addColorScheme,
+ removeColorScheme,
+ }
+
+ /** @param {string} value */
+ function addColorScheme(value) {
+ const className = '' + value + '-mode'
+ const dataValue = ''
+ if (de.classList) {
+ de.classList.add(className)
+ }
+ else {
+ de.className += ' ' + className
+ }
+ if (dataValue) {
+ de.setAttribute('data-' + dataValue, value)
+ }
+ }
+
+ /** @param {string} value */
+ function removeColorScheme(value) {
+ const className = '' + value + '-mode'
+ const dataValue = ''
+ if (de.classList) {
+ de.classList.remove(className)
+ }
+ else {
+ de.className = de.className.replace(new RegExp(className, 'g'), '')
+ }
+ if (dataValue) {
+ de.removeAttribute('data-' + dataValue)
+ }
+ }
+
+ /** @param {string} suffix */
+ function prefersColorScheme(suffix) {
+ return w.matchMedia('(prefers-color-scheme' + suffix + ')')
+ }
+
+ function getColorScheme() {
+ if (
+ // @ts-expect-error TS assumes matchMedia is always defined
+ w.matchMedia
+ && prefersColorScheme('').media !== 'not all') {
+ for (const colorScheme of knownColorSchemes) {
+ if (prefersColorScheme(':' + colorScheme).matches) {
+ return colorScheme
+ }
+ }
+ }
+
+ return 'light'
+ }
+ })()
+
+ // @ts-ignore
+ function getStorageValue(storageType, storageKey) {
+ switch (storageType) {
+ case 'localStorage':
+ return window.localStorage.getItem(storageKey)
+ case 'sessionStorage':
+ return window.sessionStorage.getItem(storageKey)
+ case 'cookie':
+ return getCookie(storageKey)
+ default:
+ return null
+ }
+ }
+
+ // @ts-ignore
+ function getCookie(name) {
+ const value = '; ' + window.document.cookie
+ const parts = value.split('; ' + name + '=')
+ if (parts.length === 2) {
+ return parts.pop()?.split(';').shift()
+ }
+ }</script></head><body><div id="__nuxt"></div><div id="teleports"></div><script type="application/json" data-nuxt-data="nuxt-app" da
|
|
test/ssr/dev.test.ts > ssr: true, dev mode > render:
test/ssr/dev.test.ts#L16
AssertionError: expected '<!DOCTYPE html><html data-capo=""><h…' to contain 'getItem(\'nuxt-color-mode\')'
- Expected
+ Received
- getItem('nuxt-color-mode')
+ <!DOCTYPE html><html data-capo=""><head><meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <title>Demo of @nuxtjs/color-mode</title>
+ <link rel="stylesheet" href="/_nuxt/@fs/Users/runner/work/color-mode/color-mode/node_modules/.pnpm/tailwindcss@3.4.10/node_modules/tailwindcss/tailwind.css">
+ <link rel="stylesheet" href="/_nuxt/assets/main.css">
+ <link rel="stylesheet" href="/_nuxt/Users/runner/work/color-mode/color-mode/node_modules/.pnpm/tailwindcss@3.4.10/node_modules/tailwindcss/tailwind.css">
+ <link rel="stylesheet" href="/_nuxt/components/ColorModePicker.vue?vue&type=style&index=0&scoped=28ab885e&lang.css">
+ <link rel="stylesheet" href="/_nuxt/layouts/default.vue?vue&type=style&index=0&lang.css">
+ <link rel="stylesheet" href="/_nuxt/components/NuxtLogo.vue?vue&type=style&index=0&scoped=70dd8bf5&lang.css">
+ <link rel="modulepreload" as="script" crossorigin href="/_nuxt/Users/runner/work/color-mode/color-mode/node_modules/.pnpm/nuxt@3.13.1_@opentelemetry+api@1.9.0_@parcel+watcher@2.4.1_@types+node@20.5.1_encoding@0.1.13_2w6lkzat2hmkdx4eohhdofbg3u/node_modules/nuxt/dist/app/entry.js">
+ <meta name="description" content="Demo of using @nuxtjs/color-mode for Nuxt, supporting dark mode and custom colors">
+ <script type="module" src="/_nuxt/@vite/client" crossorigin></script>
+ <script type="module" src="/_nuxt/Users/runner/work/color-mode/color-mode/node_modules/.pnpm/nuxt@3.13.1_@opentelemetry+api@1.9.0_@parcel+watcher@2.4.1_@types+node@20.5.1_encoding@0.1.13_2w6lkzat2hmkdx4eohhdofbg3u/node_modules/nuxt/dist/app/entry.js" crossorigin></script><script>// @ts-check
+
+ // Add dark / light detection that runs before loading Nuxt
+ (() => {
+ // Global variable minimizers
+ const w = window
+ const de = document.documentElement
+
+ const knownColorSchemes = ['dark', 'light']
+
+ const preference = getStorageValue('localStorage', 'nuxt-color-mode') || 'system'
+ let value = preference === 'system' ? getColorScheme() : preference
+ // Applied forced color mode
+ const forcedColorMode = de.getAttribute('data-color-mode-forced')
+ if (forcedColorMode) {
+ value = forcedColorMode
+ }
+
+ addColorScheme(value)
+
+ w['__NUXT_COLOR_MODE__'] = {
+ preference,
+ value,
+ getColorScheme,
+ addColorScheme,
+ removeColorScheme,
+ }
+
+ /** @param {string} value */
+ function addColorScheme(value) {
+ const className = '' + value + '-mode'
+ const dataValue = ''
+ if (de.classList) {
+ de.classList.add(className)
+ }
+ else {
+ de.className += ' ' + className
+ }
+ if (dataValue) {
+ de.setAttribute('data-' + dataValue, value)
+ }
+ }
+
+ /** @param {string} value */
+ function removeColorScheme(value) {
+ const className = '' + value + '-mode'
+ const dataValue = ''
+ if (de.classList) {
+ de.classList.remove(className)
+ }
+ else {
+ de.className = de.className.replace(new RegExp(className, 'g'), '')
+ }
+ if (dataValue) {
+ de.removeAttribute('data-' + dataValue)
+ }
+ }
+
+ /** @param {string} suffix */
+ function prefersColorScheme(suffix) {
+ return w.matchMedia('(prefers-color-scheme' + suffix + ')')
+ }
+
+ function getColorScheme() {
+ if (
+ // @ts-expect-error TS assumes matchMedia is always defined
+ w.matchMedia
+ && prefersColorScheme('').media !== 'not all') {
+ for (const colorScheme of knownColorSchemes) {
+ if (prefersColorScheme(':' + colorScheme).matches) {
+ return colorScheme
+ }
+ }
+ }
+
+ return 'light'
+ }
+ })()
+
+ // @ts-ignore
+ function getStorageValue(storageType, storageKey) {
+ switch (storageType) {
+ case 'localStorage':
+ return window.localStorage.getItem(storageKey)
+ case 'sessionStorage':
+ return window.sessionStorage.
|
|
test/ssr/generate.test.ts > ssr: true, target: static, generated files > generated file:
test/ssr/generate.test.ts#L28
AssertionError: expected '<!DOCTYPE html><html data-capo=""><h…' to match 'getItem(\'nuxt-color-mode\')'
- Expected
+ Received
- getItem('nuxt-color-mode')
+ <!DOCTYPE html><html data-capo=""><head><meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <title>Demo of @nuxtjs/color-mode</title>
+ <style>/*! tailwindcss v3.4.10 | MIT License | https://tailwindcss.com*/*,:after,:before{border:0 solid #e5e7eb;box-sizing:border-box}:after,:before{--tw-content:""}:host,html{line-height:1.5;-webkit-text-size-adjust:100%;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-feature-settings:normal;font-variation-settings:normal;tab-size:4;-webkit-tap-highlight-color:transparent}body{line-height:inherit;margin:0}hr{border-top-width:1px;color:inherit;height:0}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-size:1em;font-variation-settings:normal}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:initial}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}button,input,optgroup,select,textarea{color:inherit;font-family:inherit;font-feature-settings:inherit;font-size:100%;font-variation-settings:inherit;font-weight:inherit;letter-spacing:inherit;line-height:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:initial;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:initial}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::placeholder,textarea::placeholder{color:#9ca3af;opacity:1}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}[hidden]{display:none}*,::backdrop,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#3b82f680;--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@medi
|
|
test/ssr/prod.test.ts > ssr: true, target: server, prod mode > render:
test/ssr/prod.test.ts#L17
AssertionError: expected '<!DOCTYPE html><html data-capo=""><h…' to contain 'getItem(\'nuxt-color-mode\')'
- Expected
+ Received
- getItem('nuxt-color-mode')
+ <!DOCTYPE html><html data-capo=""><head><meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <title>Demo of @nuxtjs/color-mode</title>
+ <style>/*! tailwindcss v3.4.10 | MIT License | https://tailwindcss.com*/*,:after,:before{border:0 solid #e5e7eb;box-sizing:border-box}:after,:before{--tw-content:""}:host,html{line-height:1.5;-webkit-text-size-adjust:100%;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-feature-settings:normal;font-variation-settings:normal;tab-size:4;-webkit-tap-highlight-color:transparent}body{line-height:inherit;margin:0}hr{border-top-width:1px;color:inherit;height:0}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-size:1em;font-variation-settings:normal}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:initial}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}button,input,optgroup,select,textarea{color:inherit;font-family:inherit;font-feature-settings:inherit;font-size:100%;font-variation-settings:inherit;font-weight:inherit;letter-spacing:inherit;line-height:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:initial;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:initial}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::placeholder,textarea::placeholder{color:#9ca3af;opacity:1}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}[hidden]{display:none}*,::backdrop,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#3b82f680;--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@me
|
|
ci (macos-latest, 18)
Process completed with exit code 1.
|
|
ci (windows-latest, 20)
The job was canceled because "macos-latest_18" failed.
|
|
ci (windows-latest, 20)
The operation was canceled.
|
|
ci (windows-latest, 18)
The job was canceled because "macos-latest_18" failed.
|
|
ci (windows-latest, 18)
The operation was canceled.
|
|
ci (ubuntu-latest, 20)
The job was canceled because "macos-latest_18" failed.
|
|
test/csr/dev.test.ts > ssr: false, dev mode > renders:
test/csr/dev.test.ts#L16
AssertionError: expected '<!DOCTYPE html><html data-capo=""><h…' to contain 'getItem(\'nuxt-color-mode\')'
- Expected
+ Received
- getItem('nuxt-color-mode')
+ <!DOCTYPE html><html data-capo=""><head><meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <title>Demo of @nuxtjs/color-mode</title>
+ <link rel="stylesheet" href="/_nuxt/@fs/home/runner/work/color-mode/color-mode/node_modules/.pnpm/tailwindcss@3.4.10/node_modules/tailwindcss/tailwind.css">
+ <link rel="stylesheet" href="/_nuxt/assets/main.css">
+ <link rel="stylesheet" href="/_nuxt/home/runner/work/color-mode/color-mode/node_modules/.pnpm/tailwindcss@3.4.10/node_modules/tailwindcss/tailwind.css">
+ <link rel="stylesheet" href="/_nuxt/components/ColorModePicker.vue?vue&type=style&index=0&scoped=28ab885e&lang.css">
+ <link rel="stylesheet" href="/_nuxt/layouts/default.vue?vue&type=style&index=0&lang.css">
+ <link rel="stylesheet" href="/_nuxt/components/NuxtLogo.vue?vue&type=style&index=0&scoped=70dd8bf5&lang.css">
+ <link rel="modulepreload" as="script" crossorigin href="/_nuxt/home/runner/work/color-mode/color-mode/node_modules/.pnpm/nuxt@3.13.1_@opentelemetry+api@1.9.0_@parcel+watcher@2.4.1_@types+node@20.5.1_encoding@0.1.13_2w6lkzat2hmkdx4eohhdofbg3u/node_modules/nuxt/dist/app/entry.js">
+ <meta name="description" content="Demo of using @nuxtjs/color-mode for Nuxt, supporting dark mode and custom colors">
+ <script type="module" src="/_nuxt/@vite/client" crossorigin></script>
+ <script type="module" src="/_nuxt/home/runner/work/color-mode/color-mode/node_modules/.pnpm/nuxt@3.13.1_@opentelemetry+api@1.9.0_@parcel+watcher@2.4.1_@types+node@20.5.1_encoding@0.1.13_2w6lkzat2hmkdx4eohhdofbg3u/node_modules/nuxt/dist/app/entry.js" crossorigin></script><script>// @ts-check
+
+ // Add dark / light detection that runs before loading Nuxt
+ (() => {
+ // Global variable minimizers
+ const w = window
+ const de = document.documentElement
+
+ const knownColorSchemes = ['dark', 'light']
+
+ const preference = getStorageValue('localStorage', 'nuxt-color-mode') || 'system'
+ let value = preference === 'system' ? getColorScheme() : preference
+ // Applied forced color mode
+ const forcedColorMode = de.getAttribute('data-color-mode-forced')
+ if (forcedColorMode) {
+ value = forcedColorMode
+ }
+
+ addColorScheme(value)
+
+ w['__NUXT_COLOR_MODE__'] = {
+ preference,
+ value,
+ getColorScheme,
+ addColorScheme,
+ removeColorScheme,
+ }
+
+ /** @param {string} value */
+ function addColorScheme(value) {
+ const className = '' + value + '-mode'
+ const dataValue = ''
+ if (de.classList) {
+ de.classList.add(className)
+ }
+ else {
+ de.className += ' ' + className
+ }
+ if (dataValue) {
+ de.setAttribute('data-' + dataValue, value)
+ }
+ }
+
+ /** @param {string} value */
+ function removeColorScheme(value) {
+ const className = '' + value + '-mode'
+ const dataValue = ''
+ if (de.classList) {
+ de.classList.remove(className)
+ }
+ else {
+ de.className = de.className.replace(new RegExp(className, 'g'), '')
+ }
+ if (dataValue) {
+ de.removeAttribute('data-' + dataValue)
+ }
+ }
+
+ /** @param {string} suffix */
+ function prefersColorScheme(suffix) {
+ return w.matchMedia('(prefers-color-scheme' + suffix + ')')
+ }
+
+ function getColorScheme() {
+ if (
+ // @ts-expect-error TS assumes matchMedia is always defined
+ w.matchMedia
+ && prefersColorScheme('').media !== 'not all') {
+ for (const colorScheme of knownColorSchemes) {
+ if (prefersColorScheme(':' + colorScheme).matches) {
+ return colorScheme
+ }
+ }
+ }
+
+ return 'light'
+ }
+ })()
+
+ // @ts-ignore
+ function getStorageValue(storageType, storageKey) {
+ switch (storageType) {
+ case 'localStorage':
+ return window.localStorage.getItem(storageKey)
+ case 'sessionStorage':
+ return window.sessionStorage.getI
|
|
test/csr/generate.test.ts > ssr: false, target: static, generated files > generated file:
test/csr/generate.test.ts#L29
AssertionError: expected '<!DOCTYPE html><html data-capo=""><h…' to contain 'getItem(\'nuxt-color-mode\')'
- Expected
+ Received
- getItem('nuxt-color-mode')
+ <!DOCTYPE html><html data-capo=""><head><meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <link rel="stylesheet" href="/_nuxt/entry.BeA5LUrk.css">
+ <link rel="modulepreload" as="script" crossorigin href="/_nuxt/_xOV25A-.js">
+ <link rel="prefetch" as="style" href="/_nuxt/default.BfERDc1H.css">
+ <link rel="prefetch" as="style" href="/_nuxt/NuxtLogo.PVoRAFLQ.css">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/DEmfOMIZ.js">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/WdWr2YtC.js">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/CoUTcn9b.js">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/Dma6qgke.js">
+ <link rel="prefetch" as="style" href="/_nuxt/error-404.C3xcNO5b.css">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/DS6c2yDq.js">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/yrytk8Qg.js">
+ <link rel="prefetch" as="style" href="/_nuxt/error-500.B_ynad8U.css">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/DheAKk3a.js">
+ <script type="module" src="/_nuxt/_xOV25A-.js" crossorigin></script><script>// @ts-check
+
+ // Add dark / light detection that runs before loading Nuxt
+ (() => {
+ // Global variable minimizers
+ const w = window
+ const de = document.documentElement
+
+ const knownColorSchemes = ['dark', 'light']
+
+ const preference = getStorageValue('localStorage', 'nuxt-color-mode') || 'system'
+ let value = preference === 'system' ? getColorScheme() : preference
+ // Applied forced color mode
+ const forcedColorMode = de.getAttribute('data-color-mode-forced')
+ if (forcedColorMode) {
+ value = forcedColorMode
+ }
+
+ addColorScheme(value)
+
+ w['__NUXT_COLOR_MODE__'] = {
+ preference,
+ value,
+ getColorScheme,
+ addColorScheme,
+ removeColorScheme,
+ }
+
+ /** @param {string} value */
+ function addColorScheme(value) {
+ const className = '' + value + '-mode'
+ const dataValue = ''
+ if (de.classList) {
+ de.classList.add(className)
+ }
+ else {
+ de.className += ' ' + className
+ }
+ if (dataValue) {
+ de.setAttribute('data-' + dataValue, value)
+ }
+ }
+
+ /** @param {string} value */
+ function removeColorScheme(value) {
+ const className = '' + value + '-mode'
+ const dataValue = ''
+ if (de.classList) {
+ de.classList.remove(className)
+ }
+ else {
+ de.className = de.className.replace(new RegExp(className, 'g'), '')
+ }
+ if (dataValue) {
+ de.removeAttribute('data-' + dataValue)
+ }
+ }
+
+ /** @param {string} suffix */
+ function prefersColorScheme(suffix) {
+ return w.matchMedia('(prefers-color-scheme' + suffix + ')')
+ }
+
+ function getColorScheme() {
+ if (
+ // @ts-expect-error TS assumes matchMedia is always defined
+ w.matchMedia
+ && prefersColorScheme('').media !== 'not all') {
+ for (const colorScheme of knownColorSchemes) {
+ if (prefersColorScheme(':' + colorScheme).matches) {
+ return colorScheme
+ }
+ }
+ }
+
+ return 'light'
+ }
+ })()
+
+ // @ts-ignore
+ function getStorageValue(storageType, storageKey) {
+ switch (storageType) {
+ case 'localStorage':
+ return window.localStorage.getItem(storageKey)
+ case 'sessionStorage':
+ return window.sessionStorage.getItem(storageKey)
+ case 'cookie':
+ return getCookie(storageKey)
+ default:
+ return null
+ }
+ }
+
+ // @ts-ignore
+ function getCookie(name) {
+ const value = '; ' + window.document.cookie
+ const parts = value.split('; ' + name + '=')
+ if (parts.length === 2) {
+ return parts.pop()?.split(';').shift()
+ }
+ }</script></head><body><div id="__nuxt"></div><div id="teleports"></div><script type="application/json" data-nuxt-data="nuxt-app" da
|
|
test/csr/prod.test.ts > ssr: false, target: server, prod mode > render:
test/csr/prod.test.ts#L17
AssertionError: expected '<!DOCTYPE html><html data-capo=""><h…' to contain 'getItem(\'nuxt-color-mode\')'
- Expected
+ Received
- getItem('nuxt-color-mode')
+ <!DOCTYPE html><html data-capo=""><head><meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <link rel="stylesheet" href="/_nuxt/entry.BeA5LUrk.css">
+ <link rel="modulepreload" as="script" crossorigin href="/_nuxt/BKyiIKiS.js">
+ <link rel="prefetch" as="style" href="/_nuxt/default.BfERDc1H.css">
+ <link rel="prefetch" as="style" href="/_nuxt/NuxtLogo.PVoRAFLQ.css">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/Btrs8b8d.js">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/CMlv1mPM.js">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/BmTHhqdj.js">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/ZY-ldsUg.js">
+ <link rel="prefetch" as="style" href="/_nuxt/error-404.C3xcNO5b.css">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/DyeMWsJh.js">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/CpyTonVA.js">
+ <link rel="prefetch" as="style" href="/_nuxt/error-500.B_ynad8U.css">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/DwpRFwPr.js">
+ <script type="module" src="/_nuxt/BKyiIKiS.js" crossorigin></script><script>// @ts-check
+
+ // Add dark / light detection that runs before loading Nuxt
+ (() => {
+ // Global variable minimizers
+ const w = window
+ const de = document.documentElement
+
+ const knownColorSchemes = ['dark', 'light']
+
+ const preference = getStorageValue('localStorage', 'nuxt-color-mode') || 'system'
+ let value = preference === 'system' ? getColorScheme() : preference
+ // Applied forced color mode
+ const forcedColorMode = de.getAttribute('data-color-mode-forced')
+ if (forcedColorMode) {
+ value = forcedColorMode
+ }
+
+ addColorScheme(value)
+
+ w['__NUXT_COLOR_MODE__'] = {
+ preference,
+ value,
+ getColorScheme,
+ addColorScheme,
+ removeColorScheme,
+ }
+
+ /** @param {string} value */
+ function addColorScheme(value) {
+ const className = '' + value + '-mode'
+ const dataValue = ''
+ if (de.classList) {
+ de.classList.add(className)
+ }
+ else {
+ de.className += ' ' + className
+ }
+ if (dataValue) {
+ de.setAttribute('data-' + dataValue, value)
+ }
+ }
+
+ /** @param {string} value */
+ function removeColorScheme(value) {
+ const className = '' + value + '-mode'
+ const dataValue = ''
+ if (de.classList) {
+ de.classList.remove(className)
+ }
+ else {
+ de.className = de.className.replace(new RegExp(className, 'g'), '')
+ }
+ if (dataValue) {
+ de.removeAttribute('data-' + dataValue)
+ }
+ }
+
+ /** @param {string} suffix */
+ function prefersColorScheme(suffix) {
+ return w.matchMedia('(prefers-color-scheme' + suffix + ')')
+ }
+
+ function getColorScheme() {
+ if (
+ // @ts-expect-error TS assumes matchMedia is always defined
+ w.matchMedia
+ && prefersColorScheme('').media !== 'not all') {
+ for (const colorScheme of knownColorSchemes) {
+ if (prefersColorScheme(':' + colorScheme).matches) {
+ return colorScheme
+ }
+ }
+ }
+
+ return 'light'
+ }
+ })()
+
+ // @ts-ignore
+ function getStorageValue(storageType, storageKey) {
+ switch (storageType) {
+ case 'localStorage':
+ return window.localStorage.getItem(storageKey)
+ case 'sessionStorage':
+ return window.sessionStorage.getItem(storageKey)
+ case 'cookie':
+ return getCookie(storageKey)
+ default:
+ return null
+ }
+ }
+
+ // @ts-ignore
+ function getCookie(name) {
+ const value = '; ' + window.document.cookie
+ const parts = value.split('; ' + name + '=')
+ if (parts.length === 2) {
+ return parts.pop()?.split(';').shift()
+ }
+ }</script></head><body><div id="__nuxt"></div><div id="teleports"></div><script type="application/json" data-nuxt-data="nuxt-app" da
|
|
test/ssr/dev.test.ts > ssr: true, dev mode > render:
test/ssr/dev.test.ts#L16
AssertionError: expected '<!DOCTYPE html><html data-capo=""><h…' to contain 'getItem(\'nuxt-color-mode\')'
- Expected
+ Received
- getItem('nuxt-color-mode')
+ <!DOCTYPE html><html data-capo=""><head><meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <title>Demo of @nuxtjs/color-mode</title>
+ <link rel="stylesheet" href="/_nuxt/@fs/home/runner/work/color-mode/color-mode/node_modules/.pnpm/tailwindcss@3.4.10/node_modules/tailwindcss/tailwind.css">
+ <link rel="stylesheet" href="/_nuxt/assets/main.css">
+ <link rel="stylesheet" href="/_nuxt/home/runner/work/color-mode/color-mode/node_modules/.pnpm/tailwindcss@3.4.10/node_modules/tailwindcss/tailwind.css">
+ <link rel="stylesheet" href="/_nuxt/components/ColorModePicker.vue?vue&type=style&index=0&scoped=28ab885e&lang.css">
+ <link rel="stylesheet" href="/_nuxt/layouts/default.vue?vue&type=style&index=0&lang.css">
+ <link rel="stylesheet" href="/_nuxt/components/NuxtLogo.vue?vue&type=style&index=0&scoped=70dd8bf5&lang.css">
+ <link rel="modulepreload" as="script" crossorigin href="/_nuxt/home/runner/work/color-mode/color-mode/node_modules/.pnpm/nuxt@3.13.1_@opentelemetry+api@1.9.0_@parcel+watcher@2.4.1_@types+node@20.5.1_encoding@0.1.13_2w6lkzat2hmkdx4eohhdofbg3u/node_modules/nuxt/dist/app/entry.js">
+ <meta name="description" content="Demo of using @nuxtjs/color-mode for Nuxt, supporting dark mode and custom colors">
+ <script type="module" src="/_nuxt/@vite/client" crossorigin></script>
+ <script type="module" src="/_nuxt/home/runner/work/color-mode/color-mode/node_modules/.pnpm/nuxt@3.13.1_@opentelemetry+api@1.9.0_@parcel+watcher@2.4.1_@types+node@20.5.1_encoding@0.1.13_2w6lkzat2hmkdx4eohhdofbg3u/node_modules/nuxt/dist/app/entry.js" crossorigin></script><script>// @ts-check
+
+ // Add dark / light detection that runs before loading Nuxt
+ (() => {
+ // Global variable minimizers
+ const w = window
+ const de = document.documentElement
+
+ const knownColorSchemes = ['dark', 'light']
+
+ const preference = getStorageValue('localStorage', 'nuxt-color-mode') || 'system'
+ let value = preference === 'system' ? getColorScheme() : preference
+ // Applied forced color mode
+ const forcedColorMode = de.getAttribute('data-color-mode-forced')
+ if (forcedColorMode) {
+ value = forcedColorMode
+ }
+
+ addColorScheme(value)
+
+ w['__NUXT_COLOR_MODE__'] = {
+ preference,
+ value,
+ getColorScheme,
+ addColorScheme,
+ removeColorScheme,
+ }
+
+ /** @param {string} value */
+ function addColorScheme(value) {
+ const className = '' + value + '-mode'
+ const dataValue = ''
+ if (de.classList) {
+ de.classList.add(className)
+ }
+ else {
+ de.className += ' ' + className
+ }
+ if (dataValue) {
+ de.setAttribute('data-' + dataValue, value)
+ }
+ }
+
+ /** @param {string} value */
+ function removeColorScheme(value) {
+ const className = '' + value + '-mode'
+ const dataValue = ''
+ if (de.classList) {
+ de.classList.remove(className)
+ }
+ else {
+ de.className = de.className.replace(new RegExp(className, 'g'), '')
+ }
+ if (dataValue) {
+ de.removeAttribute('data-' + dataValue)
+ }
+ }
+
+ /** @param {string} suffix */
+ function prefersColorScheme(suffix) {
+ return w.matchMedia('(prefers-color-scheme' + suffix + ')')
+ }
+
+ function getColorScheme() {
+ if (
+ // @ts-expect-error TS assumes matchMedia is always defined
+ w.matchMedia
+ && prefersColorScheme('').media !== 'not all') {
+ for (const colorScheme of knownColorSchemes) {
+ if (prefersColorScheme(':' + colorScheme).matches) {
+ return colorScheme
+ }
+ }
+ }
+
+ return 'light'
+ }
+ })()
+
+ // @ts-ignore
+ function getStorageValue(storageType, storageKey) {
+ switch (storageType) {
+ case 'localStorage':
+ return window.localStorage.getItem(storageKey)
+ case 'sessionStorage':
+ return window.sessionStorage.getI
|
|
test/ssr/generate.test.ts > ssr: true, target: static, generated files > generated file:
test/ssr/generate.test.ts#L28
AssertionError: expected '<!DOCTYPE html><html data-capo=""><h…' to match 'getItem(\'nuxt-color-mode\')'
- Expected
+ Received
- getItem('nuxt-color-mode')
+ <!DOCTYPE html><html data-capo=""><head><meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <title>Demo of @nuxtjs/color-mode</title>
+ <style>/*! tailwindcss v3.4.10 | MIT License | https://tailwindcss.com*/*,:after,:before{border:0 solid #e5e7eb;box-sizing:border-box}:after,:before{--tw-content:""}:host,html{line-height:1.5;-webkit-text-size-adjust:100%;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-feature-settings:normal;font-variation-settings:normal;tab-size:4;-webkit-tap-highlight-color:transparent}body{line-height:inherit;margin:0}hr{border-top-width:1px;color:inherit;height:0}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-size:1em;font-variation-settings:normal}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:initial}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}button,input,optgroup,select,textarea{color:inherit;font-family:inherit;font-feature-settings:inherit;font-size:100%;font-variation-settings:inherit;font-weight:inherit;letter-spacing:inherit;line-height:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:initial;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:initial}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::placeholder,textarea::placeholder{color:#9ca3af;opacity:1}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}[hidden]{display:none}*,::backdrop,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#3b82f680;--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@medi
|
|
test/ssr/prod.test.ts > ssr: true, target: server, prod mode > render:
test/ssr/prod.test.ts#L17
AssertionError: expected '<!DOCTYPE html><html data-capo=""><h…' to contain 'getItem(\'nuxt-color-mode\')'
- Expected
+ Received
- getItem('nuxt-color-mode')
+ <!DOCTYPE html><html data-capo=""><head><meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <title>Demo of @nuxtjs/color-mode</title>
+ <style>/*! tailwindcss v3.4.10 | MIT License | https://tailwindcss.com*/*,:after,:before{border:0 solid #e5e7eb;box-sizing:border-box}:after,:before{--tw-content:""}:host,html{line-height:1.5;-webkit-text-size-adjust:100%;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-feature-settings:normal;font-variation-settings:normal;tab-size:4;-webkit-tap-highlight-color:transparent}body{line-height:inherit;margin:0}hr{border-top-width:1px;color:inherit;height:0}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-size:1em;font-variation-settings:normal}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:initial}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}button,input,optgroup,select,textarea{color:inherit;font-family:inherit;font-feature-settings:inherit;font-size:100%;font-variation-settings:inherit;font-weight:inherit;letter-spacing:inherit;line-height:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:initial;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:initial}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::placeholder,textarea::placeholder{color:#9ca3af;opacity:1}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}[hidden]{display:none}*,::backdrop,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#3b82f680;--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@me
|
|
ci (ubuntu-latest, 20)
The operation was canceled.
|
|
ci (ubuntu-latest, 18)
The job was canceled because "macos-latest_18" failed.
|
|
test/csr/dev.test.ts > ssr: false, dev mode > renders:
test/csr/dev.test.ts#L16
AssertionError: expected '<!DOCTYPE html><html data-capo=""><h…' to contain 'getItem(\'nuxt-color-mode\')'
- Expected
+ Received
- getItem('nuxt-color-mode')
+ <!DOCTYPE html><html data-capo=""><head><meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <title>Demo of @nuxtjs/color-mode</title>
+ <link rel="stylesheet" href="/_nuxt/@fs/home/runner/work/color-mode/color-mode/node_modules/.pnpm/tailwindcss@3.4.10/node_modules/tailwindcss/tailwind.css">
+ <link rel="stylesheet" href="/_nuxt/assets/main.css">
+ <link rel="stylesheet" href="/_nuxt/home/runner/work/color-mode/color-mode/node_modules/.pnpm/tailwindcss@3.4.10/node_modules/tailwindcss/tailwind.css">
+ <link rel="stylesheet" href="/_nuxt/components/ColorModePicker.vue?vue&type=style&index=0&scoped=28ab885e&lang.css">
+ <link rel="stylesheet" href="/_nuxt/layouts/default.vue?vue&type=style&index=0&lang.css">
+ <link rel="stylesheet" href="/_nuxt/components/NuxtLogo.vue?vue&type=style&index=0&scoped=70dd8bf5&lang.css">
+ <link rel="modulepreload" as="script" crossorigin href="/_nuxt/home/runner/work/color-mode/color-mode/node_modules/.pnpm/nuxt@3.13.1_@opentelemetry+api@1.9.0_@parcel+watcher@2.4.1_@types+node@20.5.1_encoding@0.1.13_2w6lkzat2hmkdx4eohhdofbg3u/node_modules/nuxt/dist/app/entry.js">
+ <meta name="description" content="Demo of using @nuxtjs/color-mode for Nuxt, supporting dark mode and custom colors">
+ <script type="module" src="/_nuxt/@vite/client" crossorigin></script>
+ <script type="module" src="/_nuxt/home/runner/work/color-mode/color-mode/node_modules/.pnpm/nuxt@3.13.1_@opentelemetry+api@1.9.0_@parcel+watcher@2.4.1_@types+node@20.5.1_encoding@0.1.13_2w6lkzat2hmkdx4eohhdofbg3u/node_modules/nuxt/dist/app/entry.js" crossorigin></script><script>// @ts-check
+
+ // Add dark / light detection that runs before loading Nuxt
+ (() => {
+ // Global variable minimizers
+ const w = window
+ const de = document.documentElement
+
+ const knownColorSchemes = ['dark', 'light']
+
+ const preference = getStorageValue('localStorage', 'nuxt-color-mode') || 'system'
+ let value = preference === 'system' ? getColorScheme() : preference
+ // Applied forced color mode
+ const forcedColorMode = de.getAttribute('data-color-mode-forced')
+ if (forcedColorMode) {
+ value = forcedColorMode
+ }
+
+ addColorScheme(value)
+
+ w['__NUXT_COLOR_MODE__'] = {
+ preference,
+ value,
+ getColorScheme,
+ addColorScheme,
+ removeColorScheme,
+ }
+
+ /** @param {string} value */
+ function addColorScheme(value) {
+ const className = '' + value + '-mode'
+ const dataValue = ''
+ if (de.classList) {
+ de.classList.add(className)
+ }
+ else {
+ de.className += ' ' + className
+ }
+ if (dataValue) {
+ de.setAttribute('data-' + dataValue, value)
+ }
+ }
+
+ /** @param {string} value */
+ function removeColorScheme(value) {
+ const className = '' + value + '-mode'
+ const dataValue = ''
+ if (de.classList) {
+ de.classList.remove(className)
+ }
+ else {
+ de.className = de.className.replace(new RegExp(className, 'g'), '')
+ }
+ if (dataValue) {
+ de.removeAttribute('data-' + dataValue)
+ }
+ }
+
+ /** @param {string} suffix */
+ function prefersColorScheme(suffix) {
+ return w.matchMedia('(prefers-color-scheme' + suffix + ')')
+ }
+
+ function getColorScheme() {
+ if (
+ // @ts-expect-error TS assumes matchMedia is always defined
+ w.matchMedia
+ && prefersColorScheme('').media !== 'not all') {
+ for (const colorScheme of knownColorSchemes) {
+ if (prefersColorScheme(':' + colorScheme).matches) {
+ return colorScheme
+ }
+ }
+ }
+
+ return 'light'
+ }
+ })()
+
+ // @ts-ignore
+ function getStorageValue(storageType, storageKey) {
+ switch (storageType) {
+ case 'localStorage':
+ return window.localStorage.getItem(storageKey)
+ case 'sessionStorage':
+ return window.sessionStorage.getI
|
|
test/csr/generate.test.ts > ssr: false, target: static, generated files > generated file:
test/csr/generate.test.ts#L29
AssertionError: expected '<!DOCTYPE html><html data-capo=""><h…' to contain 'getItem(\'nuxt-color-mode\')'
- Expected
+ Received
- getItem('nuxt-color-mode')
+ <!DOCTYPE html><html data-capo=""><head><meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <link rel="stylesheet" href="/_nuxt/entry.BeA5LUrk.css">
+ <link rel="modulepreload" as="script" crossorigin href="/_nuxt/_xOV25A-.js">
+ <link rel="prefetch" as="style" href="/_nuxt/default.BfERDc1H.css">
+ <link rel="prefetch" as="style" href="/_nuxt/NuxtLogo.PVoRAFLQ.css">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/DEmfOMIZ.js">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/WdWr2YtC.js">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/CoUTcn9b.js">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/Dma6qgke.js">
+ <link rel="prefetch" as="style" href="/_nuxt/error-404.C3xcNO5b.css">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/DS6c2yDq.js">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/yrytk8Qg.js">
+ <link rel="prefetch" as="style" href="/_nuxt/error-500.B_ynad8U.css">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/DheAKk3a.js">
+ <script type="module" src="/_nuxt/_xOV25A-.js" crossorigin></script><script>// @ts-check
+
+ // Add dark / light detection that runs before loading Nuxt
+ (() => {
+ // Global variable minimizers
+ const w = window
+ const de = document.documentElement
+
+ const knownColorSchemes = ['dark', 'light']
+
+ const preference = getStorageValue('localStorage', 'nuxt-color-mode') || 'system'
+ let value = preference === 'system' ? getColorScheme() : preference
+ // Applied forced color mode
+ const forcedColorMode = de.getAttribute('data-color-mode-forced')
+ if (forcedColorMode) {
+ value = forcedColorMode
+ }
+
+ addColorScheme(value)
+
+ w['__NUXT_COLOR_MODE__'] = {
+ preference,
+ value,
+ getColorScheme,
+ addColorScheme,
+ removeColorScheme,
+ }
+
+ /** @param {string} value */
+ function addColorScheme(value) {
+ const className = '' + value + '-mode'
+ const dataValue = ''
+ if (de.classList) {
+ de.classList.add(className)
+ }
+ else {
+ de.className += ' ' + className
+ }
+ if (dataValue) {
+ de.setAttribute('data-' + dataValue, value)
+ }
+ }
+
+ /** @param {string} value */
+ function removeColorScheme(value) {
+ const className = '' + value + '-mode'
+ const dataValue = ''
+ if (de.classList) {
+ de.classList.remove(className)
+ }
+ else {
+ de.className = de.className.replace(new RegExp(className, 'g'), '')
+ }
+ if (dataValue) {
+ de.removeAttribute('data-' + dataValue)
+ }
+ }
+
+ /** @param {string} suffix */
+ function prefersColorScheme(suffix) {
+ return w.matchMedia('(prefers-color-scheme' + suffix + ')')
+ }
+
+ function getColorScheme() {
+ if (
+ // @ts-expect-error TS assumes matchMedia is always defined
+ w.matchMedia
+ && prefersColorScheme('').media !== 'not all') {
+ for (const colorScheme of knownColorSchemes) {
+ if (prefersColorScheme(':' + colorScheme).matches) {
+ return colorScheme
+ }
+ }
+ }
+
+ return 'light'
+ }
+ })()
+
+ // @ts-ignore
+ function getStorageValue(storageType, storageKey) {
+ switch (storageType) {
+ case 'localStorage':
+ return window.localStorage.getItem(storageKey)
+ case 'sessionStorage':
+ return window.sessionStorage.getItem(storageKey)
+ case 'cookie':
+ return getCookie(storageKey)
+ default:
+ return null
+ }
+ }
+
+ // @ts-ignore
+ function getCookie(name) {
+ const value = '; ' + window.document.cookie
+ const parts = value.split('; ' + name + '=')
+ if (parts.length === 2) {
+ return parts.pop()?.split(';').shift()
+ }
+ }</script></head><body><div id="__nuxt"></div><div id="teleports"></div><script type="application/json" data-nuxt-data="nuxt-app" da
|
|
test/csr/prod.test.ts > ssr: false, target: server, prod mode > render:
test/csr/prod.test.ts#L17
AssertionError: expected '<!DOCTYPE html><html data-capo=""><h…' to contain 'getItem(\'nuxt-color-mode\')'
- Expected
+ Received
- getItem('nuxt-color-mode')
+ <!DOCTYPE html><html data-capo=""><head><meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <link rel="stylesheet" href="/_nuxt/entry.BeA5LUrk.css">
+ <link rel="modulepreload" as="script" crossorigin href="/_nuxt/_xOV25A-.js">
+ <link rel="prefetch" as="style" href="/_nuxt/default.BfERDc1H.css">
+ <link rel="prefetch" as="style" href="/_nuxt/NuxtLogo.PVoRAFLQ.css">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/DEmfOMIZ.js">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/WdWr2YtC.js">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/CoUTcn9b.js">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/Dma6qgke.js">
+ <link rel="prefetch" as="style" href="/_nuxt/error-404.C3xcNO5b.css">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/DS6c2yDq.js">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/yrytk8Qg.js">
+ <link rel="prefetch" as="style" href="/_nuxt/error-500.B_ynad8U.css">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/DheAKk3a.js">
+ <script type="module" src="/_nuxt/_xOV25A-.js" crossorigin></script><script>// @ts-check
+
+ // Add dark / light detection that runs before loading Nuxt
+ (() => {
+ // Global variable minimizers
+ const w = window
+ const de = document.documentElement
+
+ const knownColorSchemes = ['dark', 'light']
+
+ const preference = getStorageValue('localStorage', 'nuxt-color-mode') || 'system'
+ let value = preference === 'system' ? getColorScheme() : preference
+ // Applied forced color mode
+ const forcedColorMode = de.getAttribute('data-color-mode-forced')
+ if (forcedColorMode) {
+ value = forcedColorMode
+ }
+
+ addColorScheme(value)
+
+ w['__NUXT_COLOR_MODE__'] = {
+ preference,
+ value,
+ getColorScheme,
+ addColorScheme,
+ removeColorScheme,
+ }
+
+ /** @param {string} value */
+ function addColorScheme(value) {
+ const className = '' + value + '-mode'
+ const dataValue = ''
+ if (de.classList) {
+ de.classList.add(className)
+ }
+ else {
+ de.className += ' ' + className
+ }
+ if (dataValue) {
+ de.setAttribute('data-' + dataValue, value)
+ }
+ }
+
+ /** @param {string} value */
+ function removeColorScheme(value) {
+ const className = '' + value + '-mode'
+ const dataValue = ''
+ if (de.classList) {
+ de.classList.remove(className)
+ }
+ else {
+ de.className = de.className.replace(new RegExp(className, 'g'), '')
+ }
+ if (dataValue) {
+ de.removeAttribute('data-' + dataValue)
+ }
+ }
+
+ /** @param {string} suffix */
+ function prefersColorScheme(suffix) {
+ return w.matchMedia('(prefers-color-scheme' + suffix + ')')
+ }
+
+ function getColorScheme() {
+ if (
+ // @ts-expect-error TS assumes matchMedia is always defined
+ w.matchMedia
+ && prefersColorScheme('').media !== 'not all') {
+ for (const colorScheme of knownColorSchemes) {
+ if (prefersColorScheme(':' + colorScheme).matches) {
+ return colorScheme
+ }
+ }
+ }
+
+ return 'light'
+ }
+ })()
+
+ // @ts-ignore
+ function getStorageValue(storageType, storageKey) {
+ switch (storageType) {
+ case 'localStorage':
+ return window.localStorage.getItem(storageKey)
+ case 'sessionStorage':
+ return window.sessionStorage.getItem(storageKey)
+ case 'cookie':
+ return getCookie(storageKey)
+ default:
+ return null
+ }
+ }
+
+ // @ts-ignore
+ function getCookie(name) {
+ const value = '; ' + window.document.cookie
+ const parts = value.split('; ' + name + '=')
+ if (parts.length === 2) {
+ return parts.pop()?.split(';').shift()
+ }
+ }</script></head><body><div id="__nuxt"></div><div id="teleports"></div><script type="application/json" data-nuxt-data="nuxt-app" da
|
|
test/ssr/dev.test.ts > ssr: true, dev mode > render:
test/ssr/dev.test.ts#L16
AssertionError: expected '<!DOCTYPE html><html data-capo=""><h…' to contain 'getItem(\'nuxt-color-mode\')'
- Expected
+ Received
- getItem('nuxt-color-mode')
+ <!DOCTYPE html><html data-capo=""><head><meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <title>Demo of @nuxtjs/color-mode</title>
+ <link rel="stylesheet" href="/_nuxt/@fs/home/runner/work/color-mode/color-mode/node_modules/.pnpm/tailwindcss@3.4.10/node_modules/tailwindcss/tailwind.css">
+ <link rel="stylesheet" href="/_nuxt/assets/main.css">
+ <link rel="stylesheet" href="/_nuxt/home/runner/work/color-mode/color-mode/node_modules/.pnpm/tailwindcss@3.4.10/node_modules/tailwindcss/tailwind.css">
+ <link rel="stylesheet" href="/_nuxt/components/ColorModePicker.vue?vue&type=style&index=0&scoped=28ab885e&lang.css">
+ <link rel="stylesheet" href="/_nuxt/layouts/default.vue?vue&type=style&index=0&lang.css">
+ <link rel="stylesheet" href="/_nuxt/components/NuxtLogo.vue?vue&type=style&index=0&scoped=70dd8bf5&lang.css">
+ <link rel="modulepreload" as="script" crossorigin href="/_nuxt/home/runner/work/color-mode/color-mode/node_modules/.pnpm/nuxt@3.13.1_@opentelemetry+api@1.9.0_@parcel+watcher@2.4.1_@types+node@20.5.1_encoding@0.1.13_2w6lkzat2hmkdx4eohhdofbg3u/node_modules/nuxt/dist/app/entry.js">
+ <meta name="description" content="Demo of using @nuxtjs/color-mode for Nuxt, supporting dark mode and custom colors">
+ <script type="module" src="/_nuxt/@vite/client" crossorigin></script>
+ <script type="module" src="/_nuxt/home/runner/work/color-mode/color-mode/node_modules/.pnpm/nuxt@3.13.1_@opentelemetry+api@1.9.0_@parcel+watcher@2.4.1_@types+node@20.5.1_encoding@0.1.13_2w6lkzat2hmkdx4eohhdofbg3u/node_modules/nuxt/dist/app/entry.js" crossorigin></script><script>// @ts-check
+
+ // Add dark / light detection that runs before loading Nuxt
+ (() => {
+ // Global variable minimizers
+ const w = window
+ const de = document.documentElement
+
+ const knownColorSchemes = ['dark', 'light']
+
+ const preference = getStorageValue('localStorage', 'nuxt-color-mode') || 'system'
+ let value = preference === 'system' ? getColorScheme() : preference
+ // Applied forced color mode
+ const forcedColorMode = de.getAttribute('data-color-mode-forced')
+ if (forcedColorMode) {
+ value = forcedColorMode
+ }
+
+ addColorScheme(value)
+
+ w['__NUXT_COLOR_MODE__'] = {
+ preference,
+ value,
+ getColorScheme,
+ addColorScheme,
+ removeColorScheme,
+ }
+
+ /** @param {string} value */
+ function addColorScheme(value) {
+ const className = '' + value + '-mode'
+ const dataValue = ''
+ if (de.classList) {
+ de.classList.add(className)
+ }
+ else {
+ de.className += ' ' + className
+ }
+ if (dataValue) {
+ de.setAttribute('data-' + dataValue, value)
+ }
+ }
+
+ /** @param {string} value */
+ function removeColorScheme(value) {
+ const className = '' + value + '-mode'
+ const dataValue = ''
+ if (de.classList) {
+ de.classList.remove(className)
+ }
+ else {
+ de.className = de.className.replace(new RegExp(className, 'g'), '')
+ }
+ if (dataValue) {
+ de.removeAttribute('data-' + dataValue)
+ }
+ }
+
+ /** @param {string} suffix */
+ function prefersColorScheme(suffix) {
+ return w.matchMedia('(prefers-color-scheme' + suffix + ')')
+ }
+
+ function getColorScheme() {
+ if (
+ // @ts-expect-error TS assumes matchMedia is always defined
+ w.matchMedia
+ && prefersColorScheme('').media !== 'not all') {
+ for (const colorScheme of knownColorSchemes) {
+ if (prefersColorScheme(':' + colorScheme).matches) {
+ return colorScheme
+ }
+ }
+ }
+
+ return 'light'
+ }
+ })()
+
+ // @ts-ignore
+ function getStorageValue(storageType, storageKey) {
+ switch (storageType) {
+ case 'localStorage':
+ return window.localStorage.getItem(storageKey)
+ case 'sessionStorage':
+ return window.sessionStorage.getI
|
|
test/ssr/generate.test.ts > ssr: true, target: static, generated files > generated file:
test/ssr/generate.test.ts#L28
AssertionError: expected '<!DOCTYPE html><html data-capo=""><h…' to match 'getItem(\'nuxt-color-mode\')'
- Expected
+ Received
- getItem('nuxt-color-mode')
+ <!DOCTYPE html><html data-capo=""><head><meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <title>Demo of @nuxtjs/color-mode</title>
+ <style>/*! tailwindcss v3.4.10 | MIT License | https://tailwindcss.com*/*,:after,:before{border:0 solid #e5e7eb;box-sizing:border-box}:after,:before{--tw-content:""}:host,html{line-height:1.5;-webkit-text-size-adjust:100%;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-feature-settings:normal;font-variation-settings:normal;tab-size:4;-webkit-tap-highlight-color:transparent}body{line-height:inherit;margin:0}hr{border-top-width:1px;color:inherit;height:0}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-size:1em;font-variation-settings:normal}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:initial}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}button,input,optgroup,select,textarea{color:inherit;font-family:inherit;font-feature-settings:inherit;font-size:100%;font-variation-settings:inherit;font-weight:inherit;letter-spacing:inherit;line-height:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:initial;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:initial}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::placeholder,textarea::placeholder{color:#9ca3af;opacity:1}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}[hidden]{display:none}*,::backdrop,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#3b82f680;--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@medi
|
|
test/ssr/prod.test.ts > ssr: true, target: server, prod mode > render:
test/ssr/prod.test.ts#L17
AssertionError: expected '<!DOCTYPE html><html data-capo=""><h…' to contain 'getItem(\'nuxt-color-mode\')'
- Expected
+ Received
- getItem('nuxt-color-mode')
+ <!DOCTYPE html><html data-capo=""><head><meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <title>Demo of @nuxtjs/color-mode</title>
+ <style>/*! tailwindcss v3.4.10 | MIT License | https://tailwindcss.com*/*,:after,:before{border:0 solid #e5e7eb;box-sizing:border-box}:after,:before{--tw-content:""}:host,html{line-height:1.5;-webkit-text-size-adjust:100%;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-feature-settings:normal;font-variation-settings:normal;tab-size:4;-webkit-tap-highlight-color:transparent}body{line-height:inherit;margin:0}hr{border-top-width:1px;color:inherit;height:0}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-size:1em;font-variation-settings:normal}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:initial}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}button,input,optgroup,select,textarea{color:inherit;font-family:inherit;font-feature-settings:inherit;font-size:100%;font-variation-settings:inherit;font-weight:inherit;letter-spacing:inherit;line-height:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:initial;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:initial}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::placeholder,textarea::placeholder{color:#9ca3af;opacity:1}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}[hidden]{display:none}*,::backdrop,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#3b82f680;--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@me
|
|
ci (ubuntu-latest, 18)
The operation was canceled.
|
|
ci (macos-latest, 20)
The job was canceled because "macos-latest_18" failed.
|
|
test/csr/dev.test.ts > ssr: false, dev mode > renders:
test/csr/dev.test.ts#L16
AssertionError: expected '<!DOCTYPE html><html data-capo=""><h…' to contain 'getItem(\'nuxt-color-mode\')'
- Expected
+ Received
- getItem('nuxt-color-mode')
+ <!DOCTYPE html><html data-capo=""><head><meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <title>Demo of @nuxtjs/color-mode</title>
+ <link rel="stylesheet" href="/_nuxt/@fs/Users/runner/work/color-mode/color-mode/node_modules/.pnpm/tailwindcss@3.4.10/node_modules/tailwindcss/tailwind.css">
+ <link rel="stylesheet" href="/_nuxt/assets/main.css">
+ <link rel="stylesheet" href="/_nuxt/Users/runner/work/color-mode/color-mode/node_modules/.pnpm/tailwindcss@3.4.10/node_modules/tailwindcss/tailwind.css">
+ <link rel="stylesheet" href="/_nuxt/components/ColorModePicker.vue?vue&type=style&index=0&scoped=28ab885e&lang.css">
+ <link rel="stylesheet" href="/_nuxt/layouts/default.vue?vue&type=style&index=0&lang.css">
+ <link rel="stylesheet" href="/_nuxt/components/NuxtLogo.vue?vue&type=style&index=0&scoped=70dd8bf5&lang.css">
+ <link rel="modulepreload" as="script" crossorigin href="/_nuxt/Users/runner/work/color-mode/color-mode/node_modules/.pnpm/nuxt@3.13.1_@opentelemetry+api@1.9.0_@parcel+watcher@2.4.1_@types+node@20.5.1_encoding@0.1.13_2w6lkzat2hmkdx4eohhdofbg3u/node_modules/nuxt/dist/app/entry.js">
+ <meta name="description" content="Demo of using @nuxtjs/color-mode for Nuxt, supporting dark mode and custom colors">
+ <script type="module" src="/_nuxt/@vite/client" crossorigin></script>
+ <script type="module" src="/_nuxt/Users/runner/work/color-mode/color-mode/node_modules/.pnpm/nuxt@3.13.1_@opentelemetry+api@1.9.0_@parcel+watcher@2.4.1_@types+node@20.5.1_encoding@0.1.13_2w6lkzat2hmkdx4eohhdofbg3u/node_modules/nuxt/dist/app/entry.js" crossorigin></script><script>// @ts-check
+
+ // Add dark / light detection that runs before loading Nuxt
+ (() => {
+ // Global variable minimizers
+ const w = window
+ const de = document.documentElement
+
+ const knownColorSchemes = ['dark', 'light']
+
+ const preference = getStorageValue('localStorage', 'nuxt-color-mode') || 'system'
+ let value = preference === 'system' ? getColorScheme() : preference
+ // Applied forced color mode
+ const forcedColorMode = de.getAttribute('data-color-mode-forced')
+ if (forcedColorMode) {
+ value = forcedColorMode
+ }
+
+ addColorScheme(value)
+
+ w['__NUXT_COLOR_MODE__'] = {
+ preference,
+ value,
+ getColorScheme,
+ addColorScheme,
+ removeColorScheme,
+ }
+
+ /** @param {string} value */
+ function addColorScheme(value) {
+ const className = '' + value + '-mode'
+ const dataValue = ''
+ if (de.classList) {
+ de.classList.add(className)
+ }
+ else {
+ de.className += ' ' + className
+ }
+ if (dataValue) {
+ de.setAttribute('data-' + dataValue, value)
+ }
+ }
+
+ /** @param {string} value */
+ function removeColorScheme(value) {
+ const className = '' + value + '-mode'
+ const dataValue = ''
+ if (de.classList) {
+ de.classList.remove(className)
+ }
+ else {
+ de.className = de.className.replace(new RegExp(className, 'g'), '')
+ }
+ if (dataValue) {
+ de.removeAttribute('data-' + dataValue)
+ }
+ }
+
+ /** @param {string} suffix */
+ function prefersColorScheme(suffix) {
+ return w.matchMedia('(prefers-color-scheme' + suffix + ')')
+ }
+
+ function getColorScheme() {
+ if (
+ // @ts-expect-error TS assumes matchMedia is always defined
+ w.matchMedia
+ && prefersColorScheme('').media !== 'not all') {
+ for (const colorScheme of knownColorSchemes) {
+ if (prefersColorScheme(':' + colorScheme).matches) {
+ return colorScheme
+ }
+ }
+ }
+
+ return 'light'
+ }
+ })()
+
+ // @ts-ignore
+ function getStorageValue(storageType, storageKey) {
+ switch (storageType) {
+ case 'localStorage':
+ return window.localStorage.getItem(storageKey)
+ case 'sessionStorage':
+ return window.sessionStorage.
|
|
test/csr/generate.test.ts > ssr: false, target: static, generated files > generated file:
test/csr/generate.test.ts#L29
AssertionError: expected '<!DOCTYPE html><html data-capo=""><h…' to contain 'getItem(\'nuxt-color-mode\')'
- Expected
+ Received
- getItem('nuxt-color-mode')
+ <!DOCTYPE html><html data-capo=""><head><meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <link rel="stylesheet" href="/_nuxt/entry.BeA5LUrk.css">
+ <link rel="modulepreload" as="script" crossorigin href="/_nuxt/Vx0ECAV8.js">
+ <link rel="prefetch" as="style" href="/_nuxt/default.BfERDc1H.css">
+ <link rel="prefetch" as="style" href="/_nuxt/NuxtLogo.PVoRAFLQ.css">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/D-kJAy6z.js">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/CZaMv98m.js">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/BtzTUKvL.js">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/ucgUagT9.js">
+ <link rel="prefetch" as="style" href="/_nuxt/error-404.C3xcNO5b.css">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/CzYKgudz.js">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/DUu07QiN.js">
+ <link rel="prefetch" as="style" href="/_nuxt/error-500.B_ynad8U.css">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/Civo6Oc9.js">
+ <script type="module" src="/_nuxt/Vx0ECAV8.js" crossorigin></script><script>// @ts-check
+
+ // Add dark / light detection that runs before loading Nuxt
+ (() => {
+ // Global variable minimizers
+ const w = window
+ const de = document.documentElement
+
+ const knownColorSchemes = ['dark', 'light']
+
+ const preference = getStorageValue('localStorage', 'nuxt-color-mode') || 'system'
+ let value = preference === 'system' ? getColorScheme() : preference
+ // Applied forced color mode
+ const forcedColorMode = de.getAttribute('data-color-mode-forced')
+ if (forcedColorMode) {
+ value = forcedColorMode
+ }
+
+ addColorScheme(value)
+
+ w['__NUXT_COLOR_MODE__'] = {
+ preference,
+ value,
+ getColorScheme,
+ addColorScheme,
+ removeColorScheme,
+ }
+
+ /** @param {string} value */
+ function addColorScheme(value) {
+ const className = '' + value + '-mode'
+ const dataValue = ''
+ if (de.classList) {
+ de.classList.add(className)
+ }
+ else {
+ de.className += ' ' + className
+ }
+ if (dataValue) {
+ de.setAttribute('data-' + dataValue, value)
+ }
+ }
+
+ /** @param {string} value */
+ function removeColorScheme(value) {
+ const className = '' + value + '-mode'
+ const dataValue = ''
+ if (de.classList) {
+ de.classList.remove(className)
+ }
+ else {
+ de.className = de.className.replace(new RegExp(className, 'g'), '')
+ }
+ if (dataValue) {
+ de.removeAttribute('data-' + dataValue)
+ }
+ }
+
+ /** @param {string} suffix */
+ function prefersColorScheme(suffix) {
+ return w.matchMedia('(prefers-color-scheme' + suffix + ')')
+ }
+
+ function getColorScheme() {
+ if (
+ // @ts-expect-error TS assumes matchMedia is always defined
+ w.matchMedia
+ && prefersColorScheme('').media !== 'not all') {
+ for (const colorScheme of knownColorSchemes) {
+ if (prefersColorScheme(':' + colorScheme).matches) {
+ return colorScheme
+ }
+ }
+ }
+
+ return 'light'
+ }
+ })()
+
+ // @ts-ignore
+ function getStorageValue(storageType, storageKey) {
+ switch (storageType) {
+ case 'localStorage':
+ return window.localStorage.getItem(storageKey)
+ case 'sessionStorage':
+ return window.sessionStorage.getItem(storageKey)
+ case 'cookie':
+ return getCookie(storageKey)
+ default:
+ return null
+ }
+ }
+
+ // @ts-ignore
+ function getCookie(name) {
+ const value = '; ' + window.document.cookie
+ const parts = value.split('; ' + name + '=')
+ if (parts.length === 2) {
+ return parts.pop()?.split(';').shift()
+ }
+ }</script></head><body><div id="__nuxt"></div><div id="teleports"></div><script type="application/json" data-nuxt-data="nuxt-app" da
|
|
test/csr/prod.test.ts > ssr: false, target: server, prod mode > render:
test/csr/prod.test.ts#L17
AssertionError: expected '<!DOCTYPE html><html data-capo=""><h…' to contain 'getItem(\'nuxt-color-mode\')'
- Expected
+ Received
- getItem('nuxt-color-mode')
+ <!DOCTYPE html><html data-capo=""><head><meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <link rel="stylesheet" href="/_nuxt/entry.BeA5LUrk.css">
+ <link rel="modulepreload" as="script" crossorigin href="/_nuxt/Vx0ECAV8.js">
+ <link rel="prefetch" as="style" href="/_nuxt/default.BfERDc1H.css">
+ <link rel="prefetch" as="style" href="/_nuxt/NuxtLogo.PVoRAFLQ.css">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/D-kJAy6z.js">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/CZaMv98m.js">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/BtzTUKvL.js">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/ucgUagT9.js">
+ <link rel="prefetch" as="style" href="/_nuxt/error-404.C3xcNO5b.css">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/CzYKgudz.js">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/DUu07QiN.js">
+ <link rel="prefetch" as="style" href="/_nuxt/error-500.B_ynad8U.css">
+ <link rel="prefetch" as="script" crossorigin href="/_nuxt/Civo6Oc9.js">
+ <script type="module" src="/_nuxt/Vx0ECAV8.js" crossorigin></script><script>// @ts-check
+
+ // Add dark / light detection that runs before loading Nuxt
+ (() => {
+ // Global variable minimizers
+ const w = window
+ const de = document.documentElement
+
+ const knownColorSchemes = ['dark', 'light']
+
+ const preference = getStorageValue('localStorage', 'nuxt-color-mode') || 'system'
+ let value = preference === 'system' ? getColorScheme() : preference
+ // Applied forced color mode
+ const forcedColorMode = de.getAttribute('data-color-mode-forced')
+ if (forcedColorMode) {
+ value = forcedColorMode
+ }
+
+ addColorScheme(value)
+
+ w['__NUXT_COLOR_MODE__'] = {
+ preference,
+ value,
+ getColorScheme,
+ addColorScheme,
+ removeColorScheme,
+ }
+
+ /** @param {string} value */
+ function addColorScheme(value) {
+ const className = '' + value + '-mode'
+ const dataValue = ''
+ if (de.classList) {
+ de.classList.add(className)
+ }
+ else {
+ de.className += ' ' + className
+ }
+ if (dataValue) {
+ de.setAttribute('data-' + dataValue, value)
+ }
+ }
+
+ /** @param {string} value */
+ function removeColorScheme(value) {
+ const className = '' + value + '-mode'
+ const dataValue = ''
+ if (de.classList) {
+ de.classList.remove(className)
+ }
+ else {
+ de.className = de.className.replace(new RegExp(className, 'g'), '')
+ }
+ if (dataValue) {
+ de.removeAttribute('data-' + dataValue)
+ }
+ }
+
+ /** @param {string} suffix */
+ function prefersColorScheme(suffix) {
+ return w.matchMedia('(prefers-color-scheme' + suffix + ')')
+ }
+
+ function getColorScheme() {
+ if (
+ // @ts-expect-error TS assumes matchMedia is always defined
+ w.matchMedia
+ && prefersColorScheme('').media !== 'not all') {
+ for (const colorScheme of knownColorSchemes) {
+ if (prefersColorScheme(':' + colorScheme).matches) {
+ return colorScheme
+ }
+ }
+ }
+
+ return 'light'
+ }
+ })()
+
+ // @ts-ignore
+ function getStorageValue(storageType, storageKey) {
+ switch (storageType) {
+ case 'localStorage':
+ return window.localStorage.getItem(storageKey)
+ case 'sessionStorage':
+ return window.sessionStorage.getItem(storageKey)
+ case 'cookie':
+ return getCookie(storageKey)
+ default:
+ return null
+ }
+ }
+
+ // @ts-ignore
+ function getCookie(name) {
+ const value = '; ' + window.document.cookie
+ const parts = value.split('; ' + name + '=')
+ if (parts.length === 2) {
+ return parts.pop()?.split(';').shift()
+ }
+ }</script></head><body><div id="__nuxt"></div><div id="teleports"></div><script type="application/json" data-nuxt-data="nuxt-app" da
|
|
test/ssr/dev.test.ts > ssr: true, dev mode > render:
test/ssr/dev.test.ts#L16
AssertionError: expected '<!DOCTYPE html><html data-capo=""><h…' to contain 'getItem(\'nuxt-color-mode\')'
- Expected
+ Received
- getItem('nuxt-color-mode')
+ <!DOCTYPE html><html data-capo=""><head><meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <title>Demo of @nuxtjs/color-mode</title>
+ <link rel="stylesheet" href="/_nuxt/@fs/Users/runner/work/color-mode/color-mode/node_modules/.pnpm/tailwindcss@3.4.10/node_modules/tailwindcss/tailwind.css">
+ <link rel="stylesheet" href="/_nuxt/assets/main.css">
+ <link rel="stylesheet" href="/_nuxt/Users/runner/work/color-mode/color-mode/node_modules/.pnpm/tailwindcss@3.4.10/node_modules/tailwindcss/tailwind.css">
+ <link rel="stylesheet" href="/_nuxt/components/ColorModePicker.vue?vue&type=style&index=0&scoped=28ab885e&lang.css">
+ <link rel="stylesheet" href="/_nuxt/layouts/default.vue?vue&type=style&index=0&lang.css">
+ <link rel="stylesheet" href="/_nuxt/components/NuxtLogo.vue?vue&type=style&index=0&scoped=70dd8bf5&lang.css">
+ <link rel="modulepreload" as="script" crossorigin href="/_nuxt/Users/runner/work/color-mode/color-mode/node_modules/.pnpm/nuxt@3.13.1_@opentelemetry+api@1.9.0_@parcel+watcher@2.4.1_@types+node@20.5.1_encoding@0.1.13_2w6lkzat2hmkdx4eohhdofbg3u/node_modules/nuxt/dist/app/entry.js">
+ <meta name="description" content="Demo of using @nuxtjs/color-mode for Nuxt, supporting dark mode and custom colors">
+ <script type="module" src="/_nuxt/@vite/client" crossorigin></script>
+ <script type="module" src="/_nuxt/Users/runner/work/color-mode/color-mode/node_modules/.pnpm/nuxt@3.13.1_@opentelemetry+api@1.9.0_@parcel+watcher@2.4.1_@types+node@20.5.1_encoding@0.1.13_2w6lkzat2hmkdx4eohhdofbg3u/node_modules/nuxt/dist/app/entry.js" crossorigin></script><script>// @ts-check
+
+ // Add dark / light detection that runs before loading Nuxt
+ (() => {
+ // Global variable minimizers
+ const w = window
+ const de = document.documentElement
+
+ const knownColorSchemes = ['dark', 'light']
+
+ const preference = getStorageValue('localStorage', 'nuxt-color-mode') || 'system'
+ let value = preference === 'system' ? getColorScheme() : preference
+ // Applied forced color mode
+ const forcedColorMode = de.getAttribute('data-color-mode-forced')
+ if (forcedColorMode) {
+ value = forcedColorMode
+ }
+
+ addColorScheme(value)
+
+ w['__NUXT_COLOR_MODE__'] = {
+ preference,
+ value,
+ getColorScheme,
+ addColorScheme,
+ removeColorScheme,
+ }
+
+ /** @param {string} value */
+ function addColorScheme(value) {
+ const className = '' + value + '-mode'
+ const dataValue = ''
+ if (de.classList) {
+ de.classList.add(className)
+ }
+ else {
+ de.className += ' ' + className
+ }
+ if (dataValue) {
+ de.setAttribute('data-' + dataValue, value)
+ }
+ }
+
+ /** @param {string} value */
+ function removeColorScheme(value) {
+ const className = '' + value + '-mode'
+ const dataValue = ''
+ if (de.classList) {
+ de.classList.remove(className)
+ }
+ else {
+ de.className = de.className.replace(new RegExp(className, 'g'), '')
+ }
+ if (dataValue) {
+ de.removeAttribute('data-' + dataValue)
+ }
+ }
+
+ /** @param {string} suffix */
+ function prefersColorScheme(suffix) {
+ return w.matchMedia('(prefers-color-scheme' + suffix + ')')
+ }
+
+ function getColorScheme() {
+ if (
+ // @ts-expect-error TS assumes matchMedia is always defined
+ w.matchMedia
+ && prefersColorScheme('').media !== 'not all') {
+ for (const colorScheme of knownColorSchemes) {
+ if (prefersColorScheme(':' + colorScheme).matches) {
+ return colorScheme
+ }
+ }
+ }
+
+ return 'light'
+ }
+ })()
+
+ // @ts-ignore
+ function getStorageValue(storageType, storageKey) {
+ switch (storageType) {
+ case 'localStorage':
+ return window.localStorage.getItem(storageKey)
+ case 'sessionStorage':
+ return window.sessionStorage.
|
|
test/ssr/generate.test.ts > ssr: true, target: static, generated files > generated file:
test/ssr/generate.test.ts#L28
AssertionError: expected '<!DOCTYPE html><html data-capo=""><h…' to match 'getItem(\'nuxt-color-mode\')'
- Expected
+ Received
- getItem('nuxt-color-mode')
+ <!DOCTYPE html><html data-capo=""><head><meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <title>Demo of @nuxtjs/color-mode</title>
+ <style>/*! tailwindcss v3.4.10 | MIT License | https://tailwindcss.com*/*,:after,:before{border:0 solid #e5e7eb;box-sizing:border-box}:after,:before{--tw-content:""}:host,html{line-height:1.5;-webkit-text-size-adjust:100%;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-feature-settings:normal;font-variation-settings:normal;tab-size:4;-webkit-tap-highlight-color:transparent}body{line-height:inherit;margin:0}hr{border-top-width:1px;color:inherit;height:0}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-size:1em;font-variation-settings:normal}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:initial}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}button,input,optgroup,select,textarea{color:inherit;font-family:inherit;font-feature-settings:inherit;font-size:100%;font-variation-settings:inherit;font-weight:inherit;letter-spacing:inherit;line-height:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:initial;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:initial}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::placeholder,textarea::placeholder{color:#9ca3af;opacity:1}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}[hidden]{display:none}*,::backdrop,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#3b82f680;--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@medi
|
|
test/ssr/prod.test.ts > ssr: true, target: server, prod mode > render:
test/ssr/prod.test.ts#L17
AssertionError: expected '<!DOCTYPE html><html data-capo=""><h…' to contain 'getItem(\'nuxt-color-mode\')'
- Expected
+ Received
- getItem('nuxt-color-mode')
+ <!DOCTYPE html><html data-capo=""><head><meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1">
+ <title>Demo of @nuxtjs/color-mode</title>
+ <style>/*! tailwindcss v3.4.10 | MIT License | https://tailwindcss.com*/*,:after,:before{border:0 solid #e5e7eb;box-sizing:border-box}:after,:before{--tw-content:""}:host,html{line-height:1.5;-webkit-text-size-adjust:100%;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-feature-settings:normal;font-variation-settings:normal;tab-size:4;-webkit-tap-highlight-color:transparent}body{line-height:inherit;margin:0}hr{border-top-width:1px;color:inherit;height:0}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-size:1em;font-variation-settings:normal}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:initial}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}button,input,optgroup,select,textarea{color:inherit;font-family:inherit;font-feature-settings:inherit;font-size:100%;font-variation-settings:inherit;font-weight:inherit;letter-spacing:inherit;line-height:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:initial;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:initial}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::placeholder,textarea::placeholder{color:#9ca3af;opacity:1}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}[hidden]{display:none}*,::backdrop,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#3b82f680;--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@me
|
|
ci (macos-latest, 20)
The operation was canceled.
|