fix(ssr): update wire adapter validation @ W-17274788 (#4910)

* test(ssr): add test for wire config object

* feat: add wire adapter param validation

* test: add some test fixtures for wire

* test: add test fixtures for wire

* test: refactor tests

* feat: validate that the adapter is an imported module

* feat: add config validation

* feat(ssr): fix wire adapter assumptions

* chore(fixtures): standardize output order

* chore(ssr): unexpect failures

* chore: linter fixes

---------

Co-authored-by: James Tu <j.tu@salesforce.com>
Co-authored-by: Nolan Lawson <nlawson@salesforce.com>
Co-authored-by: Eugene Kashida <ekashida@gmail.com>

Author: 4 people

packages/@lwc/engine-server/src/__tests__/fixtures/wire/config/expected.html

@@ -1,23 +1,20 @@
 <x-wire>
   <template shadowrootmode="open">
     Wire adapter value: {
+    : ,
     0: 0,
-    variable: 4404,
-    prop: not magic,
-    array: [
-        value
-    ],
-    fakeMagic: [
-        $cmpProp,
-        $ string in arrays aren&#x27;t magic
-    ],
-    true: true,
+    array: [value],
+    fakeMagic: [$cmpProp,$ string in arrays aren&#x27;t magic],
     false: false,
-    null: null,
     Infinity: null,
+    magic: 123,
     NaN: null,
-    : ,
-    magic: 123
+    null: null,
+    prop: not magic,
+    true: true,
+    undefined: undefined,
+    variable: 4404,
+    why: undefined,
 }
   </template>
 </x-wire>

packages/@lwc/engine-server/src/__tests__/fixtures/wire/config/modules/x/wire/adapter.js

@@ -6,8 +6,15 @@ export class adapter {
     connect() {}
 
     update(config) {
-        // Quotes are encoded in the output, which is ugly
-        this.dc(JSON.stringify(config, null, 4).replace(/"/g, ''));
+        // 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 " in the output, which makes it harder to read...
+        .replace(/"/g, '');
+
+        this.dc(`{\n${output}\n}`);
     }
 
     disconnect() {}

packages/@lwc/engine-server/src/__tests__/fixtures/wire/field/expected.html

@@ -1,11 +1,8 @@
 <x-wire>
   <template shadowrootmode="open">
     wired field value: {
-    key2: [
-        fixed,
-        array
-    ],
-    key1: foo
+    key1: foo,
+    key2: [fixed,array],
 }
   </template>
 </x-wire>

packages/@lwc/engine-server/src/__tests__/fixtures/wire/field/modules/x/adapter/adapter.js

@@ -6,8 +6,15 @@ export default class adapter {
     connect() {}
 
     update(config) {
-        // Quotes are encoded in the output, which is ugly
-        this.dc(JSON.stringify(config, null, 4).replace(/"/g, ''));
+        // 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 " in the output, which makes it harder to read...
+        .replace(/"/g, '');
+
+        this.dc(`{\n${output}\n}`);
     }
 
     disconnect() {}

packages/@lwc/engine-server/src/__tests__/fixtures/wire/method/expected.html

@@ -1,11 +1,8 @@
 <x-wire>
   <template shadowrootmode="open">
     wired field value: {
-    key2: [
-        fixed,
-        array
-    ],
-    key1: foo
+    key1: foo,
+    key2: [fixed,array],
 }
   </template>
 </x-wire>

packages/@lwc/engine-server/src/__tests__/fixtures/wire/method/modules/x/adapter/adapter.js

@@ -6,8 +6,15 @@ export default class adapter {
     connect() {}
 
     update(config) {
-        // Quotes are encoded in the output, which is ugly
-        this.dc(JSON.stringify(config, null, 4).replace(/"/g, ''));
+        // 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 " in the output, which makes it harder to read...
+        .replace(/"/g, '');
+
+        this.dc(`{\n${output}\n}`);
     }
 
     disconnect() {}

packages/@lwc/ssr-compiler/src/__tests__/utils/expected-failures.ts

@@ -51,9 +51,4 @@ export const expectedFailures = new Set([
     'superclass/render-in-superclass/unused-default-in-subclass/index.js',
     'superclass/render-in-superclass/unused-default-in-superclass/index.js',
     'svgs/index.js',
-    'wire/config/index.js',
-    'wire/deep-reference/index.js',
-    'wire/field/index.js',
-    'wire/imported-member/index.js',
-    'wire/method/index.js',
 ]);

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

@@ -74,7 +74,7 @@ const visitors: Visitors = {
             is.identifier(decoratedExpression.callee) &&
             decoratedExpression.callee.name === 'wire'
         ) {
-            catalogWireAdapters(state, node);
+            catalogWireAdapters(path, state);
             state.privateFields.push(node.key.name);
         } else {
             state.privateFields.push(node.key.name);
@@ -111,7 +111,7 @@ const visitors: Visitors = {
             is.identifier(decoratedExpression.callee) &&
             decoratedExpression.callee.name === 'wire'
         ) {
-            catalogWireAdapters(state, node);
+            catalogWireAdapters(path, state);
         }
 
         switch (node.key.name) {

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

@@ -6,18 +6,21 @@
  */
 
 import type { traverse } from 'estree-toolkit';
-import type { Node } from 'estree';
+import type {
+    Identifier,
+    MemberExpression,
+    MethodDefinition,
+    Node,
+    ObjectExpression,
+    PropertyDefinition,
+} from 'estree';
 
 export type Visitors = Parameters<typeof traverse<Node, ComponentMetaState>>[1];
 
 export interface WireAdapter {
-    fieldName: string;
-    adapterConstructorId: string;
-    config: Array<{
-        configKey: string;
-        referencedField: string;
-    }>;
-    fieldType: 'property' | 'method';
+    adapterId: Identifier | MemberExpression;
+    config: ObjectExpression;
+    field: MethodDefinition | PropertyDefinition;
 }
 
 export interface ComponentMetaState {