Skip to content

Commit 07b0db8

Browse files
Rich-HarrisRich-Harris
authored
feat: move dev-time component properties to private symbols (#12461)
* add a FILENAME symbol * feat: move dev-time component properties to private symbols * lint
1 parent e196bb2 commit 07b0db8

File tree

15 files changed

+55
-27
lines changed

15 files changed

+55
-27
lines changed

‎.changeset/fluffy-colts-grin.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
'svelte': patch
3+
---
4+
5+
feat: move dev-time component properties to private symbols'

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

Lines changed: 12 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -418,7 +418,7 @@ export function client_component(source, analysis, options) {
418418

419419
if (options.hmr) {
420420
const accept_fn_body = [
421-
b.stmt(b.call('$.set', b.id('s'), b.member(b.id('module.default'), b.id('original'))))
421+
b.stmt(b.call('$.set', b.id('s'), b.member(b.id('module.default'), b.id('$.ORIGINAL'), true)))
422422
];
423423

424424
if (analysis.css.hash) {
@@ -446,7 +446,11 @@ export function client_component(source, analysis, options) {
446446
// Assign the original component to the wrapper so we can use it on hot reload patching,
447447
// else we would call the HMR function two times
448448
b.stmt(
449-
b.assignment('=', b.member(b.id(analysis.name), b.id('original')), b.id('$$original'))
449+
b.assignment(
450+
'=',
451+
b.member(b.id(analysis.name), b.id('$.ORIGINAL'), true),
452+
b.id('$$original')
453+
)
450454
),
451455
b.stmt(b.call('import.meta.hot.accept', b.arrow([b.id('module')], b.block(accept_fn_body))))
452456
]);
@@ -458,10 +462,14 @@ export function client_component(source, analysis, options) {
458462

459463
if (options.dev) {
460464
if (filename) {
461-
// add `App.filename = 'App.svelte'` so that we can print useful messages later
465+
// add `App[$.FILENAME] = 'App.svelte'` so that we can print useful messages later
462466
body.unshift(
463467
b.stmt(
464-
b.assignment('=', b.member(b.id(analysis.name), b.id('filename')), b.literal(filename))
468+
b.assignment(
469+
'=',
470+
b.member(b.id(analysis.name), b.id('$.FILENAME'), true),
471+
b.literal(filename)
472+
)
465473
)
466474
);
467475
}

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

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1640,7 +1640,7 @@ export const template_visitors = {
16401640
call = b.call(
16411641
'$.add_locations',
16421642
call,
1643-
b.member(b.id(context.state.analysis.name), b.id('filename')),
1643+
b.member(b.id(context.state.analysis.name), b.id('$.FILENAME'), true),
16441644
serialize_locations(state.locations)
16451645
);
16461646
}

‎packages/svelte/src/compiler/phases/3-transform/server/transform-server.js

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2249,10 +2249,14 @@ export function server_component(analysis, options) {
22492249
}
22502250

22512251
if (options.dev && filename) {
2252-
// add `App.filename = 'App.svelte'` so that we can print useful messages later
2252+
// add `App[$.FILENAME] = 'App.svelte'` so that we can print useful messages later
22532253
body.unshift(
22542254
b.stmt(
2255-
b.assignment('=', b.member(b.id(analysis.name), b.id('filename')), b.literal(filename))
2255+
b.assignment(
2256+
'=',
2257+
b.member(b.id(analysis.name), b.id('$.FILENAME'), true),
2258+
b.literal(filename)
2259+
)
22562260
)
22572261
);
22582262
}

‎packages/svelte/src/constants.js

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,10 @@ export const ELEMENT_PRESERVE_ATTRIBUTE_CASE = 1 << 1;
3030

3131
export const UNINITIALIZED = Symbol();
3232

33+
// Dev-time component properties
34+
export const FILENAME = Symbol('filename');
35+
export const ORIGINAL = Symbol('original');
36+
3337
/** List of elements that require raw contents and should not have SSR comments put in them */
3438
export const RawTextElements = ['textarea', 'script', 'style', 'title'];
3539

‎packages/svelte/src/internal/client/dev/legacy.js

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,12 @@
11
import * as e from '../errors.js';
22
import { current_component_context } from '../runtime.js';
3+
import { FILENAME } from '../../../constants.js';
34
import { get_component } from './ownership.js';
45

5-
/** @param {Function & { filename: string }} target */
6+
/** @param {Function & { [FILENAME]: string }} target */
67
export function check_target(target) {
78
if (target) {
8-
e.component_api_invalid_new(target.filename ?? 'a component', target.name);
9+
e.component_api_invalid_new(target[FILENAME] ?? 'a component', target.name);
910
}
1011
}
1112

@@ -15,8 +16,8 @@ export function legacy_api() {
1516
/** @param {string} method */
1617
function error(method) {
1718
// @ts-expect-error
18-
const parent = get_component()?.filename ?? 'Something';
19-
e.component_api_changed(parent, method, component.filename);
19+
const parent = get_component()?.[FILENAME] ?? 'Something';
20+
e.component_api_changed(parent, method, component[FILENAME]);
2021
}
2122

2223
return {

‎packages/svelte/src/internal/client/dev/ownership.js

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ import { render_effect, user_pre_effect } from '../reactivity/effects.js';
66
import { dev_current_component_function } from '../runtime.js';
77
import { get_prototype_of } from '../../shared/utils.js';
88
import * as w from '../warnings.js';
9+
import { FILENAME } from '../../../constants.js';
910

1011
/** @type {Record<string, Array<{ start: Location, end: Location, component: Function }>>} */
1112
const boundaries = {};
@@ -115,8 +116,8 @@ export function add_owner(object, owner, global = false) {
115116
if (metadata && !has_owner(metadata, component)) {
116117
let original = get_owner(metadata);
117118

118-
if (owner.filename !== component.filename) {
119-
w.ownership_invalid_binding(component.filename, owner.filename, original.filename);
119+
if (owner[FILENAME] !== component[FILENAME]) {
120+
w.ownership_invalid_binding(component[FILENAME], owner[FILENAME], original[FILENAME]);
120121
}
121122
}
122123
}
@@ -236,9 +237,9 @@ export function check_ownership(metadata) {
236237
let original = get_owner(metadata);
237238

238239
// @ts-expect-error
239-
if (original.filename !== component.filename) {
240+
if (original[FILENAME] !== component[FILENAME]) {
240241
// @ts-expect-error
241-
w.ownership_invalid_mutation(component.filename, original.filename);
242+
w.ownership_invalid_mutation(component[FILENAME], original[FILENAME]);
242243
} else {
243244
w.ownership_invalid_mutation();
244245
}

‎packages/svelte/src/internal/client/dom/blocks/html.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
/** @import { Effect, TemplateNode } from '#client' */
2-
import { HYDRATION_ERROR } from '../../../../constants.js';
2+
import { FILENAME, HYDRATION_ERROR } from '../../../../constants.js';
33
import { block, branch, destroy_effect } from '../../reactivity/effects.js';
44
import { hydrate_next, hydrate_node, hydrating, set_hydrate_node } from '../hydration.js';
55
import { create_fragment_from_html } from '../reconciler.js';
@@ -23,8 +23,8 @@ function check_hash(element, server_hash, value) {
2323
const loc = element.__svelte_meta?.loc;
2424
if (loc) {
2525
location = `near ${loc.file}:${loc.line}:${loc.column}`;
26-
} else if (dev_current_component_function?.filename) {
27-
location = `in ${dev_current_component_function.filename}`;
26+
} else if (dev_current_component_function?.[FILENAME]) {
27+
location = `in ${dev_current_component_function[FILENAME]}`;
2828
}
2929

3030
w.hydration_html_changed(

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

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
/** @import { Effect, EffectNodes, TemplateNode } from '#client' */
2-
import { namespace_svg } from '../../../../constants.js';
2+
import { FILENAME, namespace_svg } from '../../../../constants.js';
33
import {
44
hydrate_next,
55
hydrate_node,
@@ -38,7 +38,7 @@ export function element(node, get_tag, is_svg, render_fn, get_namespace, locatio
3838
hydrate_next();
3939
}
4040

41-
var filename = DEV && location && current_component_context?.function.filename;
41+
var filename = DEV && location && current_component_context?.function[FILENAME];
4242

4343
/** @type {string | null} */
4444
var tag;

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

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
export { FILENAME, ORIGINAL } from '../../constants.js';
12
export { add_locations } from './dev/elements.js';
23
export { hmr } from './dev/hmr.js';
34
export {

‎packages/svelte/src/internal/client/runtime.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -29,6 +29,7 @@ import { mutate, set, source } from './reactivity/sources.js';
2929
import { update_derived } from './reactivity/deriveds.js';
3030
import * as e from './errors.js';
3131
import { lifecycle_outside_component } from '../shared/errors.js';
32+
import { FILENAME } from '../../constants.js';
3233

3334
const FLUSH_MICROTASK = 0;
3435
const FLUSH_SYNC = 1;
@@ -226,7 +227,7 @@ function handle_error(error, effect, component_context) {
226227

227228
while (current_context !== null) {
228229
/** @type {string} */
229-
var filename = current_context.function?.filename;
230+
var filename = current_context.function?.[FILENAME];
230231

231232
if (filename) {
232233
const file = filename.split('/').pop();

‎packages/svelte/src/internal/client/validate.js

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import { untrack } from './runtime.js';
22
import { get_descriptor, is_array } from '../shared/utils.js';
33
import * as e from './errors.js';
4+
import { FILENAME } from '../../constants.js';
45

56
/** regex of all html void element names */
67
const void_element_names =
@@ -70,7 +71,7 @@ export function validate_each_keys(collection, key_fn) {
7071
* @param {Record<string, any>} $$props
7172
* @param {string[]} bindable
7273
* @param {string[]} exports
73-
* @param {Function & { filename: string }} component
74+
* @param {Function & { [FILENAME]: string }} component
7475
*/
7576
export function validate_prop_bindings($$props, bindable, exports, component) {
7677
for (const key in $$props) {
@@ -79,11 +80,11 @@ export function validate_prop_bindings($$props, bindable, exports, component) {
7980

8081
if (setter) {
8182
if (exports.includes(key)) {
82-
e.bind_invalid_export(component.filename, key, name);
83+
e.bind_invalid_export(component[FILENAME], key, name);
8384
}
8485

8586
if (!bindable.includes(key)) {
86-
e.bind_not_bindable(key, component.filename, name);
87+
e.bind_not_bindable(key, component[FILENAME], name);
8788
}
8889
}
8990
}

‎packages/svelte/src/internal/server/dev.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import {
2+
FILENAME,
23
disallowed_paragraph_contents,
34
interactive_elements,
45
is_tag_valid_with_parent
@@ -56,7 +57,7 @@ function print_error(payload, parent, child) {
5657
* @param {number} column
5758
*/
5859
export function push_element(payload, tag, line, column) {
59-
var filename = /** @type {import('#server').Component} */ (current_component).function.filename;
60+
var filename = /** @type {import('#server').Component} */ (current_component).function[FILENAME];
6061
var child = { tag, parent, filename, line, column };
6162

6263
if (parent !== null && !is_tag_valid_with_parent(tag, parent.tag)) {

‎packages/svelte/src/internal/server/index.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
/** @import { Component, Payload, RenderOutput } from '#server' */
22
/** @import { Store } from '#shared' */
3+
export { FILENAME, ORIGINAL } from '../../constants.js';
34
import { is_promise, noop } from '../shared/utils.js';
45
import { subscribe_to_store } from '../../store/utils.js';
56
import {

‎packages/svelte/tests/snapshot/samples/hmr/_expected/client/index.svelte.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -16,10 +16,10 @@ if (import.meta.hot) {
1616

1717
Hmr = $.hmr(s);
1818
Hmr.filename = filename;
19-
Hmr.original = $$original;
19+
Hmr[$.ORIGINAL] = $$original;
2020

2121
import.meta.hot.accept((module) => {
22-
$.set(s, module.default.original);
22+
$.set(s, module.default[$.ORIGINAL]);
2323
});
2424
}
2525

0 commit comments

Comments
 (0)