svelte - npm Package Compare versions

Comparing version 5.0.0-next.187 to 5.0.0-next.188

package.json

@@ -5,3 +5,3 @@ {
   "license": "MIT",
-  "version": "5.0.0-next.187",
+  "version": "5.0.0-next.188",
   "type": "module",
@@ -8,0 +8,0 @@ "types": "./types/index.d.ts",

src/compiler/phases/3-transform/client/transform-client.js

@@ -421,3 +421,3 @@ /** @import * as ESTree from 'estree' */
 		const accept_fn_body = [
-			b.stmt(b.call('$.set', b.id('s'), b.member(b.id('module.default'), b.id('original'))))
+			b.stmt(b.call('$.set', b.id('s'), b.member(b.id('module.default'), b.id('$.ORIGINAL'), true)))
 		];
@@ -450,3 +450,7 @@
 			b.stmt(
-				b.assignment('=', b.member(b.id(analysis.name), b.id('original')), b.id('$$original'))
+				b.assignment(
+					'=',
+					b.member(b.id(analysis.name), b.id('$.ORIGINAL'), true),
+					b.id('$$original')
+				)
 			),
@@ -463,6 +467,10 @@ b.stmt(b.call('import.meta.hot.accept', b.arrow([b.id('module')], b.block(accept_fn_body))))
 		if (filename) {
-			// add `App.filename = 'App.svelte'` so that we can print useful messages later
+			// add `App[$.FILENAME] = 'App.svelte'` so that we can print useful messages later
 			body.unshift(
 				b.stmt(
-					b.assignment('=', b.member(b.id(analysis.name), b.id('filename')), b.literal(filename))
+					b.assignment(
+						'=',
+						b.member(b.id(analysis.name), b.id('$.FILENAME'), true),
+						b.literal(filename)
+					)
 				)
@@ -469,0 +477,0 @@ );

src/constants.js

@@ -33,2 +33,6 @@ export const EACH_ITEM_REACTIVE = 1;
 
+// Dev-time component properties
+export const FILENAME = Symbol('filename');
+export const ORIGINAL = Symbol('original');
+
 /** List of elements that require raw contents and should not have SSR comments put in them */
@@ -35,0 +39,0 @@ export const RawTextElements = ['textarea', 'script', 'style', 'title'];

src/internal/client/dev/legacy.js

 import * as e from '../errors.js';
 import { current_component_context } from '../runtime.js';
+import { FILENAME } from '../../../constants.js';
 import { get_component } from './ownership.js';
 
-/** @param {Function & { filename: string }} target */
+/** @param {Function & { [FILENAME]: string }} target */
 export function check_target(target) {
 	if (target) {
-		e.component_api_invalid_new(target.filename ?? 'a component', target.name);
+		e.component_api_invalid_new(target[FILENAME] ?? 'a component', target.name);
 	}
@@ -18,4 +19,4 @@ }
 		// @ts-expect-error
-		const parent = get_component()?.filename ?? 'Something';
-		e.component_api_changed(parent, method, component.filename);
+		const parent = get_component()?.[FILENAME] ?? 'Something';
+		e.component_api_changed(parent, method, component[FILENAME]);
 	}
@@ -22,0 +23,0 @@

src/internal/client/dev/ownership.js

@@ -9,2 +9,3 @@ /** @import { ProxyMetadata } from '#client' */
 import * as w from '../warnings.js';
+import { FILENAME } from '../../../constants.js';
 
@@ -119,4 +120,4 @@ /** @type {Record<string, Array<{ start: Location, end: Location, component: Function }>>} */
 
-			if (owner.filename !== component.filename) {
-				w.ownership_invalid_binding(component.filename, owner.filename, original.filename);
+			if (owner[FILENAME] !== component[FILENAME]) {
+				w.ownership_invalid_binding(component[FILENAME], owner[FILENAME], original[FILENAME]);
 			}
@@ -241,5 +242,5 @@ }
 		// @ts-expect-error
-		if (original.filename !== component.filename) {
+		if (original[FILENAME] !== component[FILENAME]) {
 			// @ts-expect-error
-			w.ownership_invalid_mutation(component.filename, original.filename);
+			w.ownership_invalid_mutation(component[FILENAME], original[FILENAME]);
 		} else {
@@ -246,0 +247,0 @@ w.ownership_invalid_mutation();

src/internal/client/dom/blocks/html.js

 /** @import { Effect, TemplateNode } from '#client' */
-import { HYDRATION_ERROR } from '../../../../constants.js';
+import { FILENAME, HYDRATION_ERROR } from '../../../../constants.js';
 import { block, branch, destroy_effect } from '../../reactivity/effects.js';
@@ -26,4 +26,4 @@ import { hydrate_next, hydrate_node, hydrating, set_hydrate_node } from '../hydration.js';
 		location = `near ${loc.file}:${loc.line}:${loc.column}`;
-	} else if (dev_current_component_function?.filename) {
-		location = `in ${dev_current_component_function.filename}`;
+	} else if (dev_current_component_function?.[FILENAME]) {
+		location = `in ${dev_current_component_function[FILENAME]}`;
 	}
@@ -30,0 +30,0 @@

src/internal/client/dom/blocks/svelte-element.js

 /** @import { Effect, EffectNodes, TemplateNode } from '#client' */
-import { namespace_svg } from '../../../../constants.js';
+import { FILENAME, namespace_svg } from '../../../../constants.js';
 import {
@@ -41,3 +41,3 @@ hydrate_next,
 
-	var filename = DEV && location && current_component_context?.function.filename;
+	var filename = DEV && location && current_component_context?.function[FILENAME];
 
@@ -44,0 +44,0 @@ /** @type {string | null} */

src/internal/client/index.js

@@ -0,1 +1,2 @@
+export { FILENAME, ORIGINAL } from '../../constants.js';
 export { add_locations } from './dev/elements.js';
@@ -2,0 +3,0 @@ export { hmr } from './dev/hmr.js';

src/internal/client/runtime.js

@@ -32,2 +32,3 @@ import { DEV } from 'esm-env';
 import { lifecycle_outside_component } from '../shared/errors.js';
+import { FILENAME } from '../../constants.js';
 
@@ -230,3 +231,3 @@ const FLUSH_MICROTASK = 0;
 		/** @type {string} */
-		var filename = current_context.function?.filename;
+		var filename = current_context.function?.[FILENAME];
 
@@ -233,0 +234,0 @@ if (filename) {

src/internal/client/validate.js

 import { untrack } from './runtime.js';
 import { get_descriptor, is_array } from '../shared/utils.js';
 import * as e from './errors.js';
+import { FILENAME } from '../../constants.js';
 
@@ -73,3 +74,3 @@ /** regex of all html void element names */
  * @param {string[]} exports
- * @param {Function & { filename: string }} component
+ * @param {Function & { [FILENAME]: string }} component
  */
@@ -83,7 +84,7 @@ export function validate_prop_bindings($$props, bindable, exports, component) {
 			if (exports.includes(key)) {
-				e.bind_invalid_export(component.filename, key, name);
+				e.bind_invalid_export(component[FILENAME], key, name);
 			}
 
 			if (!bindable.includes(key)) {
-				e.bind_not_bindable(key, component.filename, name);
+				e.bind_not_bindable(key, component[FILENAME], name);
 			}
@@ -90,0 +91,0 @@ }

src/internal/server/dev.js

 import {
+	FILENAME,
 	disallowed_paragraph_contents,
@@ -59,3 +60,3 @@ interactive_elements,
 export function push_element(payload, tag, line, column) {
-	var filename = /** @type {import('#server').Component} */ (current_component).function.filename;
+	var filename = /** @type {import('#server').Component} */ (current_component).function[FILENAME];
 	var child = { tag, parent, filename, line, column };
@@ -62,0 +63,0 @@

src/internal/server/index.js

 /** @import { Component, Payload, RenderOutput } from '#server' */
 /** @import { Store } from '#shared' */
+export { FILENAME, ORIGINAL } from '../../constants.js';
 import { is_promise, noop } from '../shared/utils.js';
@@ -4,0 +5,0 @@ import { subscribe_to_store } from '../../store/utils.js';

src/internal/shared/clone.js

 /** @import { Snapshot } from './types' */
+import { DEV } from 'esm-env';
+import * as w from './warnings.js';
 import { get_prototype_of, is_array, object_prototype } from './utils.js';
 
 /**
+ * In dev, we keep track of which properties could not be cloned. In prod
+ * we don't bother, but we keep a dummy array around so that the
+ * signature stays the same
+ * @type {string[]}
+ */
+const empty = [];
+
+/**
  * @template T
@@ -10,3 +20,25 @@ * @param {T} value
 export function snapshot(value) {
-	return clone(value, new Map());
+	if (DEV) {
+		/** @type {string[]} */
+		const paths = [];
+
+		const copy = clone(value, new Map(), '', paths);
+		if (paths.length === 1 && paths[0] === '') {
+			// value could not be cloned
+			w.state_snapshot_uncloneable();
+		} else if (paths.length > 0) {
+			// some properties could not be cloned
+			const slice = paths.length > 10 ? paths.slice(0, 7) : paths.slice(0, 10);
+			const excess = paths.length - slice.length;
+
+			let uncloned = slice.map((path) => `- <value>${path}`).join('\n');
+			if (excess > 0) uncloned += `\n- ...and ${excess} more`;
+
+			w.state_snapshot_uncloneable(uncloned);
+		}
+
+		return copy;
+	}
+
+	return clone(value, new Map(), '', empty);
 }
@@ -18,5 +50,7 @@
  * @param {Map<T, Snapshot<T>>} cloned
+ * @param {string} path
+ * @param {string[]} paths
  * @returns {Snapshot<T>}
  */
-function clone(value, cloned) {
+function clone(value, cloned, path, paths) {
 	if (typeof value === 'object' && value !== null) {
@@ -30,4 +64,4 @@ const unwrapped = cloned.get(value);
 
-			for (const element of value) {
-				copy.push(clone(element, cloned));
+			for (let i = 0; i < value.length; i += 1) {
+				copy.push(clone(value[i], cloned, DEV ? `${path}[${i}]` : path, paths));
 			}
@@ -45,3 +79,3 @@
 				// @ts-expect-error
-				copy[key] = clone(value[key], cloned);
+				copy[key] = clone(value[key], cloned, DEV ? `${path}.${key}` : path, paths);
 			}
@@ -53,7 +87,25 @@
 		if (typeof (/** @type {T & { toJSON?: any } } */ (value).toJSON) === 'function') {
-			return clone(/** @type {T & { toJSON(): any } } */ (value).toJSON(), cloned);
+			return clone(
+				/** @type {T & { toJSON(): any } } */ (value).toJSON(),
+				cloned,
+				DEV ? `${path}.toJSON()` : path,
+				paths
+			);
 		}
 	}
 
-	return /** @type {Snapshot<T>} */ (structuredClone(value));
+	if (value instanceof EventTarget) {
+		// can't be cloned
+		return /** @type {Snapshot<T>} */ (value);
+	}
+
+	try {
+		return /** @type {Snapshot<T>} */ (structuredClone(value));
+	} catch (e) {
+		if (DEV) {
+			paths.push(path);
+		}
+
+		return /** @type {Snapshot<T>} */ (value);
+	}
 }

src/internal/shared/warnings.js

@@ -19,2 +19,21 @@ /* This file is generated by scripts/process-messages/index.js. Do not edit! */
 	}
+}
+
+/**
+ * The following properties cannot be cloned with `$state.snapshot` — the return value contains the originals:
+ * 
+ * %properties%
+ * @param {string | undefined | null} [properties]
+ */
+export function state_snapshot_uncloneable(properties) {
+	if (DEV) {
+		console.warn(`%c[svelte] state_snapshot_uncloneable\n%c${properties
+			? `The following properties cannot be cloned with \`$state.snapshot\` — the return value contains the originals:
+
+${properties}`
+			: "Value cannot be cloned with `$state.snapshot` — the original value was returned"}`, bold, normal);
+	} else {
+		// TODO print a link to the documentation
+		console.warn("state_snapshot_uncloneable");
+	}
 }

src/version.js

@@ -9,3 +9,3 @@ // generated during release, do not modify
  */
-export const VERSION = '5.0.0-next.187';
+export const VERSION = '5.0.0-next.188';
 export const PUBLIC_VERSION = '5';

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

2144483

increased by0.12%

Lines of code

47186

increased by0.18%

No dependency changes