zappar-xr / zappar-react-three-fiber

Our SDK for the 3D rendering platform React-Three-Fiber.
MIT License
60 stars 9 forks source link

ZapparCamera children are not being loaded after update to 2.1.2 #80

Closed cc-steina closed 1 year ago

cc-steina commented 1 year ago

Describe the bug After updating the package to version 2.1.2 children of ZapparCamera have stopped working at all. Not even a useEffect console log ist being send from an empty Object from a child. The camera is being accessed correctly and shown on the screen, it is just the children that do not work.

To Reproduce Steps to reproduce the behavior:

  1. Create a project with the latest version (2.1.2 at the time of writing)
  2. Add this camera as you would normally:
<ZapparCamera
                userFacing={false}
                permissionRequest={false} // Is turned off because we do it at another point, you might need to set it to true
                name={'camera'}
                environmentMap={true}
                matrixWorldAutoUpdate={false}
            >
                <CustomLoaderProgressor />
 </ZapparCamera>
  1. Create a component named CustomLoaderProgressor:

    const CustomLoaderProgressor: React.FunctionComponent<CustomLoaderProgressorProps> = () => {
    const { progress } = useProgress()
    
    useEffect(() => {
        console.log('INSIDE CUSTOM LOADER PROGRESSOR')
    }, [])
    
    useEffect(() => {
        console.log('Progress: ', progress)
    }, [progress])
    
    return null
    }
  2. You will not see any of the console logs form custom loader progressor in your console

Expected behavior The children should be loaded and working, assigning 3d objects to the camera space (not included in the example but I guess it is an overarching problem with children not being loaded in general)

Desktop (please complete the following information):

Additional context My current dependencies:

"dependencies": {
    "@react-three/drei": "^8.20.2",
    "@react-three/fiber": "^7.0.27",
    "@testing-library/jest-dom": "^5.16.3",
    "@testing-library/react": "^12.1.4",
    "@testing-library/user-event": "^13.5.0",
    "@types/jest": "^26.0.24",
    "@types/node": "^16.11.26",
    "@types/react": "^17.0.43",
    "@types/react-dom": "^17.0.14",
    "@types/three": "^0.143.1",
    "@zappar/zappar-react-three-fiber": "^2.1.2",
    "easy-ease": "^1.0.9",
    "i18next": "^21.8.14",
    "prettier": "^2.7.1",
    "pure-react-carousel": "^1.29.0",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "react-i18next": "^11.18.1",
    "react-responsive-carousel": "^3.2.23",
    "react-scripts": "^5.0.1",
    "sass": "^1.53.0",
    "three": "^0.140.0",
    "typescript": "^4.6.3",
    "use-async-effect": "^2.2.6",
    "use-react-screenshot": "^3.0.0",
    "web-vitals": "^2.1.4"
  },
nyan-left commented 1 year ago

Hi @cc-steina,

Thanks for the bug report.

This should now be fixed in version 2.1.3. To update, simply run:

npm install @zappar/react-three-fiber@2.1.3
# or
yarn add @zappar/react-three-fiber@2.1.3