Objects are not valid as a child

[grisxa]

Hi, I'm quite new to fluid and trying to setup a simple project with the preact-cli:

npx preact-cli create simple preact-fluid-test
cd preact-fluid-test
npm install preact-fluid --save

Then I replace the default index.js page with the following:

import { Button } from 'preact-fluid';
import './style';

export default function App() {
	return (
		<Button>
			Hello, World!
		</Button>
	);
}

And run npm run dev. However, I can see just an empty page in the browser and the following error in the DevTools:

Uncaught Error: Objects are not valid as a child. Encountered an object with the keys {nodeName,children,attributes,key}.

  in Button
  in App

    at eval (debug.js?8a89:328:1)
    at Array.forEach (<anonymous>)
    at preact__WEBPACK_IMPORTED_MODULE_0__.options.diffed (debug.js?8a89:340:1)
    at preact__WEBPACK_IMPORTED_MODULE_0__.options.diffed (index.js?a1c1:62:1)
    at j (index.js?5962:267:1)
    at w (children.js?36d0:137:1)
    at j (index.js?5962:211:1)
    at w (children.js?36d0:137:1)
    at j (index.js?5962:211:1)
    at P (render.js?e2d9:16:1)

The package.json

{
  "private": true,
  "name": "preact-fluid-test",
  "version": "0.0.0",
  "license": "MIT",
  "scripts": {
    "build": "cross-env NODE_OPTIONS=--openssl-legacy-provider preact build",
    "serve": "sirv build --port 8080 --cors --single",
    "dev": "cross-env NODE_OPTIONS=--openssl-legacy-provider preact watch",
    "lint": "eslint src"
  },
  "eslintConfig": {
    "extends": "preact"
  },
  "eslintIgnore": [
    "build/*"
  ],
  "devDependencies": {
    "cross-env": "^7.0.3",
    "eslint": "^7.17.0",
    "eslint-config-preact": "^1.1.3",
    "jest": "^29.3.1",
    "preact-cli": "^3.0.0",
    "sirv-cli": "^1.0.3"
  },
  "dependencies": {
    "preact": "^10.1.0",
    "preact-fluid": "^0.9.1",
    "preact-render-to-string": "^5.1.2"
  }
}

[MarkJB]

I'm seeing this too.

Pretty much exactly the same setup - default preact-cli setup, installed preact fluid, tried to show a button in various places and getting the same error:

        
       Uncaught (in promise) Error: Objects are not valid as a child. Encountered an object with the keys {nodeName,children,attributes,key,__,__b}.