fix: correctly handle ssr for `reactivity/window` (#14681)

pull/14682/head
Paolo Ricciuti 9 months ago committed by GitHub
parent 1d7f0fe313
commit edfc0a9c6a
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

@ -0,0 +1,5 @@
---
'svelte': patch
---
fix: correctly handle ssr for `reactivity/window`

@ -124,7 +124,7 @@ export const online = new ReactiveValue(
* `devicePixelRatio.current` is a reactive view of `window.devicePixelRatio`. On the server it is `undefined`. * `devicePixelRatio.current` is a reactive view of `window.devicePixelRatio`. On the server it is `undefined`.
* Note that behaviour differs between browsers on Chrome it will respond to the current zoom level, * Note that behaviour differs between browsers on Chrome it will respond to the current zoom level,
* on Firefox and Safari it won't. * on Firefox and Safari it won't.
* @type {{ get current(): number }} * @type {{ get current(): number | undefined }}
* @since 5.11.0 * @since 5.11.0
*/ */
export const devicePixelRatio = /* @__PURE__ */ new (class DevicePixelRatio { export const devicePixelRatio = /* @__PURE__ */ new (class DevicePixelRatio {
@ -144,11 +144,13 @@ export const devicePixelRatio = /* @__PURE__ */ new (class DevicePixelRatio {
} }
constructor() { constructor() {
if (BROWSER) {
this.#update(); this.#update();
} }
}
get current() { get current() {
get(this.#dpr); get(this.#dpr);
return window.devicePixelRatio; return BROWSER ? window.devicePixelRatio : undefined;
} }
})(); })();

@ -0,0 +1 @@
<!--[--><p>devicePixelRatio: </p> <p>innerHeight: </p> <p>innerWidth: </p> <p>online: </p> <p>outerHeight: </p> <p>outerWidth: </p> <p>screenLeft: </p> <p>screenTop: </p> <p>scrollX: </p> <p>scrollY: </p><!--]-->

@ -0,0 +1,14 @@
<script>
import { devicePixelRatio, innerHeight, innerWidth, online, outerHeight, outerWidth, screenLeft, screenTop, scrollX, scrollY } from "svelte/reactivity/window";
</script>
<p>devicePixelRatio: {devicePixelRatio.current}</p>
<p>innerHeight: {innerHeight.current}</p>
<p>innerWidth: {innerWidth.current}</p>
<p>online: {online.current}</p>
<p>outerHeight: {outerHeight.current}</p>
<p>outerWidth: {outerWidth.current}</p>
<p>screenLeft: {screenLeft.current}</p>
<p>screenTop: {screenTop.current}</p>
<p>scrollX: {scrollX.current}</p>
<p>scrollY: {scrollY.current}</p>

@ -2015,7 +2015,7 @@ declare module 'svelte/reactivity/window' {
* @since 5.11.0 * @since 5.11.0
*/ */
export const devicePixelRatio: { export const devicePixelRatio: {
get current(): number; get current(): number | undefined;
}; };
class ReactiveValue<T> { class ReactiveValue<T> {

Loading…
Cancel
Save