PLANK
Explore posts from serversTTCTheo's Typesafe Cult
•Created by PLANK on 5/19/2023 in #questions
how to use client side rendering in the next js ? i didn't find anything in the docs ?
hello
how to use client side rendering in the next js ? i didn't find anything in the docs ?
4 replies
TTCTheo's Typesafe Cult
•Created by PLANK on 2/11/2023 in #questions
get icon from mui dynamicly
hello im trying to dynamicly load icon from mui this is the code
import React from "react";
import * as MuiIcons from "@mui/icons-material";
console.log("MuiIcons: ", MuiIcons);
const Icon = ({ iconName }) => {
return <div>{MuiIcons[iconName]}</div>;
};
export default Icon;
but i get this error instead
react-dom.development.js:14887 Uncaught Error: Objects are not valid as a React child (found: object with keys {$$typeof, type, compare}). If you meant to render a collection of children, use an array instead.
at throwOnInvalidObjectType (react-dom.development.js:14887:9)
at reconcileChildFibers2 (react-dom.development.js:15828:7)
at reconcileChildren (react-dom.development.js:19167:28)
at updateHostComponent (react-dom.development.js:19924:3)
at beginWork (react-dom.development.js:21618:14)
at HTMLUnknownElement.callCallback2 (react-dom.development.js:4164:14)
at Object.invokeGuardedCallbackDev (react-dom.development.js:4213:16)
at invokeGuardedCallback (react-dom.development.js:4277:31)
at beginWork$1 (react-dom.development.js:27451:7)
at performUnitOfWork (react-dom.development.js:26557:12)
any idea how to solve it ? thank you in advance
19 replies
TTCTheo's Typesafe Cult
•Created by PLANK on 10/31/2022 in #questions
How to mock useRef using playwright component testing ?
hello I'm writing test for a component with ref. I'd like to mock the ref element and change some properties but have no idea how to. Any suggestions?
import { test, expect } from "@playwright/experimental-ct-react";
import { useState } from "react";
import { useRef } from "react";
import Main from "./index";
test.use({ viewport: { width: 500, height: 500 } });
test("should work", async ({ mount }) => {
const refMain = useRef();
const refFooter = useRef();
const refMenuButton = useRef();
const [mainPostion, setMainPostion] = useState(startMainPostion);
const refContainerForMainFooter = useRef({
refMain,
refFooter,
refMenuButton,
});
const component = await mount(
<Main setMainPostion={setMainPostion} theme='light' ref={ref} />
);
// await expect(component).toContainText('DAMAN');
});
1 replies
TTCTheo's Typesafe Cult
•Created by PLANK on 10/19/2022 in #questions
The current domain is not authorized for OAuth operations
hello everyone i have vite app and i used firebase google auth . it works fine but when i deploy it on vercel it give me this error :
The current domain is not authorized for OAuth operations. This will prevent signInWithPopup, signInWithRedirect, linkWithPopup and linkWithRedirect from working. Add your domain (todomarwenlabidi.vercel.app) to the OAuth redirect domains list in the Firebase console -> Auth section -> Sign in method tab.
this is my app link : https://todomarwenlabidi.vercel.app/
and i added the domain to authorized domains look this photo
https://i.stack.imgur.com/HWtKA.png
and this is my firebase config file :
const firebaseConfig = {
apiKey:import.meta.env.VITE_API_KEY ,
authDomain: "todo-app-97ae2.firebaseapp.com",
projectId: "todo-app-97ae2",
storageBucket: "todo-app-97ae2.appspot.com",
messagingSenderId: "540711457418",
appId:import.meta.env.VITE_APP_ID ,
};
1 replies