test(decorators): add tests for decorated static props (#5314)

wjhsf · web-flow · commit dc11f9ea415c · 2025-04-04T14:25:37.000-06:00
* test(wire): add tests for wired static prop/method

Also add more helpful error message.

* test(api): add karma test for static api prop

* test(api): add karma test for static tracked prop

* test(karma): loosen regex for error message
diff --git a/packages/@lwc/engine-core/src/framework/decorators/register.ts b/packages/@lwc/engine-core/src/framework/decorators/register.ts
@@ -254,7 +254,7 @@ export function registerDecorators(
                     validateMethodDecoratedWithWire(Ctor, fieldOrMethodName, descriptor);
                 }
                 if (isUndefined(descriptor)) {
-                    throw new Error();
+                    throw new Error(`Missing descriptor for wired method "${fieldOrMethodName}".`);
                 }
                 wiredMethods[fieldOrMethodName] = descriptor;
                 storeWiredMethodMeta(descriptor, adapter, configCallback, dynamic);
diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/wire/errors/throws-on-computed-method/error.txt b/packages/@lwc/engine-server/src/__tests__/fixtures/wire/errors/throws-on-computed-method/error.txt
@@ -1 +1 @@
-An empty error occurred?!
+Missing descriptor for wired method "sym".
diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/wire/static-field/config.json b/packages/@lwc/engine-server/src/__tests__/fixtures/wire/static-field/config.json
@@ -0,0 +1,3 @@
+{
+    "entry": "x/wire"
+}
diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/wire/static-field/error.txt b/packages/@lwc/engine-server/src/__tests__/fixtures/wire/static-field/error.txt
diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/wire/static-field/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/wire/static-field/expected.html
@@ -0,0 +1,8 @@
+<fixture-test>
+  <template shadowrootmode="open">
+    wired field value: {
+    key1: foo,
+    key2: [fixed,array],
+}
+  </template>
+</fixture-test>
diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/wire/static-field/modules/x/adapter/adapter.js b/packages/@lwc/engine-server/src/__tests__/fixtures/wire/static-field/modules/x/adapter/adapter.js
@@ -0,0 +1,21 @@
+export default class adapter {
+    constructor(dataCallback) {
+        this.dc = dataCallback;
+    }
+
+    connect() {}
+
+    update(config) {
+        // JSON.stringify serializes differently for engine-server/ssr-compiler, so we do it manually
+        const output = Object.entries(config)
+            .sort(([a], [b]) => a.localeCompare(b))
+            .map(([key, value]) => `    ${key}: ${JSON.stringify(value)},`)
+            .join('\n')
+            // Quotes are encoded as &quot; in the output, which makes it harder to read...
+            .replace(/"/g, '');
+
+        this.dc(`{\n${output}\n}`);
+    }
+
+    disconnect() {}
+}
diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/wire/static-field/modules/x/wire/wire.html b/packages/@lwc/engine-server/src/__tests__/fixtures/wire/static-field/modules/x/wire/wire.html
@@ -0,0 +1,3 @@
+<template>
+    wired field value: {wiredProp}
+</template>
diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/wire/static-field/modules/x/wire/wire.js b/packages/@lwc/engine-server/src/__tests__/fixtures/wire/static-field/modules/x/wire/wire.js
@@ -0,0 +1,9 @@
+import { wire, LightningElement } from 'lwc';
+import WireAdapter from 'x/adapter';
+export default class Test extends LightningElement {
+    @wire(WireAdapter, { key1: '$prop1', key2: ['fixed', 'array'] })
+    // Accidentally marking a wired prop as static doesn't matter
+    static wiredProp;
+
+    prop1 = 'foo';
+}
diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/wire/static-method/config.json b/packages/@lwc/engine-server/src/__tests__/fixtures/wire/static-method/config.json
@@ -0,0 +1,6 @@
+{
+    "entry": "x/wire",
+    "ssrFiles": {
+        "error": "error-ssr.txt"
+    }
+}
diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/wire/static-method/error-ssr.txt b/packages/@lwc/engine-server/src/__tests__/fixtures/wire/static-method/error-ssr.txt
@@ -0,0 +1 @@
+instance.wiredMethod is not a function
diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/wire/static-method/error.txt b/packages/@lwc/engine-server/src/__tests__/fixtures/wire/static-method/error.txt
@@ -0,0 +1 @@
+Missing descriptor for wired method "wiredMethod".
diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/wire/static-method/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/wire/static-method/expected.html
diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/wire/static-method/modules/x/adapter/adapter.js b/packages/@lwc/engine-server/src/__tests__/fixtures/wire/static-method/modules/x/adapter/adapter.js
@@ -0,0 +1,21 @@
+export default class adapter {
+    constructor(dataCallback) {
+        this.dc = dataCallback;
+    }
+
+    connect() {}
+
+    update(config) {
+        // JSON.stringify serializes differently for engine-server/ssr-compiler, so we do it manually
+        const output = Object.entries(config)
+            .sort(([a], [b]) => a.localeCompare(b))
+            .map(([key, value]) => `    ${key}: ${JSON.stringify(value)},`)
+            .join('\n')
+            // Quotes are encoded as &quot; in the output, which makes it harder to read...
+            .replace(/"/g, '');
+
+        this.dc(`{\n${output}\n}`);
+    }
+
+    disconnect() {}
+}
diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/wire/static-method/modules/x/wire/wire.html b/packages/@lwc/engine-server/src/__tests__/fixtures/wire/static-method/modules/x/wire/wire.html
@@ -0,0 +1,3 @@
+<template>
+    wired field value: {externalProp}
+</template>
diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/wire/static-method/modules/x/wire/wire.js b/packages/@lwc/engine-server/src/__tests__/fixtures/wire/static-method/modules/x/wire/wire.js
@@ -0,0 +1,12 @@
+import { wire, LightningElement } from 'lwc';
+import WireAdapter from 'x/adapter';
+export default class Test extends LightningElement {
+    @wire(WireAdapter, { key1: '$prop1', key2: ['fixed', 'array'] })
+    // Accidentally static 💣
+    static wiredMethod(value) {
+        this.externalProp = value;
+    }
+
+    prop1 = 'foo';
+    externalProp;
+}
diff --git a/packages/@lwc/integration-karma/test/component/decorators/api/index.spec.js b/packages/@lwc/integration-karma/test/component/decorators/api/index.spec.js
@@ -11,7 +11,7 @@ import Methods from 'x/methods';
 import Inheritance from 'x/inheritance';
 import NullInitialValue from 'x/nullInitialValue';
 import ExtendsMixin from 'x/extendsMixin';
-
+import StaticProperty from 'x/staticProperty';
 import duplicatePropertyTemplate from 'x/duplicatePropertyTemplate';
 import NoSetter from 'x/noSetter';
 
@@ -61,6 +61,15 @@ describe('properties', () => {
             });
         }).toThrowError();
     });
