remove PROXY_REMOVE_PATH (#16126)

* remove PROXY_REMOVE_PATH

* simplify a bit

* simplify

* tweak

* tweak implementation

* tweak implementation

* tweak implementation

* hoist

* tweak

* fix

* WIP (reduce number of with_parent calls, move towards possibility of combining tag and tag_proxy)

* DRY out

Author: Rich-Harris

packages/svelte/src/compiler/phases/3-transform/client/visitors/VariableDeclaration.js

@@ -9,7 +9,6 @@ import { get_rune } from '../../../scope.js';
 import { get_prop_source, is_prop_source, is_state_source, should_proxy } from '../utils.js';
 import { is_hoisted_function } from '../../utils.js';
 import { get_value } from './shared/declarations.js';
-import { PROXY_REMOVE_PATH } from '#client/constants';
 
 /**
  * @param {VariableDeclaration} node
@@ -90,12 +89,11 @@ export function VariableDeclaration(node, context) {
 								binding.kind === 'bindable_prop' &&
 								should_proxy(initial, context.state.scope)
 							) {
-								initial = b.call(
-									'$.proxy',
-									initial,
-									dev ? b.literal(id.name) : undefined,
-									dev ? b.literal(PROXY_REMOVE_PATH) : undefined
-								);
+								initial = b.call('$.proxy', initial);
+
+								if (dev) {
+									initial = b.call('$.tag_proxy', initial, b.literal(id.name));
+								}
 							}
 
 							if (is_prop_source(binding, context.state)) {
@@ -136,20 +134,23 @@ export function VariableDeclaration(node, context) {
 					);
 					const is_state = is_state_source(binding, context.state.analysis);
 					const is_proxy = should_proxy(value, context.state.scope);
+
 					if (rune === '$state' && is_proxy) {
-						value = b.call(
-							'$.proxy',
-							value,
-							dev ? b.literal(id.name) : undefined,
-							dev ? b.literal(PROXY_REMOVE_PATH) : undefined
-						);
+						value = b.call('$.proxy', value);
+
+						if (dev && !is_state) {
+							value = b.call('$.tag_proxy', value, b.literal(id.name));
+						}
 					}
+
 					if (is_state) {
 						value = b.call('$.state', value);
+
+						if (dev) {
+							value = b.call('$.tag', value, b.literal(id.name));
+						}
 					}
-					if (dev && is_state) {
-						value = b.call('$.tag', value, b.literal(id.name));
-					}
+
 					return value;
 				};
 

packages/svelte/src/internal/client/constants.js

@@ -22,14 +22,6 @@ export const HEAD_EFFECT = 1 << 19;
 export const EFFECT_HAS_DERIVED = 1 << 20;
 export const EFFECT_IS_UPDATING = 1 << 21;
 
-// `$inspect.trace` proxy path flags
-/** Keep path the same */
-export const PROXY_PRESERVE_PATH = 1 << 1;
-/** Change proxy path to new "owner" */
-export const PROXY_CHANGE_PATH = 1 << 2;
-/** "Unown" proxy, so its path becomes `[$state proxy]` */
-export const PROXY_REMOVE_PATH = 1 << 3;
-
 export const STATE_SYMBOL = Symbol('$state');
 export const LEGACY_PROPS = Symbol('legacy props');
 export const LOADING_ATTR_SYMBOL = Symbol('');

packages/svelte/src/internal/client/dev/tracing.js

@@ -2,7 +2,7 @@
 import { UNINITIALIZED } from '../../../constants.js';
 import { snapshot } from '../../shared/clone.js';
 import { define_property } from '../../shared/utils.js';
-import { DERIVED, STATE_SYMBOL } from '#client/constants';
+import { DERIVED, PROXY_PATH_SYMBOL, STATE_SYMBOL } from '#client/constants';
 import { effect_tracking } from '../reactivity/effects.js';
 import { active_reaction, captured_signals, set_captured_signals, untrack } from '../runtime.js';
 
@@ -43,7 +43,7 @@ function log_entry(signal, entry) {
 	const type = (signal.f & DERIVED) !== 0 ? '$derived' : '$state';
 	const current_reaction = /** @type {Reaction} */ (active_reaction);
 	const dirty = signal.wv > current_reaction.wv || current_reaction.wv === 0;
-	const { trace_name: name } = signal;
+	const { label: name } = signal;
 	const style = dirty
 		? 'color: CornflowerBlue; font-weight: bold'
 		: 'color: grey; font-weight: normal';
@@ -183,13 +183,25 @@ export function get_stack(label) {
 
 /**
  * @param {Value} source
- * @param {string} name
+ * @param {string} label
  */
-export function tag(source, name) {
-	source.trace_name = name;
+export function tag(source, label) {
+	source.label = label;
+	tag_proxy(source.v, label);
+
 	return source;
 }
 
+/**
+ * @param {unknown} value
+ * @param {string} label
+ */
+export function tag_proxy(value, label) {
+	// @ts-expect-error
+	value?.[PROXY_PATH_SYMBOL]?.(label);
+	return value;
+}
+
 /**
  * @param {unknown} value
  */

packages/svelte/src/internal/client/index.js

@@ -7,7 +7,7 @@ export { add_locations } from './dev/elements.js';
 export { hmr } from './dev/hmr.js';
 export { create_ownership_validator } from './dev/ownership.js';
 export { check_target, legacy_api } from './dev/legacy.js';
-export { trace, tag } from './dev/tracing.js';
+export { trace, tag, tag_proxy } from './dev/tracing.js';
 export { inspect } from './dev/inspect.js';
 export { validate_snippet_args } from './dev/validation.js';
 export { await_block as await } from './dom/blocks/await.js';