Fix slot to be transmitted as an attribute, not a property (#465)

.changeset/pink-dryers-fix.md

@@ -0,0 +1,6 @@
+---
+'@remote-dom/preact': patch
+'@remote-dom/core': patch
+---
+
+Fix `slot` to be transmitted as an attribute, not a property

packages/core/source/elements/RemoteElement.ts

@@ -643,7 +643,7 @@ export abstract class RemoteElement<
       attribute === 'slot' &&
       (this.constructor as typeof RemoteElement).slottable
     ) {
-      updateRemoteElementProperty(
+      updateRemoteElementAttribute(
         this,
         attribute,
         newValue ? String(newValue) : undefined,

packages/core/source/tests/elements.test.ts

@@ -788,6 +788,32 @@ describe('RemoteElement', () => {
       ]);
     });
 
+    it('automatically serializes the slot attribute without any additional configuration', () => {
+      const ProductElement = createRemoteElement();
+
+      const receiver = new TestRemoteReceiver();
+
+      const root = createRemoteRootElement();
+      const element = createElementFromConstructor(ProductElement);
+      root.append(element);
+
+      const slot = 'aside';
+      element.setAttribute('slot', slot);
+
+      root.connect(receiver.connection);
+
+      expect(receiver.connection.mutate).toHaveBeenLastCalledWith([
+        [
+          MUTATION_TYPE_INSERT_CHILD,
+          remoteId(root),
+          expect.objectContaining({
+            attributes: {slot},
+          }),
+          0,
+        ],
+      ]);
+    });
+
     it('reflects the value of a remote attribute automatically when the attribute is set', () => {
       const ProductElement = createRemoteElement({
         attributes: ['name'],

packages/preact/source/host/hooks/props-for-element.tsx

@@ -87,7 +87,7 @@ export function usePropsForRemoteElement<
 
   for (const child of children.value) {
     let slot: string | undefined =
-      child.type === 1 ? (child.properties.peek().slot as any) : undefined;
+      child.type === 1 ? (child.attributes.peek().slot as any) : undefined;
 
     if (typeof slot !== 'string') slot = undefined;