+
+    it("probably shouldn't work on a static prop, but it does", () => {
+        const elm = createElement('x-static-property', { is: StaticProperty });
+        expect(StaticProperty.staticProperty).toBe('wot');
+        expect(elm.staticProperty).toBe(undefined);
+        elm.staticProperty = 'weird';
+        expect(StaticProperty.staticProperty).toBe('wot');
+        expect(elm.staticProperty).toBe('weird');
+    });
 });
 
 describe('getter/setter', () => {
diff --git a/packages/@lwc/integration-karma/test/component/decorators/api/x/staticProperty/staticProperty.js b/packages/@lwc/integration-karma/test/component/decorators/api/x/staticProperty/staticProperty.js
@@ -0,0 +1,6 @@
+import { LightningElement, api } from 'lwc';
+
+export default class StaticProperty extends LightningElement {
+    // People probably shouldn't do this, but they can...
+    @api static staticProperty = 'wot';
+}
diff --git a/packages/@lwc/integration-karma/test/component/decorators/track/index.spec.js b/packages/@lwc/integration-karma/test/component/decorators/track/index.spec.js
@@ -4,7 +4,7 @@ import Properties from 'x/properties';
 import SideEffect from 'x/sideEffect';
 import NonObservable from 'x/nonObservable';
 import SetTrackedValueToNull from 'x/setTrackedValueToNull';
-
+import StaticProperty from 'x/staticProperty';
 import duplicatePropertyTemplate from 'x/duplicatePropertyTemplate';
 
 it('rerenders the component when a track property is updated - literal', () => {
@@ -31,6 +31,11 @@ it('rerenders the component when a track property is updated - object', () => {
     });
 });
 
+it("doesn't work for decorated static props", () => {
+    const elm = createElement('x-static-property', { is: StaticProperty });
+    expect(() => elm.increment()).toThrowError(/undefined/);
+});
+
 describe('restrictions', () => {
     it('logs an error when updating a track property during render', () => {
         const elm = createElement('x-side-effect', { is: SideEffect });
diff --git a/packages/@lwc/integration-karma/test/component/decorators/track/x/staticProperty/staticProperty.js b/packages/@lwc/integration-karma/test/component/decorators/track/x/staticProperty/staticProperty.js
@@ -0,0 +1,8 @@
+import { LightningElement, api, track } from 'lwc';
+
+export default class Properties extends LightningElement {
+    @track static obj = { value: 0 };
+    @api increment() {
+        this.obj.value += 1;
+    }
+}

Original file line number	Diff line number	Diff line change
`@@ -254,7 +254,7 @@ export function registerDecorators(`
`254`	`254`	`validateMethodDecoratedWithWire(Ctor, fieldOrMethodName, descriptor);`
`255`	`255`	`}`
`256`	`256`	`if (isUndefined(descriptor)) {`
`257`		`- throw new Error();`
	`257`	+ throw new Error(`Missing descriptor for wired method "${fieldOrMethodName}".`);
`258`	`258`	`}`
`259`	`259`	`wiredMethods[fieldOrMethodName] = descriptor;`
`260`	`260`	`storeWiredMethodMeta(descriptor, adapter, configCallback, dynamic);`
Original file line number	Diff line number	Diff line change
`@@ -1 +1 @@`
`1`		`-An empty error occurred?!`
	`1`	`+Missing descriptor for wired method "sym".`
Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,3 @@`
	`1`	`+<template>`
	`2`	`+ wired field value: {wiredProp}`
	`3`	`+</template>`