Skip to content

Commit 68d266e

Browse files
authored
fix: remove overzealous reactive_declaration_non_reactive_property warning (#14663)
fixes #14532 This removes the `reactive_declaration_non_reactive_property` warning altogether. The first version caused many false positives at compile time. The refined runtime version (introduced in #14192) was hoped to fix this, but it turns out we now get loads of false positives at runtime.
1 parent ea6fd95 commit 68d266e

File tree

10 files changed

+9
-170
lines changed

10 files changed

+9
-170
lines changed

.changeset/purple-adults-arrive.md

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
'svelte': patch
3+
---
4+
5+
fix: remove overzealous `reactive_declaration_non_reactive_property` warning

documentation/docs/98-reference/.generated/client-warnings.md

-40
Original file line numberDiff line numberDiff line change
@@ -204,46 +204,6 @@ Consider the following code:
204204
205205
To fix it, either create callback props to communicate changes, or mark `person` as [`$bindable`]($bindable).
206206
207-
### reactive_declaration_non_reactive_property
208-
209-
```
210-
A `$:` statement (%location%) read reactive state that was not visible to the compiler. Updates to this state will not cause the statement to re-run. The behaviour of this code will change if you migrate it to runes mode
211-
```
212-
213-
In legacy mode, a `$:` [reactive statement](https://svelte.dev/docs/svelte/legacy-reactive-assignments) re-runs when the state it _references_ changes. This is determined at compile time, by analysing the code.
214-
215-
In runes mode, effects and deriveds re-run when there are changes to the values that are read during the function's _execution_.
216-
217-
Often, the result is the same — for example these can be considered equivalent:
218-
219-
```js
220-
let a = 1, b = 2, sum = 3;
221-
// ---cut---
222-
$: sum = a + b;
223-
```
224-
225-
```js
226-
let a = 1, b = 2;
227-
// ---cut---
228-
const sum = $derived(a + b);
229-
```
230-
231-
In some cases — such as the one that triggered the above warning — they are _not_ the same:
232-
233-
```js
234-
let a = 1, b = 2, sum = 3;
235-
// ---cut---
236-
const add = () => a + b;
237-
238-
// the compiler can't 'see' that `sum` depends on `a` and `b`, but
239-
// they _would_ be read while executing the `$derived` version
240-
$: sum = add();
241-
```
242-
243-
Similarly, reactive properties of [deep state](https://svelte.dev/docs/svelte/$state#Deep-state) are not visible to the compiler. As such, changes to these properties will cause effects and deriveds to re-run but will _not_ cause `$:` statements to re-run.
244-
245-
When you [migrate this component](https://svelte.dev/docs/svelte/v5-migration-guide) to runes mode, the behaviour will change accordingly.
246-
247207
### state_proxy_equality_mismatch
248208
249209
```

packages/svelte/messages/client-warnings/warnings.md

-38
Original file line numberDiff line numberDiff line change
@@ -170,44 +170,6 @@ Consider the following code:
170170
171171
To fix it, either create callback props to communicate changes, or mark `person` as [`$bindable`]($bindable).
172172
173-
## reactive_declaration_non_reactive_property
174-
175-
> A `$:` statement (%location%) read reactive state that was not visible to the compiler. Updates to this state will not cause the statement to re-run. The behaviour of this code will change if you migrate it to runes mode
176-
177-
In legacy mode, a `$:` [reactive statement](https://svelte.dev/docs/svelte/legacy-reactive-assignments) re-runs when the state it _references_ changes. This is determined at compile time, by analysing the code.
178-
179-
In runes mode, effects and deriveds re-run when there are changes to the values that are read during the function's _execution_.
180-
181-
Often, the result is the same — for example these can be considered equivalent:
182-
183-
```js
184-
let a = 1, b = 2, sum = 3;
185-
// ---cut---
186-
$: sum = a + b;
187-
```
188-
189-
```js
190-
let a = 1, b = 2;
191-
// ---cut---
192-
const sum = $derived(a + b);
193-
```
194-
195-
In some cases — such as the one that triggered the above warning — they are _not_ the same:
196-
197-
```js
198-
let a = 1, b = 2, sum = 3;
199-
// ---cut---
200-
const add = () => a + b;
201-
202-
// the compiler can't 'see' that `sum` depends on `a` and `b`, but
203-
// they _would_ be read while executing the `$derived` version
204-
$: sum = add();
205-
```
206-
207-
Similarly, reactive properties of [deep state](https://svelte.dev/docs/svelte/$state#Deep-state) are not visible to the compiler. As such, changes to these properties will cause effects and deriveds to re-run but will _not_ cause `$:` statements to re-run.
208-
209-
When you [migrate this component](https://svelte.dev/docs/svelte/v5-migration-guide) to runes mode, the behaviour will change accordingly.
210-
211173
## state_proxy_equality_mismatch
212174
213175
> Reactive `$state(...)` proxies and the values they proxy have different identities. Because of this, comparisons with `%operator%` will produce unexpected results

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

+1-8
Original file line numberDiff line numberDiff line change
@@ -50,21 +50,14 @@ export function LabeledStatement(node, context) {
5050
sequence.push(serialized);
5151
}
5252

53-
const location =
54-
dev && !is_ignored(node, 'reactive_declaration_non_reactive_property')
55-
? locator(/** @type {number} */ (node.start))
56-
: undefined;
57-
5853
// these statements will be topologically ordered later
5954
context.state.legacy_reactive_statements.set(
6055
node,
6156
b.stmt(
6257
b.call(
6358
'$.legacy_pre_effect',
6459
sequence.length > 0 ? b.thunk(b.sequence(sequence)) : b.thunk(b.block([])),
65-
b.thunk(b.block(body)),
66-
location && b.literal(location.line),
67-
location && b.literal(location.column)
60+
b.thunk(b.block(body))
6861
)
6962
)
7063
);

packages/svelte/src/constants.js

+1-2
Original file line numberDiff line numberDiff line change
@@ -44,8 +44,7 @@ export const IGNORABLE_RUNTIME_WARNINGS = /** @type {const} */ ([
4444
'hydration_attribute_changed',
4545
'hydration_html_changed',
4646
'ownership_invalid_binding',
47-
'ownership_invalid_mutation',
48-
'reactive_declaration_non_reactive_property'
47+
'ownership_invalid_mutation'
4948
]);
5049

5150
/**

packages/svelte/src/internal/client/reactivity/effects.js

+2-20
Original file line numberDiff line numberDiff line change
@@ -265,21 +265,14 @@ export function effect(fn) {
265265
* Internal representation of `$: ..`
266266
* @param {() => any} deps
267267
* @param {() => void | (() => void)} fn
268-
* @param {number} [line]
269-
* @param {number} [column]
270268
*/
271-
export function legacy_pre_effect(deps, fn, line, column) {
269+
export function legacy_pre_effect(deps, fn) {
272270
var context = /** @type {ComponentContextLegacy} */ (component_context);
273271

274272
/** @type {{ effect: null | Effect, ran: boolean }} */
275273
var token = { effect: null, ran: false };
276274
context.l.r1.push(token);
277275

278-
if (DEV && line !== undefined) {
279-
var location = get_location(line, column);
280-
var explicit_deps = capture_signals(deps);
281-
}
282-
283276
token.effect = render_effect(() => {
284277
deps();
285278

@@ -289,18 +282,7 @@ export function legacy_pre_effect(deps, fn, line, column) {
289282

290283
token.ran = true;
291284
set(context.l.r2, true);
292-
293-
if (DEV && location) {
294-
var implicit_deps = capture_signals(() => untrack(fn));
295-
296-
for (var signal of implicit_deps) {
297-
if (!explicit_deps.has(signal)) {
298-
w.reactive_declaration_non_reactive_property(/** @type {string} */ (location));
299-
}
300-
}
301-
} else {
302-
untrack(fn);
303-
}
285+
untrack(fn);
304286
});
305287
}
306288

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

-12
Original file line numberDiff line numberDiff line change
@@ -155,18 +155,6 @@ export function ownership_invalid_mutation(component, owner) {
155155
}
156156
}
157157

158-
/**
159-
* A `$:` statement (%location%) read reactive state that was not visible to the compiler. Updates to this state will not cause the statement to re-run. The behaviour of this code will change if you migrate it to runes mode
160-
* @param {string} location
161-
*/
162-
export function reactive_declaration_non_reactive_property(location) {
163-
if (DEV) {
164-
console.warn(`%c[svelte] reactive_declaration_non_reactive_property\n%cA \`$:\` statement (${location}) read reactive state that was not visible to the compiler. Updates to this state will not cause the statement to re-run. The behaviour of this code will change if you migrate it to runes mode\nhttps://svelte.dev/e/reactive_declaration_non_reactive_property`, bold, normal);
165-
} else {
166-
console.warn(`https://svelte.dev/e/reactive_declaration_non_reactive_property`);
167-
}
168-
}
169-
170158
/**
171159
* Reactive `$state(...)` proxies and the values they proxy have different identities. Because of this, comparisons with `%operator%` will produce unexpected results
172160
* @param {string} operator

packages/svelte/tests/runtime-legacy/samples/reactive-statement-non-reactive-import-statement/_config.js

-26
This file was deleted.

packages/svelte/tests/runtime-legacy/samples/reactive-statement-non-reactive-import-statement/data.svelte.js

-11
This file was deleted.

packages/svelte/tests/runtime-legacy/samples/reactive-statement-non-reactive-import-statement/main.svelte

-13
This file was deleted.

0 commit comments

Comments
 (0)