Skip to content

Commit 67bd6aa

Browse files
committed
fix(ssr): disallow @wire on computed props
1 parent 7fbcefd commit 67bd6aa

File tree

10 files changed

+61
-1
lines changed

10 files changed

+61
-1
lines changed
Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
{
2+
"ssrFiles": {
3+
"error": "error-ssr.txt",
4+
"expected": "expected-ssr.html"
5+
}
6+
}
Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
Unknown state: property definition has no key

packages/@lwc/engine-server/src/__tests__/fixtures/wire/errors/computed-prop-updates-incorrectly/error.txt

Whitespace-only changes.

packages/@lwc/engine-server/src/__tests__/fixtures/wire/errors/computed-prop-updates-incorrectly/expected-ssr.html

Whitespace-only changes.
Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
<x-wire>
2+
<template shadowrootmode="open">
3+
<p>
4+
Prop named symbol that should not be used: wire data
5+
</p>
6+
<p>
7+
Prop with symbol key that should be used: unset
8+
</p>
9+
</template>
10+
</x-wire>
Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
export const tagName = 'x-wire';
2+
export { default } from 'x/wire';
3+
export * from 'x/wire';
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
export class adapter {
2+
constructor(dataCallback) {
3+
this.dc = dataCallback;
4+
}
5+
6+
connect() {}
7+
8+
update(config) {
9+
this.dc(config.value);
10+
}
11+
12+
disconnect() {}
13+
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
<template>
2+
<p>Prop named symbol that should not be used: {symbol}</p>
3+
<p>Prop with symbol key that should be used: {symbolValue}</p>
4+
</template>
Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
import { LightningElement, wire } from 'lwc';
2+
import { adapter } from './adapter';
3+
4+
const symbol = Symbol("I'm a symbol!");
5+
export default class extends LightningElement {
6+
symbol = 'accidentally overwritten';
7+
8+
@wire(adapter, { value: 'wire data' })
9+
[symbol] = 'unset';
10+
11+
get symbolValue() {
12+
return this[symbol] ?? 'unset';
13+
}
14+
}

packages/@lwc/ssr-compiler/src/compile-js/index.ts

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -93,7 +93,11 @@ const visitors: Visitors = {
9393
},
9494
PropertyDefinition(path, state) {
9595
const node = path.node;
96-
if (!is.identifier(node?.key)) {
96+
if (!node?.key) {
97+
// Seems to occur for `@wire() [symbol];` -- not sure why
98+
throw new Error('Unknown state: property definition has no key');
99+
}
100+
if (!is.identifier(node.key)) {
97101
return;
98102
}
99103

@@ -107,6 +111,10 @@ const visitors: Visitors = {
107111
is.identifier(decoratedExpression.callee) &&
108112
decoratedExpression.callee.name === 'wire'
109113
) {
114+
if (node.computed) {
115+
// TODO [#5032]: Harmonize errors thrown in `@lwc/ssr-compiler`
116+
throw new Error('@wire cannot be used on computed properties in SSR context.');
117+
}
110118
catalogWireAdapters(path, state);
111119
state.privateFields.push(node.key.name);
112120
} else {
@@ -149,6 +157,7 @@ const visitors: Visitors = {
149157
// not a getter/setter
150158
const isRealMethod = node.kind === 'method';
151159
if (node.computed) {
160+
// TODO [#5032]: Harmonize errors thrown in `@lwc/ssr-compiler`
152161
throw new Error(
153162
`@wire cannot be used on computed ${isRealMethod ? 'method' : 'properties'} in SSR context.`
154163
);

0 commit comments

Comments
 (0)